如何創建圓角形狀的ListView

Question

如何讓Android變得簡約的ListView，我想提出一個方案中，我在這個風格讓ListView控件：

Adapter.xml：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_marginBottom="5dp" 
    android:layout_marginLeft="10dp" 
    android:layout_marginRight="10dp" 
    android:layout_marginTop="5dp" 
    android:gravity="center_vertical" 
    android:padding="5dip" > 

    <!-- Title Of Song--> 

    <TextView 
     android:id="@+id/title" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_centerVertical="false" 
     android:text="Name" 
     android:textSize="15dip" 
     android:typeface="sans" /> 

    </RelativeLayout> 

Activity.xml：

<?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"  
    > 

    <ListView 
     android:id="@+id/listView1" 
     android:layout_below="@+id/text" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:divider="@android:color/black" 
     android:dividerHeight="1dp" 
     android:layout_marginLeft="10dp" 
     android:layout_marginRight="10dp" 
     android:layout_marginTop="20dp"/> 

</RelativeLayout> 

但我想做出這種簡單的列表[相同的列表SHAPE]，請參見下面的屏幕：

Answer 1

根據您的要求

創建一個在您繪製文件夾的形狀文件。把這個XML中，並改變顏色，按您的要求。

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/shape_my"> 
    <stroke android:width="4dp" android:color="#636161" /> 
    <padding android:left="5dp" 
     android:top="5dp" 
     android:right="5dp" 
     android:bottom="5dp" /> 
    <corners android:radius="24dp" /> 
    <solid android:color="#FFF" /> 
</shape> 

main.xml中

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

    <ListView 
     android:id="@+id/list" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:divider="#b5b5b5" 
     android:dividerHeight="1dp" 
     android:listSelector="@drawable/list_selector" /> 

</LinearLayout> 

在設置背景android:background="@drawable/shape"

list_row.xml

<?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="wrap_content" 
    android:background="@drawable/list_selector" 
    android:orientation="horizontal" 
    android:padding="5dip" > 

    <TextView 
     android:id="@+id/category" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="Category" 
     android:textColor="#040404" 
     android:textSize="15dip" 
     android:textStyle="bold" 
     android:typeface="sans" /> 

    <TextView 
     android:id="@+id/expiry_date" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/category" 
     android:layout_marginTop="1dip" 
     android:text="Text here." 
     android:textColor="#343434" 
     android:textSize="10dip" /> 

    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentRight="true" 
     android:layout_centerVertical="true" 
     android:src="@drawable/arrow" /> 

</RelativeLayout> 

Answer 2

你的代碼需要重新分解爲您的要求。

這些例子可能會幫助你。

1- Simple list with arrow to move forward

2- Advance Custom List with arrow

Update your Layout! with corresponding image for arrow and variable names! 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="5dp" 
     android:layout_marginLeft="10dp" 
     android:layout_marginRight="10dp" 
     android:layout_marginTop="5dp" 
     android:gravity="center_vertical" 
     android:padding="5dip" > 

     <!-- Title Of Song--> 

     <TextView 
     android:id="@+id/title" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignTop="@+id/thumbnail" 
     android:layout_toRightOf="@+id/thumbnail" 
     android:text="Name" 
     android:typeface="sans" 
     android:textSize="15dip"/> 


     <TextView 
     android:id="@+id/artist" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/title" 
     android:textColor="#343434" 
     android:textSize="10dip" 
     android:layout_marginTop="1dip" 
     android:layout_toRightOf="@+id/thumbnail" 
     android:text="Just gona stand there and ..." /> 


     <ImageView android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/arrowImage" 
     android:layout_alignParentRight="true" 
     android:layout_centerVertical="true"/> 

    </RelativeLayout> 

Answer 3

你應該用Google搜索，還有就是幾個例子可用。我跟着是THIS。

Answer 4

嗨，我想你嘗試自定義列表視圖。因爲你創建了這種類型的列表行。

plz去扔下面的鏈接。

http://www.codeproject.com/Articles/507651/Customized-Android-ListView-with-Image-and-Text 

