Макет XML-таблицы? Два ряда РАВНОЙ ширины, заполненные кнопками одинаковой ширины?

Вот часть моего формата XML для LAND:

<TableLayout
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_gravity="center"
    android:stretchColumns="*">
<TableRow>    
    <Button
        android:id="@+id/countbutton"
        android:text="@string/plus1"/>      
    <Button
        android:id="@+id/resetbutton"
        android:text="@string/reset" 
        />  
</TableRow>
</TableLayout>

И вот чего я не понимаю - ШИРИНА одной строки, а также кнопки зависит от ТЕКСТА внутри кнопки. Если оба текста одинаково длинные, скажем: ТЕКСТ все в порядке - половина таблицы находится в середине экрана. Но если они имеют разный размер - скажем, «А» и «ЭТО ДЛИННАЯ КНОПКА», ЦЕНТР таблицы больше не находится в середине экрана, и поэтому кнопки не одинаковой ширины...


android xml width android-tablelayout
person Oliver Goossens    schedule 19.05.2010    source источник

Ответы (6)


arrow_upward
91
arrow_downward

Чтобы иметь кнопки в строках, где кнопки имеют одинаковый размер, вам нужно сделать.

    <LinearLayout android:orientation="horizontal" 
         android:layout_width="fill_parent"
         android:layout_height="fill_parent">
         <Button android:layout_weight="1" 
             android:layout_height="wrap_content" 
             android:layout_width="0dip"/>
         <Button android:layout_weight="1" 
             android:layout_height="wrap_content" 
             android:layout_width="0dip"/>
    </LinearLayout>

И заполните другие свойства xml для ваших кнопок.

Магия заключается в свойствах layout_weight и width. Вам не нужен макет таблицы. Эти свойства сообщают макету, что ваши представления должны занимать столько же места в родительском макете.

person Robby Pond    schedule 19.05.2010
comment
Как установить эти значения в коде для динамически создаваемых кнопок? - person Fran Fitzpatrick; 11.09.2011
comment
parant.addView(newView, new LinearLayout.LayoutParams(0/*ширина*/, WRAP_CONTENT, 1/*вес*/)); - person Robby Pond; 12.09.2011
comment
Если вы найдете это через поиск, обратите внимание, что вам нужно сделать android:layout_width=fill_parent или другое значение в LinearLayout. Во время выполнения я получал ошибки о том, как мне нужно указать layout_width, и мне потребовалось некоторое время, чтобы понять, что он жаловался на LinearLayout, а не на содержащиеся элементы с шириной макета с нулевым значением. См. также stackoverflow.com/questions/1177020/. - person Unoti; 30.11.2011
comment
Как мы можем сделать две строки одинаковой высоты? См. мой вопрос stackoverflow.com/q/10779802/720176 - person Amit; 28.05.2012

arrow_upward
4
arrow_downward

В дополнение к принятому ответу:

У меня была аналогичная проблема, когда мне нужно было несколько изображений в сетке с одинаковой шириной столбцов, поэтому я использовал макет таблицы. Это работало, но поскольку изображения загружались асинхронно, соответствующие столбцы занимали всю ширину до тех пор, пока во всех столбцах не было хотя бы одного изображения.

Я решил эту проблему, используя решение Робби Понда, но оно не сработало для последней строки, в которой не обязательно было столько изображений, сколько в других строках, и я растянул эти изображения, чтобы они заняли все доступное пространство, когда я хотел, чтобы они поместились в те же столбцы, что и выше. Чтобы бороться с этим, я заполнил оставшиеся пустые столбцы этой строки обычными объектами View,

используя те же параметры макета, что и все остальные изображения:

width = 0, weight = 1. И это решило проблему!

person may5694    schedule 27.07.2012
comment
это идеальный ответ для макета таблицы +1 - person Harin Kaklotar; 27.06.2019

arrow_upward
4
arrow_downward

