Question

我想在屏幕中间显示三个按钮，并且三个按钮的宽度都相同，但它们的文本标签长度不同。

只需添加三个不同长度的文本标签按钮，即可生成不同宽度的按钮。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:gravity="center">
    <Button
        android:id="@+id/button_1"
        android:layout_height="fill_parent"
        android:layout_width="wrap_content"
        android:text="ABCDEF" />
    <Button
        android:id="@+id/button_2"
        android:layout_height="fill_parent"
        android:layout_width="wrap_content"
        android:text="GHI" />
    <Button
        android:id="@+id/button_3"
        android:layout_height="fill_parent"
        android:layout_width="wrap_content"
        android:text="JKLM" />
</LinearLayout>

默认按钮宽度包装内容：
default button width wraps contents

-

在所有按钮上将layout_weight设置为1并将layout_width设置为0dip会使它们均匀拉伸以填充整个屏幕宽度。对于我想要的，这些按钮太大了，特别是在大屏幕上。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:gravity="center">
    <Button
        android:id="@+id/button_1"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="ABCDEF" />
    <Button
        android:id="@+id/button_2"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="GHI" />
    <Button
        android:id="@+id/button_3"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="JKLM" />
</LinearLayout>

布局重量1按钮填充屏幕宽度：
layout weight 1 buttons fill screen width

-

在父LinearLayout中为weightSum设置不同的值可用于阻止按钮填满整个屏幕，但我不认为这是我想要的路径，因为我不希望按钮占用大屏幕设备上的大部分屏幕。为了澄清，使用weightSum，我可以，例如，我可以设置三个按钮共同占据屏幕宽度的一半，这在小屏幕上看起来可以正常，但在大屏幕上，按钮仍然占据屏幕宽度的一半，并且按钮会比我想要的要大得多。也许最终的解决方案是为不同的屏幕设置不同的布局文件，但我不想走这条路。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical"
    android:gravity="center"
    android:weightSum="5">
    <Button
        android:id="@+id/button_1"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="ABCDEF" />
    <Button
        android:id="@+id/button_2"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="GHI" />
    <Button
        android:id="@+id/button_3"
        android:layout_height="fill_parent"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:text="JKLM" />
</LinearLayout>

重量和5小屏幕：

重量和5大屏幕：

-

我也尝试了很多TableLayout，但没有比使用LinearLayout更好的东西。

使用GridView是非常笨拙的，我还没有尝试过。

那么，如何创建宽度相等的按钮，最好只需要宽度足以满足最长标签的按钮内容？

感谢任何建议。

（我确实在搜索并发现了这个问题并多次回答，但我找到的答案都没有解决我想要达到的目标。）

Answer 1

也许最终的解决方案是为不同的屏幕设置不同的布局文件，但我不想走这条路。

许多程序员会使用res/layout/和res/layout-large/来处理这样的情况。在三个按钮的有限情况下，您可能有其他选择，但通常用户界面并不那么简单。

那么，如何创建宽度相等的按钮，最好只需要宽度足以满足最长标签的按钮内容？

要完成“首选”[原文如此]的要求，您需要为此创建自定义布局类。 Here is one related to it，对于仪表板模式，您可以将其用作起点。

Answer 2

如果您事先知道最宽的按钮文字是什么，可以使用android:ems属性将按钮设置为该宽度。

<Button
    android:id="@+id/my_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:minEms="5"
    android:text="@string/my_button" />

它并不完美，但它是我发现实现这种外观的最简单方式，而不会无休止地摆弄布局。

Answer 3

使用Dashboard Fragment类

http://code.google.com/p/iosched/source/browse/android/src/com/google/android/apps/iosched/ui/DashboardFragment.java

Answer 4

我身边还有一个额外的说明！

如果您需要设置在运行时添加的按钮（或具有简单代码更改的任何其他视图）的宽度（或高度），您可以使用下面的代码（它不依赖于方向）：

public void AlignButtons(){
    llModules = (LinearLayout) findViewById(R.id.llModules);

    ViewTreeObserver viewTree = llModules.getViewTreeObserver();
    viewTree.addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
        public boolean onPreDraw() {

            int childcount = llModules.getChildCount();
            int maxWidth = 0; //int maxHeight = 0;

            String fontPath = "fonts/Isabella-Decor.ttf";
            Typeface tf = Typeface.createFromAsset(getAssets(), fontPath);

            for (int i = 0; i < childcount; i++) {
                LinearLayout v = (LinearLayout)llModules.getChildAt(i);
                View vv = v.getChildAt(0);
                if (vv instanceof Button) {
                    int width = vv.getMeasuredWidth();
                    maxWidth = (maxWidth > width) ? maxWidth : width;
                    //int height = vv.getMeasuredHeight();
                    //maxHeight = (maxHeight > height) ? maxHeight : height;
                }
            }
            for (int i = 0; i < childcount; i++) {
                LinearLayout v = (LinearLayout)llModules.getChildAt(i);
                View vv = v.getChildAt(0);
                if (vv instanceof Button) {
                    LayoutParams params = ((Button) vv).getLayoutParams();
                    params.width = maxWidth;
                    //params.height = maxHeight;
                    ((Button) vv).setLayoutParams(params);

                    // Applying font
                    ((Button) vv).setTypeface(tf);
                }
                vv = v.getChildAt(1);
                if (vv instanceof TextView) {
                    // Applying font
                    ((TextView) vv).setTypeface(tf);
                }
            }

            return true;
        }
    });
}

在这里，在我的情况下：

llModule - 包含另一个布局的布局，其中包含我们需要对齐（v.getChildAt(0);）和其他（v.getChildAt(1);）的内容。

LinearLayout v =（LinearLayout）llModules.getChildAt（i）; - 获取要对齐的按钮布局。

其他部分清楚易懂。

此代码中的两个循环完全相同，但我仍然无法想象如何组合它们（以加快执行时间）。

Answer 5

使用此代码可以帮助您。

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:weightSum="3">

<Button
    android:id="@+id/button1"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:text="Get the Time"
    android:onClick="showNewDate" />
<Button
    android:id="@+id/button2"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:text="Get the Time"
    android:onClick="showNewDate" />
<Button
    android:id="@+id/button3"
    android:layout_width="0dp"
    android:layout_weight="1"
    android:layout_height="wrap_content"
    android:text="Get the Time"
    android:onClick="showNewDate" />

Answer 6

将各个按钮保留在其自己的RelativeLayout下。

super.onCreate(savedInstanceState)

Answer 7

阅读此主题，然后进行一些试错，并注意到android:layout_width="180px"是一个可接受的参数。现在如上所述，我只是偶然发现了这一点，并没有尝试使用它来解决你的三个按钮场景。

自从您最初发布以来，情况可能会发生变化。虽然我在为1.5版本构建时尝试了这个。那已经足够了......： - ）

以下是完整的main.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView
        android:id="@+id/dateText"
        android:text="\n\nClick for Date\n\n"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/button"
        android:layout_width="180px"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="Get the Time"
        android:onClick="showNewDate" />

</LinearLayout>

如何创建具有相等宽度的按钮？

7 个答案: