ListView(列表)主要是用來把數據用列表方式顯示出來,如果只是簡單的列表呈現,可以利用 ArrayAdapter、SimpleCursorAdapter、SimpleAdapter 來達成目的,但如果要做到更複雜的列表,就必須使用 BaseAdapter 來客製化 ListView,如加入圖片、Checkbox… 等等,利用 BaseAdapter 來控制 ListView 每個 Item 的內容與樣式,使到 ListView 的可讀性和功能提升。
Android Studio ListView 加上圖像和 CheckBox |
開發環境:Android Studio 4.0.1 版本
原程式:C:\Development\Development_Android\Android_Project\DIY-Android-007-17 ListView Icon CheckBox
程式:C:\Development\Development_Android\Android_Project\DIY-Android-007-17 ListView Icon CheckBox
ListView 加上圖像和 CheckBox 編程步驟:
- 將 ListView(Mainactivity.java)實體化
- 創建 BaseAdapter,根據資料來改變 ListView Item
- 取得清單資料放到 BaseAdapter
- 在 Layout 配置檔(custom_list_item.xml)裡面放一個自行定義的 ListView
MainActivity.java:
import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.app.Activity; import android.content.Context; import android.util.SparseBooleanArray; import android.view.LayoutInflater; import android.view.View; import android.view.View.OnClickListener; import android.view.ViewGroup; import android.widget.AdapterView; import android.widget.AdapterView.OnItemClickListener; import android.widget.BaseAdapter; import android.widget.CheckBox; import android.widget.CompoundButton; import android.widget.CompoundButton.OnCheckedChangeListener; import android.widget.ImageView; import android.widget.ListView; import android.widget.TextView;
public class MainActivity extends AppCompatActivity { //public class MainActivity extends Activity { private ListView mListView; private static int count = 0; private static boolean isNotAdded = true; private CheckBox checkBox_header; final CustomAdapter adapter = new CustomAdapter(this);
final static String[] mLvData = { "Resistor", "Capacitor", "Inductor", "Diode", "Transistor", "IC", "Sensor", "Fuse", "Connector", "PCB", "Crystal", "LED", "LCD", "Battery" }; SparseBooleanArray mChecked = new SparseBooleanArray();
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mListView = (ListView) findViewById(R.id.list_view);
// To avoid adding multiple times if (isNotAdded) { final View headerView = getLayoutInflater().inflate(R.layout.custom_list_view, mListView, false); checkBox_header = (CheckBox) headerView.findViewById( R.id.checkBox); checkBox_header.setOnClickListener(new OnClickListener() {
@Override public void onClick(View v) { for (int i = 0; i < count; i++) { mChecked.put(i, checkBox_header.isChecked()); } adapter.notifyDataSetChanged(); } });
mListView.addHeaderView(headerView); isNotAdded = false; }
mListView.setAdapter(adapter);
mListView.setOnItemClickListener(new OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { if (position == 0) { } else { position = position - 1; // "-1" If Header is Added } } }); }
// CustomAdapter public class CustomAdapter extends BaseAdapter { Activity sActivity;
public CustomAdapter(final Activity mActivity) { this.sActivity = mActivity; } @Override public int getCount() { count = MainActivity.mLvData.length; return count; }
@Override public Object getItem(int position) { return position; }
@Override public long getItemId(int position) { return position; }
@Override public View getView(final int position, View convertView, ViewGroup parent) { View mView = convertView; if (mView == null) { final LayoutInflater sInflater = (LayoutInflater) sActivity.getSystemService( Context.LAYOUT_INFLATER_SERVICE); mView = sInflater.inflate(R.layout.custom_list_view, null, false); }
final TextView sTV1 = (TextView) mView.findViewById(R.id.textView); final ImageView sIMG = (ImageView) mView.findViewById(R.id.imageView); final CheckBox mCheckBox = (CheckBox) mView.findViewById( R.id.checkBox);
sTV1.setText(MainActivity.mLvData[position]); sIMG.setImageResource(R.drawable.logo2);
mCheckBox.setOnCheckedChangeListener( new OnCheckedChangeListener() { @Override public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) { if (isChecked) { mChecked.put(position, isChecked); if (isAllValuesChecked()) { checkBox_header.setChecked(isChecked); } } else { mChecked.delete(position); checkBox_header.setChecked(isChecked); }
} });
mCheckBox.setChecked((mChecked.get(position) == true ? true : false)); return mView; }
protected boolean isAllValuesChecked() { for (int i = 0; i < count; i++) { if (!mChecked.get(i)) { return false; } } return true; } } } |
activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="8dp" tools:context=".MainActivity">
<ListView android:id="@+id/list_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:cacheColorHint="@android:color/transparent" android:dividerHeight="4dp" /> </LinearLayout> |
custom_list_item.xml:
<?xml version="1.0" encoding="utf-8"?> <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="wrap_content" android:background="@android:color/holo_green_light" android:minHeight="40dp" android:padding="4dp" tools:ignore="HardcodedText,ContentDescription">
<!-- ListView Contents --> <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="31dp" android:layout_toRightOf="@+id/imageView" android:text="All Components" android:textSize="21sp" />
<ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="40dp" android:layout_alignParentLeft="true" android:layout_centerVertical="true" android:layout_marginLeft="15dp" android:maxWidth="40dp" android:maxHeight="40dp" android:scaleType="fitXY" android:src="@drawable/logo2" />
<CheckBox android:id="@+id/checkBox" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:focusable="false" android:focusableInTouchMode="false" android:padding="16dp" />
</RelativeLayout> |
ListView 加上圖像和 CheckBox |
沒有留言:
張貼留言