Android之View提升：三 使用 StackView 轮播切换多张图片
16lz
2022-07-22
Android之View提升：三 使用 StackView 轮播切换多张图片
1. 知识点
- BaseAdapter 的继承与使用 参考博客
adapter是view和数据的桥梁。在一个ListView或者GridView中，你不可能手动给每一个格子都新建一个view，所以这时候就需要Adapter的帮忙，它会帮你自动绘制view并且填充数据。 - 代码中使用，
ImageAdapter继承自BaseAdapter，并且实现它的4个基础方法。
package cn.study.project.stackview;import android.content.Context;import android.view.View;import android.view.ViewGroup;import android.widget.BaseAdapter;import android.widget.ImageView;import java.util.List;/** * @author zyy * @date 2021年05月17日 下午9:38 */public class ImageAdapter extends BaseAdapter { private List<Integer> mList; private Context mContext; public ImageAdapter(List<Integer> mList, Context mContext) { this.mList = mList; this.mContext = mContext; } @Override public int getCount() { return mList.size(); } @Override public Object getItem(int position) { return mList.get(position); } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { ImageView imageView=new ImageView(mContext); imageView.setScaleType(ImageView.ScaleType.CENTER_CROP); imageView.setImageResource(mList.get(position)); return imageView; }}- 扩充：用BaseAdapter显示一个自定义布局
首先新建一个layout，我命名为item，这个就是我们每个条目要展示的布局
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" app:srcCompat="@mipmap/ic_launcher" android:id="@+id/imageView" /> <Button android:text="Button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/button" /> <TextView android:text="TextView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/textView" />LinearLayout>接下来修改getView方法，让它显示我们这个item布局
public View getView(int position, View convertView, ViewGroup parent) { LayoutInflater inflater = LayoutInflater.from(mContext); View view = inflater.inflate(R.layout.item,null); final TextView textView = (TextView) view.findViewById(R.id.textView); Button button = (Button) view.findViewById(R.id.button); ImageView imageView = (ImageView) view.findViewById(R.id.imageView); imageView.setImageResource(R.mipmap.ic_launcher); button.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { textView.append("!"); } }); textView.setText(data[position]); return view;}LayoutInflater是用来加载布局的，用LayoutInflater的inflate方法就可以将你的item布局绘制出来。其中getView方法中的三个参数，position是指现在是第几个条目；convertView是旧视图，就是绘制好了的视图；parent是父级视图，也就是ListView之类的。
用inflate方法绘制好后的view最后return返回给getView方法就可以了。
- 进阶：每次返回的时候就没有使用convertView，重新创建了一个View，这样子浪费了系统资源。那要怎么利用convertView优化呢？见博客
2. 实现
效果：
实现代码：
1.界面布局：
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <Button android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/down" android:text="向下轮播"/> <Button android:layout_width="0dp" android:layout_height="wrap_content" android:layout_weight="1" android:id="@+id/up" android:text="向上轮播"/> LinearLayout> <StackView android:layout_width="match_parent" android:layout_height="wrap_content" android:loopViews="true" android:id="@+id/stackView"/>LinearLayout>- 使用：
package cn.study.project.stackview;import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.AdapterView;import android.widget.ImageView;import android.widget.StackView;import android.widget.Toast;import java.util.ArrayList;import java.util.List;import java.util.Timer;import java.util.TimerTask;public class MainActivity extends AppCompatActivity { private StackView mStackView; private int[] myIDs={ R.drawable.abc_0,R.drawable.abc_1,R.drawable.abc_2,R.drawable.abc_3}; private List<Integer> myImages=new ArrayList<>(); private Timer mTimerDown; private Timer mTimerUp; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mStackView=findViewById(R.id.stackView); for (int myID : myIDs) myImages.add(myID); ImageAdapter adapter=new ImageAdapter(myImages,this); mStackView.setAdapter(adapter); mStackView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { Toast.makeText(getApplicationContext(),"eg:"+position,Toast.LENGTH_LONG).show(); } }); findViewById(R.id.down).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if(mTimerDown!=null) mTimerDown.cancel(); if(mTimerUp!=null) mTimerUp.cancel(); mTimerDown=new Timer(); mTimerDown.schedule(new TimerTask() { @Override public void run() { runOnUiThread(new Runnable() { @Override public void run() { mStackView.showNext(); } }); } },0,1000); } }); findViewById(R.id.up).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { if(mTimerDown!=null) mTimerDown.cancel(); if(mTimerUp!=null) mTimerUp.cancel(); mTimerUp=new Timer(); mTimerUp.schedule(new TimerTask() { @Override public void run() { runOnUiThread(new Runnable() { @Override public void run() { mStackView.showPrevious(); } }); } },0,1000); } }); }}效果见上。
3. 扩展
可以使用StackView自定义Adapter轮播其他自定义控件。
更多相关文章
- 浅谈Java中Collections.sort对List排序的两种方法
- 箭头函数的基础使用
- NPM 和webpack 的基础使用
- Python list sort方法的具体使用
- 【阿里云镜像】使用阿里巴巴DNS镜像源——DNS配置教程
- python list.sort()根据多个关键字排序的方法实现
- android上一些方法的区别和用法的注意事项
- android 使用html5作布局文件: webview跟javascript交互
- android实现字体闪烁动画的方法