學習Android的第十九天

Android ExpandableListView 分組列表

ExpandableListView 屬性

ExpandableListView 事件

ExpandableListView 的 Adapter

范例

參考文檔

Android ViewFlipper 翻轉視圖

ViewFlipper 屬性

ViewFlipper 方法

為 ViewFlipper 加入 View

例子：全屏幕可以滑動的引導頁

參考文檔

Android ExpandableListView 分組列表

Android 的 ExpandableListView（分組列表）是一個可以展開和收起的列表控件，通常用于顯示具有層次結構的數據，類似于微信通訊錄中的分組列表。

在 ExpandableListView 中，第一層是分組（Group），第二層是每個分組下的子項（Child）。用戶可以點擊分組來展開或收起相應的子項。這種設計能夠更好地組織和展示有層次結構的數據，提供更好的用戶體驗。

ExpandableListView 屬性

android:childDivider：指定各組內子列表項之間的分隔條。默認情況下是一條直線，你可以設置該屬性來改變分隔條的樣式。
android:childIndicator：指定顯示在子列表旁邊的 Drawable 對象，可以是一個圖像。這個指示器可以幫助用戶識別哪些分組可以展開或收起。
android:childIndicatorEnd、android:childIndicatorLeft、android:childIndicatorRight、android:childIndicatorStart：這些屬性用于指定子列表項指示符（child indicator）的位置和約束。你可以使用這些屬性來調整子列表項指示符的位置。
android:groupIndicator：指定顯示在組列表旁邊的 Drawable 對象，可以是一個圖像。這個指示器可以幫助用戶識別組的位置和狀態。
android:indicatorEnd、android:indicatorLeft、android:indicatorRight、android:indicatorStart：這些屬性用于指定組列表項指示器（group indicator）的位置和約束。你可以使用這些屬性來調整組列表項指示器的位置。

ExpandableListView 事件

OnChildClickListener：當用戶點擊分組列表的子項時觸發。可以使用這個事件來處理子項被點擊后的邏輯，例如顯示詳細信息或執行其他操作。
OnGroupClickListener：當用戶點擊分組列表的分組項時觸發。可以使用這個事件來處理分組項被點擊后的邏輯，例如展開或收起分組，或執行其他操作。
OnGroupCollapseListener：當分組列表的分組折疊時觸發。可以使用這個事件來處理分組折疊后的邏輯，例如更新 UI 或執行其他操作。
OnGroupExpandListener：當分組列表的分組展開時觸發。可以使用這個事件來處理分組展開后的邏輯，例如加載數據或執行其他操作。

ExpandableListView 的 Adapter

對于 ExpandableListView 的適配器（Adapter），有三種常見的實現方式：

繼承 BaseExpandableListAdapter 實現 ExpandableAdapter：這是一種自定義適配器的方式，你需要創建一個類繼承自 BaseExpandableListAdapter，并實現其中的方法，包括獲取組數、獲取指定組中的子項數、獲取指定位置處的子項、獲取指定位置處的組等。這種方式適用于自定義需求較復雜的情況，可以完全控制適配器的行為和樣式。
使用 SimpleExpandableListAdapter 將兩個 List 集合包裝成 ExpandableAdapter： SimpleExpandableListAdapter 是一個簡單的適配器類，用于將兩個 List 集合（一個用于存儲組數據，另一個用于存儲子項數據）包裝成 ExpandableListView 所需的適配器。這種方式適用于數據比較簡單的情況，不需要自定義適配器，只需要將數據進行簡單的包裝即可。
使用 SimpleCursorTreeAdapter 將 Cursor 中的數據包裝成 SimpleCursorTreeAdapter： SimpleCursorTreeAdapter 是專門用于將 Cursor 中的數據包裝成 ExpandableListView 所需的適配器。如果你的數據存儲在數據庫中，并使用 Cursor 進行查詢，那么你可以使用 SimpleCursorTreeAdapter 來將 Cursor 中的數據以樹形結構展示在 ExpandableListView 中。

范例

1、修改 activity_main.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="match_parent"android:orientation="vertical"android:gravity="center"><ExpandableListViewandroid:id="@+id/expandableListView"android:layout_width="match_parent"android:layout_height="match_parent" />
</LinearLayout>

2、修改 MainActivity.java

package com.example.myapplication;import android.os.Bundle;
import android.widget.ExpandableListView;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;public class MainActivity extends AppCompatActivity {ExpandableListView expandableListView;List<String> listGroup;HashMap<String, List<String>> listItem;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);expandableListView = findViewById(R.id.expandableListView);// 準備數據prepareListData();// 創建并設置適配器MyAdapter adapter = new MyAdapter(this, listGroup, listItem);expandableListView.setAdapter(adapter);// 設置分組項點擊監聽器expandableListView.setOnGroupClickListener((parent, v, groupPosition, id) -> {Toast.makeText(MainActivity.this,"Group Clicked " + listGroup.get(groupPosition),Toast.LENGTH_SHORT).show();return false;});// 設置子項點擊監聽器expandableListView.setOnChildClickListener((parent, v, groupPosition, childPosition, id) -> {Toast.makeText(MainActivity.this,"單擊的子項 " + listItem.get(listGroup.get(groupPosition)).get(childPosition),Toast.LENGTH_SHORT).show();return false;});}// 準備數據private void prepareListData() {listGroup = new ArrayList<>();listItem = new HashMap<>();listGroup.add("水果");listGroup.add("蔬菜");listGroup.add("動物");List<String> fruits = new ArrayList<>();fruits.add("蘋果");fruits.add("香蕉");fruits.add("芒果");List<String> vegetables = new ArrayList<>();vegetables.add("胡蘿卜");vegetables.add("菠菜");vegetables.add("番茄");List<String> animals = new ArrayList<>();animals.add("狗");animals.add("貓");animals.add("大象");listItem.put(listGroup.get(0), fruits);listItem.put(listGroup.get(1), vegetables);listItem.put(listGroup.get(2), animals);}
}

3、創建適配器類 MyAdapter.java

package com.example.myapplication;import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.TextView;
import java.util.HashMap;
import java.util.List;public class MyAdapter extends BaseExpandableListAdapter {private Context context;private List<String> listGroup;private HashMap<String, List<String>> listItem;public MyAdapter(Context context, List<String> listGroup, HashMap<String, List<String>> listItem) {this.context = context;this.listGroup = listGroup;this.listItem = listItem;}@Overridepublic int getGroupCount() {return listGroup.size();}@Overridepublic int getChildrenCount(int groupPosition) {return listItem.get(listGroup.get(groupPosition)).size();}@Overridepublic Object getGroup(int groupPosition) {return listGroup.get(groupPosition);}@Overridepublic Object getChild(int groupPosition, int childPosition) {return listItem.get(listGroup.get(groupPosition)).get(childPosition);}@Overridepublic long getGroupId(int groupPosition) {return groupPosition;}@Overridepublic long getChildId(int groupPosition, int childPosition) {return childPosition;}@Overridepublic boolean hasStableIds() {return false;}@Overridepublic View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {String groupTitle = (String) getGroup(groupPosition);if (convertView == null) {LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);convertView = inflater.inflate(R.layout.list_group, null);}TextView textView = convertView.findViewById(R.id.listTitle);textView.setText(groupTitle);return convertView;}@Overridepublic View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {String childTitle = (String) getChild(groupPosition, childPosition);if (convertView == null) {LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);convertView = inflater.inflate(R.layout.list_item, null);}TextView textView = convertView.findViewById(R.id.expandedListItem);textView.setText(childTitle);return convertView;}@Overridepublic boolean isChildSelectable(int groupPosition, int childPosition) {return true;}
}

4、創建布局文件 list_group.xml 和 list_item.xml 用于分組和子項的視圖：

list_group.xml：

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/listTitle"android:layout_width="match_parent"android:layout_height="wrap_content"android:padding="15dp"android:textColor="@android:color/black"android:textSize="20sp" />

list_item.xml：

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"android:id="@+id/expandedListItem"android:layout_width="match_parent"android:layout_height="wrap_content"android:padding="15dp"android:textColor="@android:color/darker_gray"android:textSize="18sp" />

參考文檔

Android ExpandableListView

Android ViewFlipper 翻轉視圖

