如何使用 6 个按钮(如 Windows 磁贴)创建布局
Posted
技术标签:
【中文标题】如何使用 6 个按钮(如 Windows 磁贴)创建布局【英文标题】:How to create layout with 6 buttons like windows tiles 【发布时间】:2013-05-04 05:34:29 【问题描述】:我正在尝试创建一个带有 6 个按钮的布局,这些按钮会自动适应屏幕大小,就像 windows phone 的图块一样。在代码中,我动态创建了 6 个按钮,2 个用于行,但该按钮应适合填充后者的屏幕大小。我该如何继续?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical" >
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up" />
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up"
/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up"
/>
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up"
/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up"
/>
<Button
android:layout_
android:layout_
android:layout_weight="1"
android:background="@drawable/conv_up"
/>
</LinearLayout>
【问题讨论】:
把你现在看到的和你期望的放在一起。否则很难回答。 我什么都看不到,因为这段代码给了我这个错误:“可疑尺寸:这将使视图不可见,应该与 layout_weight 一起使用”在 LinearLayout android:layout_ 问题是由于三个LinearLayout
子级缺少android:layout_weight="1"
属性。我在回答中发布了完整的 XML。
GridLayout 是一个解决方案吗?
【参考方案1】:
我会使用一个垂直的LinearLayout
,三行与孩子的重量相同,每行是一个水平的LinearLayout
,有两个重量相同的孩子,这将确保整个区域都被填满。对于六个按钮,性能应该不是问题。
如果关注性能,您可以将行设为RelativeLayout
s 并使用支柱将其分成两半并根据此定位两个子项。
当我说 strut 时,我的意思是:
<View android:id="@+id/strut"
android:layout_
android:layout_
android:layout_centerHorizontal="true"/>
更新:
由于您正在尝试使用LinearLayout
s,以下是处理高度和宽度的方法:
父 LinearLayout
可以有:
android:layout_
android:layout_
三个LinearLayout
孩子将拥有:
android:layout_
android:layout_
Button
s 将拥有:
android:layout_
android:layout_
如您所见,我们有0dip
用于应用权重的属性(如果父对象是垂直方向,则在高度上,或者如果父对象是水平方向,则在宽度上),它需要增长以填充空间.
这是完整的 XML(按钮不包括可绘制对象,因此请随意添加):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical" >
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:layout_weight="1" >
<Button
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:layout_weight="1" >
<Button
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:layout_weight="1"/>
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
android:layout_weight="1" >
<Button
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
结果:
【讨论】:
我用 xml 代码编辑了我的问题。但是使用此代码时,我在屏幕上无法正确显示按钮时遇到问题android:layout_width="0dip"
是所有Button
s 宽度所需要的。
你没有改变Button
s,但是LinearLayout
s。
用你需要的高度和宽度更新答案。
我在 LinearLayout android:layout_ 上出现此错误“可疑大小:这将使视图不可见,应与 layout_weight 一起使用”【参考方案2】:
我觉得你应该看看GridView
【讨论】:
Windows tile 也有拆分单元格,GridView 有什么帮助?【参考方案3】:使用网格布局!这非常适合这种情况
<GridLayout
android:layout_
android:layout_
android:layout_margin="0.5dp"
android:columnCount="2"
android:rowCount="3" >
<Button
android:id="@+id/b_1"
/>
<Button
android:id="@+id/b_2"
/>
<Button
android:id="@+id/b_3"
/>
<Button
android:id="@+id/b_4"
/>
<Button
android:id="@+id/b_5"
/>
<Button
android:id="@+id/b_6"
/>
</GridLayout>
【讨论】:
【参考方案4】:我正在使用 Android .v7
库。这个 xml 为我创建了填满整个屏幕的 2 列 3 行布局:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/lib/android.support.v7.widget.GridLayout"
android:layout_
android:layout_
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:layout_margin="0.5dp"
app:columnCount="2"
app:rowCount="3"
app:useDefaultMargins="true">
<Button
android:id="@+id/b_1"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="0"
grid:layout_column="0"
android:text="Hellooo"/>
<Button
android:id="@+id/b_2"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="0"
grid:layout_column="1"
android:text="Hellooo"/>
<Button
android:id="@+id/b_3"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="1"
grid:layout_column="0"
android:text="Hellooo"/>
<Button
android:id="@+id/b_4"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="1"
grid:layout_column="1"
android:text="Hellooo"/>
<Button
android:id="@+id/b_5"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="2"
grid:layout_column="0"
android:text="Hellooo"/>
<Button
android:id="@+id/b_6"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_row="2"
grid:layout_column="1"
android:text="Hellooo"/>
</android.support.v7.widget.GridLayout>
【讨论】:
以上是关于如何使用 6 个按钮(如 Windows 磁贴)创建布局的主要内容,如果未能解决你的问题,请参考以下文章
在 WPF 中重新排列列表框项目(如 Windows 8 开始屏幕磁贴)
IBM Worklight 6.1 - 来自推送通知的磁贴徽章从未在 Windows Phone 8 上清除