android自訂ListView詳解

來源:互聯網
上載者:User

在這裡我就對自訂ListView進行講解下吧,直入真題吧,首先我新建立一個項目:listDemo;

 其次,我們需要建立一個XML檔案,在這裡我就直接寫在main.xml裡:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<ListView 
 android:id="@+id/listView"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    />
</LinearLayout>
然後我們需要定義一個ITEM.XML來顯示其資料:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <ImageView
     android:id="@+id/images_id"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:src="@drawable/icon"
     />
    <LinearLayout
     android:orientation="vertical"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     >
     <TextView
      android:id="@+id/text_id"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="default_001"
      />
     <TextView
      android:id="@+id/text_info"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="default_info" 
      />
     <TextView
      android:id="@+id/text_url"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="default_url"
      />
      
     </LinearLayout> 
</LinearLayout>

現在我們把XML檔案做好了,就是對其適配資料的布局進行定義了,首先我們需要建立一個類:

package com.jsd;

import java.util.ArrayList;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.widget.ListView;

import com.jsd.adapter.AppAdapter;
import com.jsd.model.AppInfos;

/**
 * ListView customer
 * @author jiangshide
 *
 */
public class Demo extends Activity {
 
 private Context mContext;
 private ListView listView;
 private ArrayList<AppInfos> appInfos;
 private AppAdapter appAdapter;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);
  getComponenets();
 }
 
 /**
  * componenet
  */
 public void getComponenets(){
  this.mContext = this;
  listView = (ListView) findViewById(R.id.listView);
  appInfos = new ArrayList<AppInfos>();
  loadDatas();
  appAdapter = new AppAdapter(mContext,appInfos);
  listView.setAdapter(appAdapter);
 }
 
 /**
  * load datas
  */
 public void loadDatas(){
  for (int i = 0; i < 10; i++) {
   AppInfos ai = new AppInfos();
   if(i == 1){
    ai.setImages(R.drawable.icon);
   }else if(i == 2){
    ai.setImages(R.drawable.item1);
   }else if(i == 3){
    ai.setImages(R.drawable.item2);
   }else if(i == 4){
    ai.setImages(R.drawable.item3);
   }else if(i == 5){
    ai.setImages(R.drawable.item4);
   }else if(i == 6){
    ai.setImages(R.drawable.item5);
   }
   ai.setText_id("001");
   ai.setText_infos("這是我們都需要注意的...");
   ai.setText_url("http://jiangshide.com");
   appInfos.add(ai);
  }
 }
}

這位主線程的UI類,

其實需要穿件一個適配器需要繼承BaseAdapter:

package com.jsd.adapter;

import java.util.ArrayList;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;

import com.jsd.model.AppInfos;
import com.jsd.view.AppView;

/**
 * Adapter
 * @author jiangshide
 *
 */
public class AppAdapter extends BaseAdapter {

 private Context mContext;
 private ArrayList<AppInfos> appInfos;
 
 public AppAdapter(Context c) {
  this.mContext = c;
 }
 
 public AppAdapter(Context c,ArrayList<AppInfos> appInfos) {
  this.mContext = c;
  this.appInfos = appInfos;
 }
 
 public int getCount() {
  return appInfos.size();
 }

 public Object getItem(int position) {
  return appInfos.get(position);
 }

 public long getItemId(int position) {
  return position;
 }

 /**
  * get view
  */
 public View getView(int position, View convertView, ViewGroup parent) {
  if(appInfos == null){
   return null;
  }
  if(convertView == null){
   AppView appView = new AppView(mContext);
   appView.updateView(appInfos.get(position));
   convertView = appView;
  }else{
   ((AppView)convertView).updateView(appInfos.get(position));
  }
  return convertView;
 }

}

為了對其資料進行適配,我們需要對資料進行持久話:使用BEAN的方式進行儲存

package com.jsd.model;

/**
 * datas
 * @author jiangshide
 *
 */
public class AppInfos {

 private int images;
 private String text_id;
 private String text_infos;
 private String text_url;
 
 public int getImages() {
  return images;
 }
 public void setImages(int images) {
  this.images = images;
 }
 public String getText_id() {
  return text_id;
 }
 public void setText_id(String textId) {
  text_id = textId;
 }
 public String getText_infos() {
  return text_infos;
 }
 public void setText_infos(String textInfos) {
  text_infos = textInfos;
 }
 public String getText_url() {
  return text_url;
 }
 public void setText_url(String textUrl) {
  text_url = textUrl;
 }
}

再次就是對View顯示布局的控制項進行定義來對資料參數的擷取

package com.jsd.view;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.jsd.R;
import com.jsd.model.AppInfos;

/**
 * View
 * @author jiangshide
 *
 */
public class AppView extends LinearLayout {

 private Context mContext;
 private ImageView image_id;
 private TextView text_id,text_info,text_url;
 
 /**
  *
  * @param context
  */
 public AppView(Context context) {
  super(context);
  this.mContext = context;
  initilize(context);
 }
 
 /**
  *
  * @param c
  */
 public void initilize(Context c){
  this.mContext = c;
  View view = LayoutInflater.from(this.mContext).inflate(R.layout.item, null);
  image_id = (ImageView) view.findViewById(R.id.images_id);
  text_id = (TextView) view.findViewById(R.id.text_id);
  text_info = (TextView) view.findViewById(R.id.text_info);
  text_url = (TextView) view.findViewById(R.id.text_url);
  addView(view);
 }
 
 /**
  *
  * @param ai
  */
 public void updateView(AppInfos ai){
  image_id.setImageResource(ai.getImages());
  text_id.setText(ai.getText_id());
  text_info.setText(ai.getText_infos());
  text_url.setText(ai.getText_url());
 }
}

OK,以上就是完整的代碼實現對ListView的自訂的實現,

下個小結我開始講GridView的自訂顯示方式,同樣會以完整的代碼顯示方式來實現。。。。。。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.