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的列表視圖佈局優化

回答

相關問題