android viewpager引导页+圆点详解

最新推荐文章于 2023-12-15 21:46:52 发布

小梦工厂

最新推荐文章于 2023-12-15 21:46:52 发布

阅读量2.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： android java 文章标签： viewpager android 引导页 java

本文链接：https://blog.youkuaiyun.com/qq_29428121/article/details/52681602

android 同时被 2 个专栏收录

8 篇文章

订阅专栏

java

6 篇文章

订阅专栏

本文介绍如何使用ViewPager组件创建应用程序引导页。通过自定义ViewPagerAdapter，可以轻松地在不同页面间切换，并展示了如何设置指示器来指示当前页面位置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.viewpager就是可以使图片左右滑动。

2.效果图:

3.新建一个ViewPagerAdapter

ViewPagerAdapter.java

package com.example.administrator.viewpagerdemo.adapter;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;

import java.util.List;


/**
 * Created by Administrator on 2016-09-27.
 */

public class ViewPagerAdapter extends PagerAdapter{

    private Context context;
    private List<View> views;

    public ViewPagerAdapter(Context context,List<View> views){
        this.context=context;
        this.views=views;
    }

    @Override
    public int getCount() {
        return views.size();
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(views.get(position));
    }


    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        container.addView(views.get(position));
        return views.get(position);
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return (view==object);
    }
}

4.新建一个Guide

Guide.java

package com.example.administrator.viewpagerdemo;

import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;

import com.example.administrator.viewpagerdemo.adapter.ViewPagerAdapter;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by Administrator on 2016-09-27.
 */

public class Guide extends BaseActivity implements ViewPager.OnPageChangeListener{

    private ViewPager viewPager;
    private ViewPagerAdapter viewPagerAdapter;
    private List<View> views;
    private ImageView[] dots;
    private int[] ids={R.id.iv1,R.id.iv2,R.id.iv3};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.guide);

        initView();
        initDots();
    }

    private void initView() {

        LayoutInflater inflater=LayoutInflater.from(this);
        views=new ArrayList<View>();
        views.add(inflater.inflate(R.layout.guide_11,null));
        views.add(inflater.inflate(R.layout.guide_2,null));
        views.add(inflater.inflate(R.layout.guide_3,null));
        viewPager=(ViewPager) findViewById(R.id.viewpager);
        viewPagerAdapter=new ViewPagerAdapter(this,views);
        viewPager.setAdapter(viewPagerAdapter);
        viewPager.setOnPageChangeListener(this);

    }

    private  void initDots(){
        dots=new ImageView[views.size()];
        for (int i=0;i<views.size();i++){
            dots[i]=(ImageView) findViewById(ids[i]);
        }
    }

    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    @Override
    public void onPageSelected(int position) {
        for(int i=0;i<ids.length;i++){
            if(position==i){
                dots[i].setImageResource(R.drawable.select_point);
            }else {
                dots[i].setImageResource(R.drawable.unselect_point);
            }
        }
    }

    @Override
    public void onPageScrollStateChanged(int state) {

    }
}

5.新建引用的布局文件

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">


    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#00000000"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">


    </android.support.v4.view.ViewPager>
    <LinearLayout
        android:id="@+id/ll"
        android:layout_alignParentBottom="true"
        android:gravity="center_horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <ImageView
            android:layout_marginBottom="30dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/select_point"
            android:id="@+id/iv1"/>
        <ImageView
            android:layout_marginLeft="10dp"
            android:layout_marginBottom="30dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/unselect_point"
            android:id="@+id/iv2"/>
        <ImageView
            android:layout_marginLeft="10dp"
            android:layout_marginBottom="30dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/unselect_point"
            android:id="@+id/iv3"/>


    </LinearLayout>

</RelativeLayout>

Guide_11.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">

    <ImageView
        android:background="@drawable/guide_11"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageView"
        android:layout_weight="1" />
</LinearLayout>

Guide_2.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">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView2"
        android:layout_weight="1"
        android:background="@drawable/guide_2" />
</LinearLayout>

Guide_3.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">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView3"
        android:layout_weight="1"
        android:background="@drawable/guide_3" />
</LinearLayout>

6.select_point.xml以及unselect_point.xml请查看以下连接

http://blog.youkuaiyun.com/qq_29428121/article/details/52681217

7.源码下载