Question

我是Android新手，我正在尝试了解如何正确使用特定布局？任何人都可以解释Venmo在Android应用的第一个屏幕上使用哪种布局（在以下链接中留下最左边的图像：http://30.media.tumblr.com/tumblr_lak5yachMv1qcl8xuo1_500.png）

我尝试创建类似于学习目的的布局，但无法正确使用。这是我的示例布局代码：

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http``://schemas.android.com/apk/res/android"
android:orientation="vertical" 
android:id="@+id/tableLayout1" 
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:background="#fff"
android:scrollbars="none">
<TableRow 
    android:layout_height="wrap_content" 
    android:id="@+id/tableRow1">
    <ImageButton 
        android:layout_height="wrap_content" 
        android:id="@+id/imageButton5" 
        android:background="@drawable/icon" 
        android:layout_width="wrap_content"
        android:layout_weight="1">
    </ImageButton>
</TableRow>    
<TableRow 
    android:layout_height="wrap_content" 
    android:id="@+id/tableRow2">
        <TextView 
            android:text="TextView" 
            android:id="@+id/textView1" 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:layout_weight="1">
        </TextView>
</TableRow>
<TableRow 
    android:id="@+id/tableRow3" 
    android:layout_height="wrap_content"
    android:layout_margin="0dip"
    android:padding="0px"
    android:background="#ff6600">
        <ImageButton 
            android:layout_width="fill_parent" 
            android:layout_height="wrap_content" 
            android:id="@+id/imageButton1" 
            android:background="@drawable/icon"
            android:gravity="left"
            android:layout_weight="1">
        </ImageButton>
        <ImageButton 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:id="@+id/imageButton2" 
            android:background="@drawable/icon"
            android:gravity="right"
            android:layout_weight="1">
        </ImageButton>
</TableRow>
<TableRow 
    android:id="@+id/tableRow4" 
    android:layout_height="wrap_content">
        <ImageButton 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:id="@+id/imageButton3" 
            android:background="@drawable/icon"
            android:gravity="left"
            android:layout_weight="1">
        </ImageButton>
        <ImageButton 
            android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:id="@+id/imageButton4" 
            android:background="@drawable/icon"
            android:gravity="right"
            android:layout_weight="1">
        </ImageButton>
</TableRow>
</TableLayout>

我想弄清楚的是：

如何将ImageButton缩放到屏幕宽度和高度的50％
如何拥有ImageButton的灵活高度
如何摆脱边缘上的边距或填充物，使ImageButton贴在墙上和彼此之间。
TableLayout是这种布局的好方法吗？
是否有为ImageButton创建图像的指南？

感谢您的帮助。

Answer 1

我是Venmo Android应用的开发者。

另一个答案建议使用可能更好的GridLayout，但Venmo应用实际上是使用表格布局。

以下是每个问题的答案......

要使图像缩放到相等宽度，您需要为它们设置layout_width为0dp，然后将android：layout_weight设置为1。
要获得相同的高度，请将ImageButton的layout_height设置为填充父级，然后将每个表格行的权重设置为1.
我不完全确定你遇到了什么边距或填充。如果像上面提到的那样调整ImageButtons和TableRows的大小，这应该不是问题。
我不确定这个。 GridLayout可能效果更好，但我没有遇到使用TableLayout的任何问题。
没有任何官方指南，但我建议为您的drawable创建状态，以便用户可以告诉他们何时按下按钮。

以下是Venmo应用程序如何创建网格的示例代码：

<TableLayout android:layout_width="fill_parent" android:layout_height="fill_parent">

<TableRow android:layout_weight="1">

    <ImageButton android:layout_width="0dp"
        android:layout_weight="1" 
        android:layout_height="fill_parent" 
        android:src="@drawable/top_left"
        android:layout_marginRight="2sp"
        android:layout_marginBottom="2sp"
        android:background="@drawable/button"/>             

    <ImageButton android:layout_width="0dp"
        android:layout_weight="1" 
        android:layout_height="fill_parent"
        android:src="@drawable/top_right"
        android:layout_marginBottom="2sp"
        android:background="@drawable/button"/> 

</TableRow>

<TableRow android:layout_weight="1">

    <ImageButton android:layout_width="0dp"
        android:layout_weight="1" 
        android:layout_height="fill_parent" 
        android:src="@drawable/bottom_left"
        android:layout_marginRight="2sp"
        android:background="@drawable/button"/>

    <ImageButton android:layout_width="0dp"
        android:layout_weight="1" 
        android:layout_height="fill_parent" 
        android:src="@drawable/bottom_right"
        android:background="@drawable/button"/>

</TableRow></TableLayout>

请记住，如果屏幕的体积小于ImageButton的可绘制屏幕，那么您将遇到问题。此外，如果您这样做，您肯定希望为横向方向制作单独的布局。

Answer 2

使用gridLayout代替，并且对于边距，有一个控制它的属性。如果你只有4个图像，如果你使用网格布局，它们将适当地渲染（你想要的50％s）... gridView教程实际上非常好......看看http://developer.android.com/resources/tutorials/views/hello-gridview.html

Android布局帮助（类似于venmo）

2 个答案: