如何使用 6 个按钮创建布局，例如 Windows 瓷砖 [英] How to create layout with 6 buttons like windows tiles

问题描述

我正在尝试创建一个带有 6 个按钮的布局，这些按钮可以像 windows 手机的磁贴一样自动适应屏幕大小.在代码中，我动态创建了 6 个按钮，2 个用于行，但按钮应适合填充后者的屏幕大小.我该如何继续?

I'm trying to create a layout with 6 buttons that automatically adapt to the screen size as the tiles of windows phone. In the code I create dynamically the 6 button, 2 for line but the button should fit the size of the screen filling the latter. how can I proceed?

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

<LinearLayout
    android:layout_width="match_parent"
        android:layout_height="0dip"
    android:orientation="horizontal"
    android:weightSum="2" >

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up" />

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up"
         />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
        android:layout_height="0dip"
    android:orientation="horizontal"
    android:weightSum="2" >

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up"
        />

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up"
         />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
        android:layout_height="0dip"
    android:orientation="horizontal"
    android:weightSum="2" >

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up"
         />

    <Button
        android:layout_width="0dip"
                android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="@drawable/conv_up"
        />

</LinearLayout>

推荐答案

我会使用一个垂直的 LinearLayout，其中三行与子项的权重相同，每行是一个水平的 LinearLayout 有两个相同权重的孩子，这将确保整个区域都被填满.对于六个按钮，性能应该不是问题.

I'd use a vertical LinearLayout with three rows of same weight as children, each row being a horizontal LinearLayout having two children of same weights, which will make sure the full area is filled. For six buttons performance shouldn't be an issue.

如果性能是一个问题，您可以将行设置为 RelativeLayout 并使用支柱将其分成两半并基于此定位两个子项.

If performance is a concern, you can make the rows as RelativeLayouts and use a strut to split in half and position the two children based on that.

当我说strut时，我的意思是:

When I say a strut, I mean this:

<View android:id="@+id/strut"
    android:layout_width="0dp"
    android:layout_height="0dp" 
    android:layout_centerHorizontal="true"/>

更新:由于您正在尝试 LinearLayouts，以下是处理高度和宽度的方法:

Update: Since you're trying the LinearLayouts, here's how you can deal with the heights and widths:

父 LinearLayout 可以有:

android:layout_width="match_parent"
android:layout_height="match_parent"

三个 LinearLayout 孩子将拥有:

android:layout_width="match_parent"
android:layout_height="0dip"

Button 将具有:

android:layout_width="0dip"
android:layout_height="match_parent"

如您所见，我们有 0dip 用于应用权重的属性(如果父项垂直定向，则为高度，如果父项为水平方向，则为宽度)，这将需要增长填空.

As you can notice, we have 0dip for the property that weight is applied on (either on height if parent is vertical oriented, or width if parent is horizontal oriented), which will need to grow to fill in the space.

这是完整的 XML(按钮不包含可绘制对象，因此请随意添加您的):

Here's the full XML (buttons don't include drawables, so feel free to add yours):

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:orientation="horizontal"
        android:layout_weight="1" >

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:orientation="horizontal"
        android:layout_weight="1" >

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:orientation="horizontal"
        android:layout_weight="1" >

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1" />

        <Button
            android:layout_width="0dip"
            android:layout_height="match_parent"
            android:layout_weight="1" />
    </LinearLayout>
</LinearLayout>

结果:

这篇关于如何使用 6 个按钮创建布局，例如 Windows 瓷砖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！