ViewFlipper 是 Android 中的一個 View 容器，可以用來展示多個子 View，并且支持通過動畫切換這些子 View。通常用于制作引導頁、輪播圖等功能。

ViewFlipper 屬性

ViewFlipper 的兩個屬性 android:autoStart 和 android:flipInterval 分別用于控制輪播的自動開始和輪播的時間間隔。

android:autoStart: 這個屬性用于設置是否自動開始輪播。如果將其設置為 true，則 ViewFlipper 將會自動開始輪播子 View；如果設置為 false，則需要手動調用 startFlipping() 方法來開始輪播，默認值為 true。
android:flipInterval: 這個屬性用于設置輪播時的時間間隔，單位為毫秒。可以通過設置這個屬性來調整輪播的速度，默認值為 3000 毫秒（即 3 秒）。

ViewFlipper 方法

setInAnimation(Animation inAnimation): 設置 View 進入屏幕時使用的動畫。通過傳入一個 Animation 對象來設置進入動畫效果。
setOutAnimation(Animation outAnimation): 設置 View 退出屏幕時使用的動畫。通過傳入一個 Animation 對象來設置退出動畫效果。
showNext(): 調用該方法來顯示 ViewFlipper 里的下一個 View。即切換到下一個子 View。
showPrevious(): 調用該方法來顯示 ViewFlipper 的上一個 View。即切換到上一個子 View。
setFlipInterval(int milliseconds): 設置 View 之間切換的時間間隔，單位為毫秒。
setAutoStart(boolean autoStart): 設置是否自動開始切換所有的 View。如果設為 true，ViewFlipper 會使用上面設置的時間間隔來開始切換所有的 View，切換會循環進行；如果設為 false，則需要手動調用 startFlipping() 方法來開始切換。
startFlipping(): 使用上面設置的時間間隔來開始切換所有的 View，切換會循環進行。
stopFlipping(): 停止 View 切換。調用該方法后，ViewFlipper 將不再自動切換 View。

為 ViewFlipper 加入 View

<?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"android:gravity="center"><ViewFlipperandroid:id="@+id/viewFlipper"android:layout_width="match_parent"android:layout_height="match_parent"android:autoStart="true"android:flipInterval="3000"><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/guide_1"android:scaleType="centerCrop"/><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/guide_2"android:scaleType="centerCrop"/><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/guide_3"android:scaleType="centerCrop"/><ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:src="@drawable/guide_4"android:scaleType="centerCrop"/></ViewFlipper>
</LinearLayout>

例子：全屏幕可以滑動的引導頁

1、activity_main.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="match_parent"android:orientation="vertical"android:gravity="center"><androidx.viewpager.widget.ViewPagerandroid:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="match_parent"/>
</LinearLayout>

2、MainActivity.java

package com.example.myapplication;import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
import android.os.Bundle;public class MainActivity extends AppCompatActivity {private ViewPager viewPager;private int[] images = {R.drawable.guide_1, R.drawable.guide_2, R.drawable.guide_3, R.drawable.guide_4};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);viewPager = findViewById(R.id.viewPager);ViewPagerAdapter adapter = new ViewPagerAdapter(this, images);viewPager.setAdapter(adapter);}
}

3、ViewPagerAdapter.java

package com.example.myapplication;import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;public class ViewPagerAdapter extends PagerAdapter {private Context mContext;private int[] mImages;public ViewPagerAdapter(Context context, int[] images) {mContext = context;mImages = images;}@NonNull@Overridepublic Object instantiateItem(@NonNull ViewGroup container, int position) {LayoutInflater inflater = LayoutInflater.from(mContext);View view = inflater.inflate(R.layout.item_guide, container, false);ImageView imageView = view.findViewById(R.id.imageView);imageView.setImageResource(mImages[position]);container.addView(view);return view;}@Overridepublic void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {container.removeView((View) object);}@Overridepublic int getCount() {return mImages.length;}@Overridepublic boolean isViewFromObject(@NonNull View view, @NonNull Object object) {return view == object;}
}

4、item_guide.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><ImageViewandroid:id="@+id/imageView"android:layout_width="match_parent"android:layout_height="match_parent"android:scaleType="centerCrop" /></RelativeLayout>