Android相对布局

时间:2013-11-02 01:37:07

标签: android icons relativelayout tablelayout

enter image description here

我正在寻找在android中完成以下内容的最佳布局。这类似于将要重复的行。

当前行由5个视图控件(两个图像和三个文本标签)组成。

我很确定我可以使用嵌套的表格布局来处理它。但是,从我到目前为止所读到的。使用相对布局可以更好地处理它。

有什么想法吗?如果您可以在帖子中包含示例布局,那就太棒了。

谢谢,

2 个答案:

答案 0 :(得分:1)

在大多数情况下,相对布局是您应该使用的。您可以使用

等属性在“相对布局”中定位视图
android:alignParentTop="true" // This puts the view at the top of the Relative Layout

android:layout_below="@id/view" // This puts the view below another view

我现在无法对其进行测试,但这里是我如何使用相对布局实现您的示例:

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

    <ImageView
            android:id="@+id/ivBigImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
        android:src="@drawable/bigImage" 
            android:layout_centerVertical="true" />

        <ImageView
            android:id="@+id/ivSmallImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/smallImage"
            android:layout_toRightOf="@id/ivBigImage"/>

        <TextView 
            android:id="@+id/tvTextOne"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Plus"
            android:layout_toRightOf="@id/ivSmallImage" />

        <TextView 
            android:id="@+id/tvTextTwo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Google Plus"
            android:layout_toRightOf="@id/ivBigImage" 
            android:layout_below="@id/ivSmallImage/>

        <TextView 
            android:id="@+id/tvTextThree"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="use to do some social networking"
            android:layout_toRightOf="@id/ivBigImage" 
            android:layout_below="@id/tvTextTwo/>


</RelativeLayout>

当然,你不应该像我在这个例子中那样硬编码字符串:D

答案 1 :(得分:0)

通常,我会使用ListView,因为我可以动态地为每一行添加更多来自另一个布局的项目。与TableLayout相比,使用ListView的好处是,如果行的内容超出屏幕可以包含的范围,您仍然可以向下滚动屏幕。

但你也可以用ScrollView包装TableLayout来实现同样的目的。

这只是您喜欢编码的方式。在用户方面,您可以使用两种布局实现几乎相似的UI结果。

我做的例子:

1)在我的主要布局中,我将此ListView作为容器。

<ListView android:id="@+id/summary" android:layout_width="match_parent" android:layout_height="match_parent" />

2)然后我为每一行重复添加到ListView创建了另一个名为row.xml的布局。

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="4dp">

<ImageView
    android:layout_width="60dp"
    android:layout_height="60dp"
    android:id="@+id/icon"
    android:layout_gravity="center_vertical|left"
    android:src="@drawable/green_alert"
    android:layout_marginRight="12dp"
    android:layout_marginLeft="6dp"/>

<LinearLayout
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="fill_parent" >

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/tvPNO"
            android:layout_gravity="center_vertical"
            android:textStyle="bold"
            android:maxLines="1"
            android:ellipsize="end"
            android:text="PNO: 001.01"
            android:textColor="#C5EAF8" />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="match_parent"
            android:id="@+id/tvEntry"
            android:layout_gravity="center_vertical"
            android:gravity="right"
            android:textStyle="bold"
            android:maxLines="1"
            android:ellipsize="end"
            android:text="Entry: 1"
            android:textColor="#C5EAF8" />
    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/tvDefoliator"
            android:layout_gravity="center_vertical"
            android:minLines="1"
            android:ellipsize="end"
            android:text="Defoliator: Mahasena Corbetti" />
        <TextView
            android:layout_width="fill_parent"
            android:layout_height="match_parent"
            android:id="@+id/tvLpF"
            android:layout_gravity="center_vertical"
            android:gravity="right"
            android:minLines="1"
            android:ellipsize="end"
            android:text="Larvae: 10" />
    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="35"
            android:gravity="left">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:id="@+id/tvOryctes"
                android:layout_gravity="center_vertical"
                android:minLines="1"
                android:ellipsize="end"
                android:text="Oryctes: " />
            <CheckBox
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:focusable="false"
                android:clickable="false"
                android:id="@+id/cbOryctes" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="35"
            android:gravity="center">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:id="@+id/tvTermite"
                android:layout_gravity="center_vertical"
                android:minLines="1"
                android:ellipsize="end"
                android:text="Termite: "/>
            <CheckBox
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:focusable="false"
                android:clickable="false"
                android:id="@+id/cbTermite"/>
        </LinearLayout>

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="0dp"
            android:layout_height="fill_parent"
            android:layout_weight="30"
            android:gravity="right">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:id="@+id/tvRat"
                android:layout_gravity="center_vertical"
                android:minLines="1"
                android:ellipsize="end"
                android:text="Rat: " />
            <CheckBox
                android:layout_height="wrap_content"
                android:layout_width="wrap_content"
                android:focusable="false"
                android:clickable="false"
                android:id="@+id/cbRat" />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

我在里面使用了1张图片和其他一些视图,它可能与您希望实现的类似。