Хороший пример (первоначально из http://androidadvice.blogspot.com/2010/10/tablelayout-columns-equal-width.html)

Проверено и работает:

<TableRow>
  <!-- Column 1 -->
  <TextView
     android:id="@+id/tbl_txt1"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 1" />

  <!-- Column 2 -->
  <TextView
     android:id="@+id/tbl_txt2"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 2" />

  <!-- Column 3 -->
  <TextView
     android:id="@+id/tbl_txt3"
     android:layout_width="0dip"
     android:layout_height="wrap_content"
     android:background="@color/red"
     android:textColor="@color/white"
     android:padding="10dip"
     android:layout_margin="4dip"
     android:layout_weight="1"
     android:text="Column 3" />
</TableRow>

person Uros Majeric    schedule 17.04.2014

arrow_upward
1
arrow_downward

Попробуйте это: Проверено и работает:

1) Для tablelayout установите android:stretchColumns="1"

2) Также установите для каждого элемента (столбца) layout_width="0dip" и layout_weight="1"

3) И не устанавливайте layout_width для tablerow

        <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
            android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin"
            android:paddingBottom="@dimen/activity_vertical_margin"
            tools:context="inext.smartshop.CustomerProfile.CustomerProfileView">


        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">


            <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/tablelayout"
            android:stretchColumns="1"
            android:layout_above="@+id/userProfilebtnsignout"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_below="@+id/relativeLayout">

            <TableRow

                android:layout_height="fill_parent"
                android:padding="5dp"
                android:id="@+id/detailsTableRow"
                android:gravity="center_horizontal">

                <TextView

                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="Full Name :  "
                android:layout_width="0dip"
                android:layout_weight="1"
                android:id="@+id/textView8"
                android:gravity="right" />

                <TextView
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="Ram Chhabra"

                android:id="@+id/userProfilename"

                android:gravity="left" />

            </TableRow>

            <TableRow android:padding="5dp"

                android:layout_height="wrap_content">

                <TextView
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="Email Address :  "

                android:id="@+id/textView10"
                android:gravity="right" />

                <TextView
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="[email protected]"
                android:id="@+id/userProfileemail"
                android:gravity="left"
                 />
            </TableRow>

            <TableRow android:padding="5dp">

                <TextView
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="Contact No 1 :  "
                android:id="@+id/textView12"

                android:gravity="right" />

                <TextView
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:text="8130032232"
                android:id="@+id/userProfilecontactone"
                 />
            </TableRow>



            </TableLayout>

        </RelativeLayout>

        </RelativeLayout>
person Ram Chhabra    schedule 13.09.2018

arrow_upward
1
arrow_downward

Сначала вам нужно добавить android:stretchColumns="*" в TableLayout.

Каждая строка таблицы должна иметь android:layout_weight="1", чтобы растягиваться одинаково.

Каждая кнопка в TableRow должна иметь android:layout_width="0dp".

Вот пример

 <TableLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="*"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <TableRow
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <Button
            android:id="@+id/button1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:onClick="onButtonClick"
            android:text="@string/button1" />

        <Button
            android:id="@+id/button2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:onClick="onButtonClick"
            android:text="@string/button2" />
    </TableRow>

    <TableRow
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <Button
            android:id="@+id/button3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:onClick="onButtonClick"
            android:text="@string/button3" />

        <Button
            android:id="@+id/button4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:onClick="onButtonClick"
            android:text="@string/button4" />
    </TableRow>
</TableLayout>
person trokiize    schedule 13.04.2020

arrow_upward
0
arrow_downward

Фрагмент макета

<TableLayout
    android:id="@+id/tablelayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Код, программно задающий свойства макета кнопок в таблице:

public void addButtons(View view) {
    TableLayout tableLayout = (TableLayout) findViewById(R.id.tablelayout);
    Context context = getApplicationContext();
    tableLayout.removeAllViews();

    for (int rowIndex = 0; rowIndex < ROWS; rowIndex++) {
        TableRow row = new TableRow(context);
        for (int columnIndex = 0; columnIndex < COLUMNS; columnIndex++) {
            Button btn = new Button(context);
            LayoutParams buttonParams = new LayoutParams(0,
                    LayoutParams.WRAP_CONTENT, 1f);
            btn.setLayoutParams(buttonParams);
            row.addView(btn);
        }
        tableLayout.addView(row);
    }
}
person npeder    schedule 18.10.2013