Android Studio 图片轮播——导航页面(Viewpager)

图片轮播——导航页面(Viewpager)

功能展示:

可点击查看轮播视频

首先需要一个主页面,包含着控件,N个需要展示的页面,主页面的java,以及ViewPager的适配器;

展示的页面:可以用ImageView和TextView配合

主页面:


<RelativeLayout 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=".Navigation_page">
    <androidx.viewpager.widget.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/pager"
        >
    androidx.viewpager.widget.ViewPager>
RelativeLayout>

其他的页面可以自行设置,这里用图片代替


<RelativeLayout 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=".Navigation_page">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/a2"
        android:id="@+id/view2"
        android:scaleType="centerCrop"
        >ImageView>

RelativeLayout>

可以设置多个页面,和上面布局均类似;

这里需要一个适配器(PagerAdapter)

public class Navigation_page_Adapter extends PagerAdapter {
    private ArrayList<View> viewArrayList;
    public Navigation_page_Adapter(ArrayList<View> viewArrayList)
    {
        this.viewArrayList = viewArrayList;
    }

//获取ViewPager中View的个数
    @Override
    public int getCount() {
        return viewArrayList.size();
    }


//通过instantiateItem的方法,判断instantiateItem方法返回的View是否为同一个。一般固定写 return view == object;
    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view == object;
    }


//主要的:获取View集合中处于position位置的View,将View添加到ViewGroup 容器中并返回集合中的当前View
    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        container.addView(viewArrayList.get(position));
        return viewArrayList.get(position);
    }

//移除前一个界面
    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView(viewArrayList.get(position));
    }
}

接下来是主页面java:

public class Navigation_page extends AppCompatActivity {
			//声明所需要的控件,以及适配器
private ViewPager viewPager;
private ArrayList<View>  arrayList = new ArrayList<View>();
private Navigation_page_Adapter navigation_page_adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
			//绑定控件
        setContentView(R.layout.activity_navigation_page);
        viewPager = (ViewPager)findViewById(R.id.pager);
			//将每一个子页面添加到ArrayList集合中
        arrayList.add(getLayoutInflater().inflate(R.layout.a,null));
        arrayList.add(getLayoutInflater().inflate(R.layout.a1,null));
        arrayList.add(getLayoutInflater().inflate(R.layout.a2,null));
        arrayList.add(getLayoutInflater().inflate(R.layout.a3,null));
			//给定适配器值
        navigation_page_adapter = new Navigation_page_Adapter(arrayList);
			//给ViewPager设置适配对象        
viewPager.setAdapter(navigation_page_adapter);
    }
}

你可能感兴趣的:(android,移动开发,app,viewpager)