摘要：项目需要添加多张引导页，所以在网上搜集了一些资料并整理好。
Step1
添加一个GuideActivity.
其实这个引导页无非就是一个Activity,里面有一个ViewPager而已。多张图片放进去，装进ViewPager里面。
注意：这里Activity中千万不要设置图片资源，不然会报OOM异常。多张图片会导致内存溢出。
==>源码如下：
①GuideActivity的Kotlin源码
class GuideActivity : AppCompatActivity(), ViewPager.OnPageChangeListener {
private var vp: ViewPager? = null
private var imageIdArray: IntArray? = null//图片资源的数组
private var viewList: MutableList<View>? = null//图片资源的集合
private var vg: ViewGroup? = null//放置圆点
//实例化原点View
private var iv_point: ImageView? = null
private var ivPointArray: Array<ImageView?>? = null
//最后一页的按钮
private var ib_start: Button? = null
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
supportRequestWindowFeature(Window.FEATURE_NO_TITLE)
setContentView(R.layout.activity_guide)
MainApplication.getInstance().addActivity(this)
StatusBarUtils.setWindowStatusBarColor(this, R.color.headline)
ib_start = findViewById(R.id.guide_ib_start) as Button
ib_start!!.setOnClickListener {
val intent:Intent=Intent(this@GuideActivity,NavigationMainActivity::class.java)
intent.putExtra("openAPP",true)
overridePendingTransition(R.anim.slide_right_in,R.anim.slide_left_out)
startActivity(intent)
finish()
}
//加载ViewPager
initViewPager()
//加载底部圆点
initPoint()
}
/**
* 加载底部圆点
*/
private fun initPoint() {
//这里实例化LinearLayout
vg = findViewById(R.id.guide_ll_point) as ViewGroup
//根据ViewPager的item数量实例化数组
ivPointArray = arrayOfNulls(viewList!!.size)
//循环新建底部圆点ImageView，将生成的ImageView保存到数组中
val size = viewList!!.size
for (i in 0..size - 1) {
iv_point = ImageView(this)
iv_point!!.layoutParams = ViewGroup.LayoutParams(50, 50)
iv_point!!.setPadding(20, 0, 20, 150)//left,top,right,bottom
ivPointArray!![i] = iv_point!!
//第一个页面需要设置为选中状态，这里采用两张不同的图片
if (i == 0) {
iv_point!!.setBackgroundResource(R.mipmap.icon_point_pre)
} else {
iv_point!!.setBackgroundResource(R.mipmap.icon_point)
}
//将数组中的ImageView加入到ViewGroup
vg!!.addView(ivPointArray!![i])
}
}
/**
* 加载图片ViewPager
*/
private fun initViewPager() {
vp = findViewById(R.id.guide_vp) as ViewPager
//实例化图片资源
imageIdArray = intArrayOf(R.mipmap.intro_school, R.mipmap.intro_discovery_1, R.mipmap.intro_discovery_2
,R.mipmap.intro_discovery_3,R.mipmap.intro_ask_1,R.mipmap.intro_ask_2,R.mipmap.intro_ask_3,R.mipmap.intro_mew_coin)
viewList = ArrayList()
//循环创建View并加入到集合中
val len = imageIdArray!!.size
for (i in 0..len - 1) {
//new ImageView并设置全屏和图片资源
val imageView = ImageView(this)
viewList!!.add(imageView)
}
//View集合初始化好后，设置Adapter
vp!!.adapter = GuidePageAdapter(viewList)
vp!!.offscreenPageLimit=9
//设置滑动监听
vp!!.setOnPageChangeListener(this)
}
override fun onPageScrolled(position: Int, positionOffset: Float, positionOffsetPixels: Int) {
}
/**
* 滑动后的监听
* @param position
*/
override fun onPageSelected(position: Int) {
//循环设置当前页的标记图
val length = imageIdArray!!.size
for (i in 0..length - 1) {
ivPointArray!![position]!!.setBackgroundResource(R.mipmap.icon_point_pre)
if (position != i) {
ivPointArray!![i]!!.setBackgroundResource(R.mipmap.icon_point)
}
}
//判断是否是最后一页，若是则显示按钮
if (position == imageIdArray!!.size - 1) {
ib_start!!.visibility = View.VISIBLE
} else {
ib_start!!.visibility = View.GONE
}
}
override fun onPageScrollStateChanged(state: Int) {
}
}
②activity_guide布局代码：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.guangdamiao.www.mew_android_debug.navigation.GuideActivity">
<android.support.v4.view.ViewPager
android:id="@+id/guide_vp"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<LinearLayout
android:id="@+id/guide_ll_point"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_marginBottom="150pt"
android:gravity="center_horizontal">
</LinearLayout>
<Button
android:layout_width="500pt"
android:layout_height="55pt"
android:id="@+id/guide_ib_start"
android:text="进入大学喵"
android:textSize="30pt"
android:layout_centerHorizontal="true"
android:layout_above="@+id/guide_ll_point"
android:background="@drawable/button_shape_apply"
android:visibility="gone"/>
</RelativeLayout>
Step2
第二步就是写这个GuidePageAdapter了。
注意在instanticateItem(ViewGroup container,int position)中设置背景图片，提高加载速度，解决OOM问题。
源码如下：
public class GuidePageAdapter extends PagerAdapter {
private List<View> viewList;
private int[] mResIds=new int[]{
R.mipmap.intro_school,
R.mipmap.intro_discovery_1,
R.mipmap.intro_discovery_2,
R.mipmap.intro_discovery_3,
R.mipmap.intro_ask_1,
R.mipmap.intro_ask_2,
R.mipmap.intro_ask_3,
R.mipmap.intro_mew_coin,
};
public GuidePageAdapter(List<View> viewList) {
this.viewList = viewList;
}
/**
* @return 返回页面的个数
*/
@Override
public int getCount() {
if (viewList != null){
return viewList.size();
}
return 0;
}
/**
* 判断对象是否生成界面
* @param view
* @param object
* @return
*/
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
/**
* 初始化position位置的界面
* @param container
* @param position
* @return
*/
@Override
public Object instantiateItem(ViewGroup container, int position) {
//在此设置背景图片，提高加载速度，解决OOM问题
View view=viewList.get(position);
int count=getCount();
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(
ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT);
view.setBackgroundResource(mResIds[position%count]);
view.setLayoutParams(params);
container.addView(viewList.get(position));
return viewList.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(viewList.get(position));
}
}
Step3
第三步就是在启动页中设置跳转引导页了。
引导页一般是第一次安装APP后才会出现，这里可以写一个sharePreferences文件记录是不是第一次安装。
最后利用intent跳转到引导页就可以了。