Android的列表视图布局优化

在创建列表视图布局时，建议尽可能简单地使用相对布局和最少的图像和文本使布局尽可能简单，或者可以使它们更有一点花色并且可以使用几个按钮一个或两个图像，以及tablelayouts内的一些文本？Android的列表视图布局优化

我想尽量减少点击/触摸到相关的信息，并给用户一个更好的用户界面来玩，而不是一个沼泽标准列表。

我试图研究它，但无法找到设计布局和列表视图的限制guidlines。

东西告诉我下面的xml是窒息listview经验，如果结果集增长到超过20说的原因？

谢谢。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" android:background="@color/White" android:gravity="center"> 
<TableLayout android:layout_height="wrap_content" android:id="@+id/tableLayout1" android:layout_width="fill_parent"> 
    <TableRow android:id="@+id/tableRow1" android:layout_height="wrap_content" android:layout_width="fill_parent"> 
     <LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/linearLayout2"> 
      <ImageView android:layout_marginRight="10px" android:layout_width="60dip" android:layout_marginTop="4px" android:id="@+id/icon" android:layout_height="60dip" android:src="@drawable/indian" android:layout_marginLeft="4px"></ImageView> 
      <TableLayout android:layout_height="match_parent" android:id="@+id/tableLayout2" android:layout_width="fill_parent"> 
       <TableRow android:id="@+id/tableRow5" android:layout_height="wrap_content" android:layout_width="fill_parent"> 
        <TextView android:focusableInTouchMode="false" android:paddingTop="5dip" android:textColor="@color/Black" android:id="@+id/title" android:textSize="18dip" android:layout_height="wrap_content" android:maxLines="10" android:layout_gravity="left" android:focusable="false" android:layout_width="fill_parent" android:text="@+id/label"></TextView> 
       </TableRow> 
       <TableRow android:id="@+id/tableRow6" android:layout_width="wrap_content" android:layout_height="wrap_content"> 
        <TextView android:textColor="@color/Black" android:layout_height="wrap_content" android:id="@+id/distanceText" android:textSize="12dip" android:layout_width="wrap_content" android:gravity="center" android:layout_gravity="left" android:text="TextView"></TextView> 
       </TableRow> 
      </TableLayout> 
     </LinearLayout> 
    </TableRow> 
    <TableRow android:id="@+id/tableRow2" android:layout_height="wrap_content" android:layout_width="wrap_content" android:paddingBottom="15dip"> 
     <LinearLayout android:id="@+id/linearLayout3" android:layout_width="wrap_content" android:layout_height="wrap_content"> 
      <TableLayout android:layout_height="match_parent" android:id="@+id/tableLayout3" android:layout_width="fill_parent"> 
       <TableRow android:layout_height="match_parent" android:id="@+id/tableRow8" android:layout_width="fill_parent"> 
        <ImageView android:id="@+id/introImage" android:layout_height="wrap_content" android:layout_width="fill_parent" android:scaleType="fitStart" android:paddingLeft="8dip"></ImageView> 
       </TableRow> 
       <TableRow android:id="@+id/tableRow4" android:layout_width="wrap_content" android:layout_height="wrap_content"> 
        <TextView android:linksClickable="true" android:textColor="@color/Black" android:layout_height="wrap_content" android:focusable="false" android:text="more" android:autoLink="all" android:textColorLink="@color/Aqua" android:textSize="12dip" android:clickable="true" android:paddingRight="5dip" android:id="@+id/intro" android:paddingTop="5dip" android:focusableInTouchMode="false" android:paddingLeft="5dip" android:layout_width="wrap_content"></TextView> 
       </TableRow> 
       <TableRow android:id="@+id/tableRow7" android:layout_width="wrap_content" android:layout_height="wrap_content"> 
        <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/description" android:text="description" android:visibility="invisible" android:paddingLeft="5dip" android:paddingRight="5dip" android:textColor="@color/Black" android:textSize="12dip" android:autoLink="all" android:clickable="true" android:linksClickable="true" android:textColorLink="@color/DarkGray"></TextView> 
       </TableRow> 
      </TableLayout> 
     </LinearLayout> 
    </TableRow> 
    <TableRow android:id="@+id/tableRow3" android:layout_height="wrap_content" android:layout_width="fill_parent" android:background="@drawable/listviewmenu" android:layout_gravity="center_horizontal" android:gravity="center_horizontal"> 
     <LinearLayout android:layout_height="wrap_content" android:id="@+id/linearLayout1" android:layout_width="fill_parent" android:layout_gravity="center" android:gravity="center"> 
      <Button android:id="@+id/mapClick" android:layout_height="wrap_content" android:text="@string/map_info" android:layout_width="wrap_content" android:background="@drawable/actionbutton" android:textColor="@color/White" android:textColorHighlight="@color/AntiqueWhite" android:textStyle="bold" android:gravity="center"></Button> 
      <Button android:id="@+id/moreClick" android:layout_height="wrap_content" android:text="@string/more_info" android:layout_width="wrap_content" android:textColor="@color/White" android:textColorHighlight="@color/Aqua" android:textStyle="bold" android:gravity="center" android:background="@drawable/actionmore"></Button> 
     </LinearLayout> 
    </TableRow> 
