Android布局帮助(类似于venmo)

Question

我是Android的新手，我正在努力了解如何获得一个特定的布局，对吗？谁能解释一下Venmo在安卓应用程序的第一个屏幕上使用哪种布局(在下面的链接中最左边的图片：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>

我想弄明白的是：

如何缩放屏幕宽度和高度的50%，ImageButton

• How如何有一个灵活的高度，以消除边缘或填充，使图像按钮的粘在墙上和彼此。

• 是一个TableLayout，一个很好的布局方法？

• 是否有为ImageButton?

创建图像的指导方针？

谢谢你的帮助。

Answer 1

我是Venmo Android应用程序的开发者。

另一个答案是使用一个可能工作得更好的GridLayout，但Venmo应用程序实际上使用的是表布局。

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

要使图像缩放到等宽，您需要给它们一个0 0dp的layout_width，然后将android:layout_weight设为1。

• 以获得相同的高度，将ImageButton的layout_height设置为fill父级，然后将每一行的权重设置为1。

• --我不完全确定您遇到的是什么边距或填充。如果您像我前面提到的那样对ImageButtons和TableRows进行大小调整，这不应该是一个问题。

• ，我不确定这个问题。使用TableLayout.

• There可能会更好，但我没有遇到使用GridLayout的任何问题，但我建议为您的绘图创建状态，这样用户就可以知道他们何时按下按钮。

下面是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代替，对于边距，有一个控制it..If的属性，只有4个图像会适当地呈现(您想要的50%)，如果您使用网格layout...the gridView教程是很好的actually..have a look http://developer.android.com/resources/tutorials/views/hello-gridview.html