title: How to configure button size so that layout looks the same on both old device as well as new device?
body: <p>I have a fragment that contains a Flow Layout (<a href="https://github.com/ApmeM/android-flowlayout" rel="nofollow noreferrer">https://github.com/ApmeM/android-flowlayout</a>). When this fragment is accessed, my app will programatically add four buttons to the flow layout plus any buttons that the user added themselves, which when clicked on will open the browser or app that I clicked on. Here's a screenshot of what it looks like on my Galaxy Tab S2 (Model SM-T710):</p>
  
  <p><a href="https://i.stack.imgur.com/SQiiE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/SQiiE.png" alt="Video Links tab on Galaxy Tab S2"></a></p>
  
  <p>The top four buttons are provided by a server, and the last button 'FB' is a user defined link that was added by pressing the "Add a Link" button. This user defined link is saved and will also be added programatically the next time the fragment is accessed. I have another device, a Galaxy Tab 4 (Model SM-T530NU) which I believe is an older device when comparing it to the Tab S2. Here is a screenshot on how the layout looks on this tablet: </p>
  
  <p><a href="https://i.stack.imgur.com/rm5a9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rm5a9.png" alt="Fragment on Tab 4"></a></p>
  
  <p>This tablet has a bigger screen yet is still showing only 2 child views in the row. I'm guessing it has something to do with dp vs pixels or something along those lines but does anybody know how I can have it so that the bottom UI matches the top UI? Here is my code that adds the buttons dynamically.You can see the width and height for the button in the getLayoutParams() function.</p>
  
  <pre><code>private void updateFlowLayout(){
          //Get latest list of user and operator defined video links from middleware
          operatorVideoLinkItemList = getContentManager().getOperatorDefinedVideoLinks();
          userVideoLinkItemList = getContentManager().getUserDefinedVideoLinks();
  
          for(VideoLinkItem item : operatorVideoLinkItemList){
              final String url = item.getUrl();
              final ImageButton imageButton = new ImageButton(getActivity());
              FlowLayout.LayoutParams layoutParams = getLayoutParams();
              imageButton.setLayoutParams(layoutParams);
              IDongleCoreImage image = item.getIcon();
              String imageFilePath = image.getImageFilePath();
              imageFilePath = "file://"+imageFilePath;
              Picasso.with(getActivity()).load(imageFilePath).resize(250,150).centerInside().placeholder(R.drawable.app_icon).into(imageButton);
              if(StringUtils.containsIgnoreCase(url,"netflix") || StringUtils.containsIgnoreCase(url,"youtube")){
                  imageButton.setOnClickListener(new View.OnClickListener() {
                      @Override
                      public void onClick(View v) {
                          onYoutubeOrNetflixClick(url);
                      }
                  });
              } else {
                  imageButton.setOnClickListener(new View.OnClickListener() {
                      @Override
                      public void onClick(View v) {
                          onUserLinkClick(url);
                      }
                  });
              }
              videoLinksFlowLayout.addView(imageButton);
          }
  
          //Create buttons for each User Defined Video Link and add to Flow Layout
          for(VideoLinkItem item : userVideoLinkItemList) {
              final String title = item.getTitle();
              final String url = item.getUrl();
              final Button button = new Button(getActivity());
              FlowLayout.LayoutParams layoutParams = getLayoutParams();
              button.setLayoutParams(layoutParams);
              button.setTextSize(15);
              button.setText(title);
              button.setTextColor(getResources().getColor(R.color.app_highlight_yellow_color));
              button.setOnClickListener(new View.OnClickListener() {
                  @Override
                  public void onClick(View v) {
                      onUserLinkClick(url);
                  }
              });
              button.setOnLongClickListener(new View.OnLongClickListener() {
                  @Override
                  public boolean onLongClick(View v) {
                      onLongUserLinkClick(title, url);
                      return false;
                  }
              });
              videoLinksFlowLayout.addView(button);
          }
      }
  
  private FlowLayout.LayoutParams getLayoutParams(){
          FlowLayout.LayoutParams layoutParams;
          if(UiUtils.isTablet()){
              layoutParams = new FlowLayout.LayoutParams(400,300);
              layoutParams.setMargins(0,20,90,0);
          } else {
              layoutParams = new FlowLayout.LayoutParams(420,300);
              layoutParams.setMargins(0,20,50,20);
          }
          return layoutParams;
      }
  </code></pre>
  
  <p>Some ideas I have that maybe someone with more experience can guide me on:
  - I can perhaps use the DisplayMetrics class to measure the display metrics of this screen and based on that, set the layout parameters. This seems very hackish though.</p>