row.xml

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/public_row" 
    android:layout_width="match_parent" 
    android:background="@drawable/button_publicrow_selector" 
    android:layout_height="wrap_content" 
    android:layout_marginTop="10dp"> 

    <ImageView android:layout_width="wrap_content" 
      android:id="@+id/img_public_dealing" 
      android:layout_height="wrap_content" 
      android:background="@drawable/contact_pic" 
      android:layout_centerVertical="true" 
      android:layout_alignParentLeft="true" 
      android:layout_marginLeft="10dp"/> 

    <!-- Right most linear layout --> 
    <LinearLayout android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:orientation="horizontal" 
        android:id="@+id/linear_public_dealing" 
        android:gravity="center_vertical" 
        android:layout_centerVertical="true" 
        android:layout_alignParentRight="true" 
        android:layout_marginRight="3dp"> 

     <Button 
       android:id="@+id/btn_delete" 
       android:layout_width="wrap_content" 
        android:layout_height="40dp" 
        android:text="Leave Pit" 
        android:textColor="#000" 
        android:gravity="center" 
        android:textSize="15dp" 
        android:textStyle="bold" 
        android:visibility="gone"/> 

     <Button 
        android:id="@+id/btn_notification" 
        android:layout_width="wrap_content" 
        android:layout_height="40dp" 
        android:background="@drawable/notification_selector" 
        android:textColor="#fff" 
        android:gravity="center" 
        android:textSize="15dp" 
        android:textStyle="bold"/> 

     <ImageView android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/orange_arrow"/> 

    </LinearLayout> 

    <!-- Center Linear LAyout --> 

    <LinearLayout 
     android:id="@+id/linear_index" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:layout_centerVertical="true" 
     android:gravity="left|top" 
     android:orientation="vertical" 
     android:layout_toLeftOf="@+id/linear_public_dealing" 
     android:layout_toRightOf="@+id/img_public_dealing"> 

     <LinearLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:orientation="horizontal"> 
     <TextView 
        android:id="@+id/txt_pit_name" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="Three Amigos" 
        android:textColor="#000" 
        android:singleLine="true" 
        android:layout_marginLeft="5dp" 
        android:textSize="12dp" 
        android:textStyle="bold"/> 
     <TextView 
        android:id="@+id/txt_index_name" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="(U2000)" 
        android:textColor="#000" 
        android:singleLine="true" 
        android:layout_marginLeft="10dp" 
        android:textSize="12dp" 
        android:textStyle="bold"/> 
     </LinearLayout> 
     <TextView 
        android:id="@+id/txt_profileloss" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="+$100/+50 p" 
        android:textColor="#0a0" 
        android:layout_marginLeft="5dp" 
        android:textSize="10dp" 
        android:textStyle="bold"/> 

      <TextView 
        android:id="@+id/txt_pitid" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:text="id" 
        android:visibility="invisible"/> 

      </LinearLayout> 

</RelativeLayout> 

Answer 5

你可以創建一個列表適配器和你想要的設置佈局。 爲例：

ListAdapter adapter = new SimpleAdapter(
         ListShipsActivity.this, ArrayList, 
         R.layout.layout_as_you_want, new String[] { 
           "item1","item2"}, //elements of the item in the list 
         new int[] { R.id.text_view1, R.id.text_view2 }); //ids of the layout elements 

後，只要你想 在你的情況下，創建佈局XML文件中像這樣

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" 
android:orientation="vertical" > 

<RelativeLayout 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:orientation="horizontal" > 

<TextView 
    android:id="@+id/text_view1" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"/> 

<ImageView 
    android:id="@+id/img_arrow" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="right" 
    android:src="@drawable/arrow"/> 


</RelativeLayout> 

<TextView 
    android:id="@+id/text_view2" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    /> 
</LinearLayout> 

PS：添加箭頭圖像繪製文件夾在您的項目

Answer 6

您需要創建一個自定義適配器來填充自定義類型列表視圖 您可以按照以下步驟通過步驟 步驟1 創建一個類co ntains屬性要他們的數據加載如下

public class Rec { 
private String name; 
private String city; 


public Rec(String name, String city) { 
    super(); 
    this.name = name; 
    this.city = city; 
} 

public String getName() { 
    return name; 
} 
public void setName(String name) { 
    this.name = name; 
} 
public String getCity() { 
    return city; 
} 
public void setCity(String city) { 
    this.city = city; 
} 

}

創建有你的記錄類和它在 如下

public class customAdapter extends ArrayAdapter<Rec> { 
Context context; 
public customAdapter(Context context, int textViewResourceId,List<Rec> objects) { 
    super(context, textViewResourceId, objects); 
    // TODO Auto-generated constructor stub 
    this.context = context; 
} 
@Override 
public View getView(int position, View convertView, ViewGroup parent) { 
    // TODO Auto-generated method stub 

    View view; 
    Rec currentRec = getItem(position); 

    LayoutInflater layoutinflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
    view = layoutinflater.inflate(R.layout.reclist,parent,false); 

    TextView name = (TextView) view.findViewById(R.id.textView1); 
    TextView city = (TextView) view.findViewById(R.id.textView2); 

    name.setText(currentRec.getName()); 
    city.setText(currentRec.getCity()); 

    //return super.getView(position, convertView, parent); 
    return view; 



} 

屬性的定義適配器現在創建Xml查看你想要顯示的如下：

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

<TextView 
    android:id="@+id/textView1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="TextView" 
    android:textSize="16sp" 
    android:textColor="#000000" 
    /> 

<TextView 
    android:id="@+id/textView2" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="TextView" 
    android:layout_below="@id/textView1" /> 

現在創建在其中填充您的列表視圖主類，並相應推數據如下：

public class MainActivity extends Activity { 

private ListView listView; 
List<Rec> recList ; 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    recList = new ArrayList<Rec>(); 

    listView= (ListView) findViewById(R.id.listView1); 

    recList.add(new Rec("Ali","Lahore")); 
    recList.add(new Rec("Tahir","Karachi")); 
    recList.add(new Rec("Qasim","Islamabad")); 
    recList.add(new Rec("Bilal","BWP")); 
    recList.add(new Rec("Akhtar","Pindi")); 

    listView.setAdapter(new customAdapter(this,android.R.layout.simple_list_item_1 ,recList)); 

} 

}

創建主活動的佈局如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent" > 

<ListView 
    android:id="@+id/listView1" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:layout_alignParentTop="true"> 
</ListView> 


<TextView 
    android:id="@+id/textView1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentRight="true" 
    android:layout_alignParentTop="true" 
    android:layout_marginRight="112dp" 
    android:text="TextView" /> 

這裏是你的完整的定製列表視圖與動態數據