1. ViewPager
ViewPager常见于APP的引导页或者产品介绍,左右滑动展示不同页面。
ViewPager用PagerAdapter来绑定数据。PagerAdapter是个抽象类,所以需要写一个子类来实现它。
xml:
<?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"
tools:context=".ViewPagerActivity"
android:orientation="vertical"
>
<androidx.viewpager.widget.ViewPager
android:id="@+id/vp"
android:layout_width="match_parent"
android:layout_height="400dp"
></androidx.viewpager.widget.ViewPager>
</LinearLayout>
java:
实现PagerAdapter的子类
package com.example.chapter08;
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
import com.example.chapter08.entity.Book;
import java.util.ArrayList;
import java.util.List;
public class BookPagerAdapter extends PagerAdapter {
private Context myContext;
private List<Book> books;
private List<ImageView> images;
public BookPagerAdapter(Context myContext, List<Book> books) {
this.myContext = myContext;
this.books = books;
images = new ArrayList<>();
for(Book b : books){
ImageView iv = new ImageView(myContext);
iv.setLayoutParams(new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
));
iv.setImageResource(b.image);
images.add(iv);
}
}
@Override
public int getCount() {
return images.size();
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == object;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
ImageView iv = images.get(position);
container.addView(iv);
return iv;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView(images.get(position));
}
}
instantiateItem表示当前容器要展示第几个View,执行一个放入新View的操作。
destroyItem则是移除之前的View。
这两个函数设置好了,也就是绑定数据到了ViewPager
使用PagerAdapter的子类:
package com.example.chapter08;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
import android.os.Bundle;
import android.widget.Toast;
import com.example.chapter08.entity.Book;
import java.util.List;
public class ViewPagerActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
private List<Book> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_view_pager);
ViewPager vp = findViewById(R.id.vp);
list = Book.getDefaultList();
BookPagerAdapter adapter = new BookPagerAdapter(this, list);
vp.setAdapter(adapter);
vp.addOnPageChangeListener(this);
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
Toast.makeText(this, list.get(position).name, Toast.LENGTH_SHORT).show();
}
@Override
public void onPageScrollStateChanged(int state) {
}
}
效果图:左右滑动,可以切换不同书籍封面
2.PageTabStrip
这个是放在ViewPager里的一个组件,在View上方显示一个标题栏,可以随着View的滑动而滑动。
效果可以直接看下图
比起只显示图片,需要在xml里增加一个PageTabStrip,然后在适配器的class中实现getPageTitle方法,返回值就是title内容
代码如下:
xml
<?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"
tools:context=".PagerTabActivity"
android:orientation="vertical"
>
<androidx.viewpager.widget.ViewPager
android:layout_width="match_parent"
android:layout_height="400dp"
android:id="@+id/vp">
<androidx.viewpager.widget.PagerTabStrip
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/pt"></androidx.viewpager.widget.PagerTabStrip>
</androidx.viewpager.widget.ViewPager>
</LinearLayout>
Adapter子类
package com.example.chapter08;
import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.viewpager.widget.PagerAdapter;
import com.example.chapter08.entity.Book;
import java.util.ArrayList;
import java.util.List;
public class BookPagerAdapter extends PagerAdapter {
private Context myContext;
private List<Book> books;
private List<ImageView> images;
public BookPagerAdapter(Context myContext, List<Book> books) {
this.myContext = myContext;
this.books = books;
images = new ArrayList<>();
for(Book b : books){
ImageView iv = new ImageView(myContext);
iv.setLayoutParams(new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.WRAP_CONTENT
));
iv.setImageResource(b.image);
images.add(iv);
}
}
@Override
public int getCount() {
return images.size();
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == object;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
ImageView iv = images.get(position);
container.addView(iv);
return iv;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView(images.get(position));
}
@Nullable
@Override
public CharSequence getPageTitle(int position) {
return books.get(position).name;
}
}
绑定View和Adapter
package com.example.chapter08;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerTabStrip;
import androidx.viewpager.widget.ViewPager;
import android.graphics.Color;
import android.os.Bundle;
import android.util.TypedValue;
import android.widget.Toast;
import com.example.chapter08.entity.Book;
import java.util.List;
public class PagerTabActivity extends AppCompatActivity implements ViewPager.OnPageChangeListener {
private List<Book> list;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_pager_tab);
//init pager tab
PagerTabStrip pt = findViewById(R.id.pt);
pt.setTextSize(TypedValue.COMPLEX_UNIT_SP,20);
pt.setTextColor(Color.GRAY);
//init view page
ViewPager vp = findViewById(R.id.vp);
list = Book.getDefaultList();
BookPagerAdapter adapter = new BookPagerAdapter(this, list);
vp.setAdapter(adapter);
vp.setCurrentItem(2);
vp.addOnPageChangeListener(this);
}
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
Toast.makeText(this, list.get(position).name, Toast.LENGTH_SHORT).show();
}
@Override
public void onPageScrollStateChanged(int state) {
}
}