</TableLayout>

来源

2012-01-13 johnjoshua

买了一些非常好的信息在这里：[罗曼盖伊] [1] [1]：http://www.youtube.com/watch?v=N6YdwzAvwOA – johnjoshua 2012-01-13 11:07:42

以下是相同的布局，但只用一个RelativeLayout：

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

    <ImageView 
     android:id="@+id/icon" 
     android:layout_width="60dip" 
     android:layout_height="60dip" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentTop="true" 
     android:layout_marginLeft="4px" 
     android:layout_marginRight="10px" 
     android:layout_marginTop="4px" 
     android:src="@android:drawable/dialog_frame" > 
    </ImageView> 

    <TextView 
     android:id="@+id/title" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@+id/icon" 
     android:focusable="false" 
     android:focusableInTouchMode="false" 
     android:maxLines="10" 
     android:paddingTop="5dip" 
     android:text="@+id/label" 
     android:textColor="@android:color/black" 
     android:textSize="18dip" > 
    </TextView> 

    <TextView 
     android:id="@+id/distanceText" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/title" 
     android:layout_gravity="left" 
     android:layout_toRightOf="@+id/icon" 
     android:gravity="center" 
     android:text="TextView" 
     android:textColor="@android:color/black" 
     android:textSize="12dip" > 
    </TextView> 

    <ImageView 
     android:id="@+id/introImage" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/icon" 
     android:paddingLeft="8dip" 
     android:scaleType="fitStart" > 
    </ImageView> 

    <TextView 
     android:id="@+id/intro" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/introImage" 
     android:autoLink="all" 
     android:clickable="true" 
     android:focusable="false" 
     android:focusableInTouchMode="false" 
     android:linksClickable="true" 
     android:paddingLeft="5dip" 
     android:paddingRight="5dip" 
     android:paddingTop="5dip" 
     android:text="more" 
     android:textColor="@android:color/black" 
     android:textColorLink="@android:color/primary_text_light" 
     android:textSize="12dip" > 
    </TextView> 

    <TextView 
     android:id="@+id/description" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_below="@+id/intro" 
     android:autoLink="all" 
     android:clickable="true" 
     android:linksClickable="true" 
     android:paddingLeft="5dip" 
     android:paddingRight="5dip" 
     android:text="description" 
     android:textColor="@android:color/black" 
     android:textColorLink="@android:color/darker_gray" 
     android:textSize="12dip" 
     android:visibility="invisible" > 
    </TextView> 

    <LinearLayout 
     android:id="@+id/linearLayout1" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:gravity="center" 
     android:background="@android:drawable/dialog_frame" > 

     <Button 
      android:id="@+id/mapClick" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@android:drawable/dialog_frame" 
      android:text="map_info" 
      android:textColor="@android:color/white" 
      android:textColorHighlight="@android:color/secondary_text_light" 
      android:textStyle="bold" > 
     </Button> 

     <Button 
      android:id="@+id/moreClick" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@android:drawable/dialog_frame" 
      android:gravity="center" 
      android:text="more_info" 
      android:textColor="@android:color/white" 
      android:textColorHighlight="@android:color/primary_text_light" 
      android:textStyle="bold" > 
     </Button> 
    </LinearLayout> 
</RelativeLayout>

我只是改变color，string和drawable引用，看看它是否有效！

RelativeLayout rulez！

来源

2012-01-13 11:52:30

我只剩下最后一个'LinearLayout'，因为它有一个背景，否则你也可以删除它。另一件事：不要使用** px **，而要使用** dp **。 – 2012-01-13 11:58:59

辉煌，绝对辉煌。 – johnjoshua 2012-01-13 12:35:27

建议保持ListView项目简单的布局 - 和我的意思是快速的表演。简单并不意味着乏味:)

RelativeLayout s为最好的一个ListView，因为他们只需要一个传球渲染的行，而不是说，嵌套LinearLayout S（如提到here）。但是，如果您必须超越简单并在您的行中加入一些花哨的东西，那么平台提供了一些技巧来帮助您。

使用convertView优化 - 即，在Adapter的getView()方法，检查，看看是否convertView参数为null。如果它不是那么只是使用该对象，并修改它与新的价值，而不是膨胀一个新的。
即使您使用上述选项1，也可以使用ViewHolder模式来避免通货膨胀;还优化了“用新值修改行”的步骤。这在this talk中描述。

来源

2012-01-13 11:10:08 curioustechizen

只是需要从别人听到它在知道。谢谢你的清楚解释。 – johnjoshua 2012-01-13 12:36:22

Android的列表视图布局优化

回答

相关问题