XML 表布局?两个等宽的行充满等宽的按钮?

发布于 2024-09-02 10:27:59 字数 630 浏览 8 评论 0原文

这是我的 XML for 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>

现在我不明白 - 一行和按钮的宽度取决于按钮内的文本。如果两个文本长度相等,可以说:TEXT 可以 - 桌子的一半位于屏幕中间。但是,如果它们具有不同的尺寸 - 让我们说“A”和“这是长按钮”,表格的中心不再位于屏幕中间,因此按钮的宽度不相等......

Here's a part from my XML for LAND format:

<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>

And now what I dont get - the WIDTH of one row and also of the button depends on the TEXT inside the button. If the both texts are equaly long lets say : TEXT its ok - the table half is in the middle of the screen. But if they have different size - lets say "A" and "THIS IS THE LONG BUTTON" the CENTER of the table isnt in the middle of the screen anymore and so the buttons are not equally width...

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

三人与歌 2024-09-09 10:27:59

要在行中放置按钮,其中按钮的大小相同,您需要这样做。

    <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 属性。您不需要表格布局。这些属性告诉布局您的视图应该在父布局中占据相同的空间。

To have buttons in rows where buttons are the same size you need to do.

    <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>

And fill in the other xml properties for your buttons.

The magic is in the layout_weight and width properties. You don't need the Table layout. These properties tell the layout that your views should take up equal space in the parent layout.

甜妞爱困 2024-09-09 10:27:59

很好的例子(最初来自 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>

Nice example (originally from http://androidadvice.blogspot.com/2010/10/tablelayout-columns-equal-width.html)

Tested and working:

<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>

入怼 2024-09-09 10:27:59

除了接受的答案之外:

我遇到了类似的问题,我需要在网格中具有相同列宽的多个图像,因此我使用了表格布局。它有效,但由于图像异步加载,相应的列将占据整个宽度,直到所有列中至少有一张图像。

我使用 Robby Pond 的解决方案解决了这个问题,但它对最后一行不起作用,最后一行不一定有与其他行一样多的图像,当我希望它们适合时,会拉伸这些图像以占用所有可用空间与上面相同的列。为了解决这个问题,我用常规 View 对象填充了该行的剩余空列,并

使用与所有其他图像相同的布局参数:

width = 0,weight = 1。 这解决了问题!

In addition to the accepted answer:

I had a similar problem where I needed several images in a grid with equal column widths, so I used a table layout. It worked, but as the images loaded asynchronously, the corresponding columns would take up the entire width until all columns had at least one image in them.

I solved this using Robby Pond's solution, but it didn't work for the last row, which didn't necessarily have as many images as the other rows, stretching those images to take up all available space when I wanted them to fit in the same columns as above. To combat this, I filled the remaining empty columns of that row with regular View objects,

using the same layout parameters as all the other images:

width = 0, weight = 1. And that solved it!

娜些时光,永不杰束 2024-09-09 10:27:59

试试这个:测试并工作:

1)对于tablelayout设置android:stretchColumns="1"

2)同时设置每个项目(列)layout_width="0dip"并且layout_weight =“1”

3)并且不要设置tablerow的layout_width

        <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>

Try This: Tested and working:

1)For tablelayout set android:stretchColumns="1"

2)Also set each item(column) layout_width="0dip" and layout_weight="1"

3)And do not set layout_width of 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>
﹎☆浅夏丿初晴 2024-09-09 10:27:59

首先,您需要将 android:stretchColumns="*" 添加到 TableLayout。

每个 TableRow 都需要有 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>

First you need to add android:stretchColumns="*" to TableLayout.

Each TableRow needs to have android:layout_weight="1" in order to strech equaly.

Each button in TableRow needs to have android:layout_width="0dp".

Here is some example

 <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>
梦途 2024-09-09 10:27:59

布局片段

<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);
    }
}

The layout snippet

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

The code that programmatically sets layout properties of buttons in the table:

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);
    }
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文