Can Buttons in a GridLayout become narrower instead of being cropped?

Question

I have a GridLayout containing several Buttons. The translated text for the buttons is often longer than the English original, and this makes the buttons wider. I'd prefer that the text wraps across multiple lines if necessary, making the buttons less wide, so the buttons can still fit in the row. By default the GridLayout just seems to draw parts of buttons, or whole buttons, offscreen.

Here is a screenshot of the layout preview in Android Studio.

Here is the layout XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/table_detail"
    style="?android:attr/textAppearanceLarge"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <GridLayout
        android:id="@+id/layoutAnswers"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnCount="4"
        android:orientation="horizontal" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button2" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button3" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button4" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button"
            android:id="@+id/button5" />
    </GridLayout>

</LinearLayout>

I've tried using the lines property, which just makes the buttons taller without wrapping the text. And I've tried various gravity and layout:gravity values. I'd prefer not to manually specify the newlines in the translations.

You want a Flow layout instead. Something like http://stackoverflow.com/questions/4474237/how-can-i-do-something-like-a-flowlayout-in-android — Machinarius, Oct 02 '14 at 19:34
Yes, I've considered that, but I'd actually like to keep the fixed number of columns, and have the buttons line up in columns. I just need the buttons to be automatically narrower to achieve that. — murrayc, Oct 02 '14 at 19:40
Since the columns are 4, set a weight of 1 to each button, you may have to scale down your text, but 4 buttons will be shown the way you want. — Evan Bashir, Oct 02 '14 at 19:42
"GridLayout does not provide support for the principle of weight": http://developer.android.com/reference/android/widget/GridLayout.html — murrayc, Oct 02 '14 at 19:52

murrayc · Accepted Answer · 2014-10-03T17:05:50.283

Using a TableLayout instead, with TableLayout.setShrinkAllColumns() lets the buttons shrink to fit the available width.

Now I wish I could make them all the same width, but that's not what I asked initially. Update: TableLayout columns have equal widths when the TableRow's child views have width=0 and weight=1 (or something that's the same for all views). The TableRow must then have width=FILL_PARENT or the views just won't appear at all (at least for me).

Can Buttons in a GridLayout become narrower instead of being cropped?

1 Answers1