1

OK this is a problem that has bugged be for ages. I am looking to put 5 buttons, in a horizontal line, at the top of the android screen. These buttons must all be 20% of the width of the screen in width (so that they all fit alongside each other with no gaps) on ANY phone.

I just can't figure out the XML. How can I do this? Does anyone have any ideas/samples? Thanks!

prolink007
  • 33,872
  • 24
  • 117
  • 185
Conor Taylor
  • 2,998
  • 7
  • 37
  • 69

2 Answers2

4

For the button row, use a horizontal linear layout the full width of the screen, put all the buttons in it, and give the buttons a layout width of 0 and equal layout weight > 0:

<LinearLayout
     . . .
     android:layout_width="match_parent"
     android:orientation="horizontal"
     />

     <Button
         . . .
         android:layout_width="0"
         android:layout_weight="1"
         />

     <Button
         . . .
         android:layout_width="0"
         android:layout_weight="1"
         />

     . . .
</LinearLayout>
Ted Hopp
  • 232,168
  • 48
  • 399
  • 521
  • 1
    To add to this, if you need NO gap whatsoever between them, you'll need to add your own custom background for the buttons, as on most versions of the OS, the 9-patch background includes some outer padding. – Kevin Coppock Jul 18 '12 at 17:45
  • This works fine for me as i am trying 3 buttons in the same row too but the problem is thatthe last letter of the last button goes to a second line which i don't want to.Any ideas ? :/ – Vaggelis Manousakis Sep 13 '18 at 20:44
  • 1
    @VaggelisManousakis - If you're using the compatibility library or you are targeting API 26 or later, you can autosize your text views (see [here](https://developer.android.com/guide/topics/ui/look-and-feel/autosizing-textview) for documentation). Also, there's a library [here](https://github.com/marcouberti/android-auto-fit-button) (perhaps now obsolete) that can do that dynamically for you. I haven't used it, so I can't vouch for it, but it sounds like what you need. You can also explicitly reduce the text size for your button. See [this thread](https://stackoverflow.com/q/18343720/535871). – Ted Hopp Sep 13 '18 at 22:12
  • 1
    @VaggelisManousakis - It occurs to me that if you have several buttons, you might want to ensure that they all have the same text size. I don't think any of the auto-resizing solutions in my previous comment will support that. You may have to fall back to doing the auto-resizing in your own code. (You may be able to inject logic at the container level that sets all the buttons to smallest text size after the buttons themselves have adjusted their text size independently to fit.) – Ted Hopp Sep 13 '18 at 22:15
  • Hadn't thought that the text font size would fix the problem, you are right.I am new in Android development and your answer really helped out.Thanks – Vaggelis Manousakis Sep 14 '18 at 14:21
3
<LinearLayout
    ...
    layout_width = "match_parent"
    layout_height = "wrap_content" />

    <Button
        ....
        layout_width = "0dp"
        layout_height = "wrap_content"
        layout_weight = 1 />

    <Button
        ....
        layout_width = "0dp"
        layout_height = "wrap_content"
        layout_weight = 1 />

    <Button
        ....
        layout_width = "0dp"
        layout_height = "wrap_content"
        layout_weight = 1 />

    <Button
        ....
        layout_width = "0dp"
        layout_height = "wrap_content"
        layout_weight = 1 />

    <Button
        ....
        layout_width = "0dp"
        layout_height = "wrap_content"
        layout_weight = 1 />

</LinearLayout>
Iñigo
  • 12,723
  • 2
  • 31
  • 31