Android ListView 自定义(标题、描述、详细信息、页脚)

Android ListView Customization (title, description, details, footer)

由于我是 Android 的新手,我正在努力设计一个将成为我的列表视图行的自定义布局。我喜欢我的列表视图行应该包含标题描述、详细信息和页脚。我的列表视图行保存数据,如我附加的图像。请看附图

在这种情况下,您必须自定义适配器。

其实Relative更适合做设计。但现在我将使用 LinearLayout 来编写,以便于编写。

这是列表视图项的自定义布局...

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

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:text="Title"
        android:background="@android:color/holo_red_light"
        android:gravity="center"/>

    <LinearLayout
        android:layout_width="match_parent"    
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <TextView
            android:layout_width="0dp"
            android:layout_height="60dp"
            android:layout_weight="1"
            android:gravity="center"
            android:background="@android:color/holo_green_light"
            android:text="DESC"/>

        <TextView
            android:layout_width="0dp"
            android:layout_height="60dp"
            android:layout_weight="1"
            android:gravity="center"
            android:background="@android:color/holo_blue_light"
            android:text="Other Detais"/>

        </LinearLayout>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:text="Footer"
        android:background="@android:color/holo_red_light"
        android:gravity="center"/>

</LinearLayout>

复制并修改以上答案 Hein Htet Aung

<TextView
    android:id="@+id/title"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:layout_marginLeft="10dp"
       android:layout_marginRight="10dp"
    android:text="Title"
    android:background="@android:color/holo_red_light"
    android:gravity="center"/>

<LinearLayout
    android:layout_width="match_parent"    
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center"
        android:padding="20dp"
        android:background="@android:color/holo_green_light"
        android:text="DESC"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:padding="20dp"
        android:layout_weight="1"
        android:gravity="center"
        android:background="@android:color/holo_blue_light"
        android:text="Other Detais"/>

    </LinearLayout>

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="15dp"
    android:text="Footer"
    android:background="@android:color/holo_red_light"
    android:gravity="center"/>

您必须先创建 your_layout_row.xml

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="60dp"
 android:orientation="horizontal"
 android:layout_margin="14dp" 
>
<LinearLayout
        android:layout_width="60dp"
        android:layout_height="60dp"
         >
        <ImageView
     android:id="@+id/imageView"
     android:layout_width="wrap_content"
     android:paddingLeft="10dp"
     android:layout_height="60dp"
     />
    </LinearLayout>


 <TextView
     android:gravity="center_vertical"
     android:paddingBottom="10dp"
     android:paddingRight="5dp"
     android:id="@+id/textView"
     android:layout_width="match_parent"
     android:layout_height="60dp"
     android:layout_gravity="center_vertical"
     android:layout_marginLeft="20dp"
     android:text="TextView"
     android:textStyle="normal|italic"
     android:textSize="17dp" />


</LinearLayout>

现在您有了列表视图布局。

<?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="@color/TaskList_layout_background_color"
    >



                <ListView
                    android:id="@+id/lv_list"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_margin="5dp"

                    android:dividerHeight="10dp"
                    android:paddingBottom="5dp"
                   android:paddingLeft="10dp"
                    android:paddingRight="10dp"
                    android:paddingTop="5dp" >
                </ListView>



</RelativeLayout>

现在创建您的 class 模型

例如:

class ModelClass
{
String text;

public ModelClass(String _text)
{
text =  _text;
}

public String getText()
{
return this.text;
}

}

现在创建您的自定义适配器 class

public class CustomAdapter extends ArrayAdapter<ModelClass> {

    // declaring our ArrayList of items
    private ArrayList<ModelClass> objects;

    /* here we must override the constructor for ArrayAdapter
    * the only variable we care about now is ArrayList<Item> objects,
    * because it is the list of objects we want to display.
    */
    public CustomAdapter(Context context, int textViewResourceId, ArrayList<ModelClass> objects) {
        super(context, textViewResourceId, objects);
        this.objects = objects;
    }

    /*
     * we are overriding the getView method here - this is what defines how each
     * list item will look.
     */
    @Override
    public View getView(int position, View convertView, ViewGroup parent){

        // assign the view we are converting to a local variable
        View v = convertView;

        // first check to see if the view is null. if so, we have to inflate it.
        // to inflate it basically means to render, or show, the view.
        if (v == null) {
            LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = inflater.inflate(R.layout.your_layout_row null);
        }

        /*
         * Recall that the variable position is sent in as an argument to this method.
         * The variable simply refers to the position of the current object in the list. (The ArrayAdapter
         * iterates through the list we sent it)
         * 
         * Therefore, i refers to the current Item object.
         */
        ModelClass i = objects.get(position);

        if (i != null) {

            // This is how you obtain a reference to the TextViews.
            // These TextViews are created in the XML files we defined.

            TextView tt = (TextView) v.findViewById(R.id.textView);


            // check to see if each individual textview is null.
            // if not, assign some text!


            if (tt != null){
                tt.setText( objects.get(position).getText());
            }

        }

        // the view must be returned to our activity
        return v;

    }

}

现在在您的主 activity 中将您的列表视图适配器设置为此自定义适配器。

ArrayList<MyModel> myList = new new ArrayList<MyModel>();
myList.add("1");
myList.add("2");
myList.add("3");
myList.add("4");
ListView myListView = (ListView)findViewById(R.id.lv_list);
CustomAdapter adapter= new CustomAdapter(acitivity, 0, myList);

myListView.setAdapter(adapter);