Android自定义view+程序启动引导页面

最近在学习别人的开发经验及代码，总觉得他人的开发方式好专业，而自己却那么业余。从事开发一段时间了，总没有一个好的学习方法来提高自己的开发技术，所以现在决定慢慢的积累一下自己的经验！

做一个简单的小demo——引导页：

思路：1)自定义一个View继承RelativeLayout;

    2)定义一个布局文件和定义一个来进行页面切换的ViewPager控件；

    3)定义一个指示器的布局，并向其添加子view，用于显示当前切换页提示

    4)定义了一个点击监听的接口，是实现类在其方法中做跳转作用。

代码：

package com.lx.guidepagerdemo.views;


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


import com.lx.guidepagerdemo.R;


import android.content.Context;
import android.os.Handler;
import android.os.Message;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;


/**
 * 自定义引导页面
 * 
 * @author lx
 * 
 */
public class GuideView extends RelativeLayout {


/* 页面切换控件ViewPager */
private ViewPager mViewPager;


/* 页面切换时的指示器 */
private LinearLayout guideLayout;


/* 页面数量的集合 */
private List<View> viewList = new ArrayList<View>();


private Handler refreshHandler;


/* 总页面的个数 */
private int totalPage;


/* 当前显示页面索引 */
private int indexPage;

/* 点击进入下一个界面按钮 */
private Button enter_next;

private OnEnterClickListener mClick;

public void setOnEnterClickListener(OnEnterClickListener mClick){
this.mClick=mClick;
}


public GuideView(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
this.init(context);
}


public GuideView(Context context) {
super(context);
// TODO Auto-generated constructor stub
this.init(context);
}


private void init(Context mContext) {
LayoutInflater.from(mContext).inflate(R.layout.guide_page_layout, this);
this.mViewPager = (ViewPager) findViewById(R.id.view_pager);
this.guideLayout = (LinearLayout) findViewById(R.id.guide_layout);
this.enter_next=(Button) findViewById(R.id.nowenter_btn);
this.refreshHandler = new ScrollIndicateHandler(this);
this.mViewPager.setOnPageChangeListener(new PageChangListener());
enter_next.setOnClickListener(new OnClickListener() {

@Override
public void onClick(View v) {
mClick.onEnterClick();
}
});
}

/**
* 提供一个点击监听的接口，在其实现类里面做界面跳转用
*/
public interface OnEnterClickListener{
void onEnterClick();
}


/**
* 获取viewpager实例
* 
* @return
*/
public ViewPager getViewPager() {
return this.mViewPager;
}


/**
* 获取当前位置
* 
* @return
*/
public int getCurrentIndex() {
return this.indexPage;
}


/**
* 获取总的页面个数
* 
* @return
*/
public int getTotalPager() {
return this.totalPage;
}


/**
* 添加单个view
* 
* @param view
*/
public void addViewItem(View view) {
this.viewList.add(view);
}


/**
* 设置显示当前页
* 
* @param index
*/
public void setCurrentItem(int index) {
this.indexPage = index;
}


/**
* 设置显示图片的数组
* 
* @param resArray
*/
public void setLayoutByDrawable(final Integer resArray[]) {
if (resArray == null)
throw new NullPointerException();
this.setupLayoutByDrawable(Arrays.asList(resArray));
}


/**
* 设置显示图片列表
* 
* @param resList
*/
public void setupLayoutByDrawable(final List<Integer> resList) {
if (resList == null)
throw new NullPointerException();


final int len = resList.size();
if (len > 0) {
for (int i = 0; i < len; i++) {
final View pageItem = new ImageView(getContext());
pageItem.setBackgroundResource(resList.get(i));
this.addViewItem(pageItem);
}
}
}


/**
* 导航显示
*/
public void showGuideView() {
this.totalPage = viewList.size();
for (int i = 0; i < this.totalPage; i++) {
View inicater = new ImageView(getContext());
this.guideLayout.addView(inicater);
}
this.refreshHandler.sendEmptyMessage(indexPage);
// 为ViewPager配置数据
this.mViewPager.setAdapter(new MyPagerAdapter(this.viewList));
this.mViewPager.setCurrentItem(indexPage, false);
}


/**
* 刷新提示器
*/
protected void refreshGuideView() {
for (int i = 0; i < totalPage; i++) {
ImageView img = (ImageView) this.guideLayout.getChildAt(i);
if (this.indexPage == i) {
img.setBackgroundResource(R.drawable.view_imageindicator_image_indicator_focus);
} else {
img.setBackgroundResource(R.drawable.view_imageindicator_image_indicator);
}
if(totalPage==indexPage+1){
enter_next.setVisibility(Button.VISIBLE);
}else{
enter_next.setVisibility(Button.GONE);
}
}
}


/**
* 页面变更监听
*/
private class PageChangListener implements OnPageChangeListener {


@Override
public void onPageScrollStateChanged(int arg0) {


}


@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {


}


@Override
public void onPageSelected(int arg0) {
indexPage = arg0;
refreshHandler.sendEmptyMessage(indexPage);
}
}


public class MyPagerAdapter extends PagerAdapter {
private List<View> pageViews = new ArrayList<View>();


public MyPagerAdapter(List<View> pageViews) {
this.pageViews = pageViews;
}


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


@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}


@Override
public int getItemPosition(Object object) {
return super.getItemPosition(object);
}


@Override
public void destroyItem(View arg0, int arg1, Object arg2) {
((ViewPager) arg0).removeView(pageViews.get(arg1));
}


@Override
public Object instantiateItem(View arg0, int arg1) {
((ViewPager) arg0).addView(pageViews.get(arg1));
return pageViews.get(arg1);
}


}


class ScrollIndicateHandler extends Handler {
private GuideView mGuidView;


public ScrollIndicateHandler(GuideView guidView) {
this.mGuidView = guidView;


}


@Override
public void handleMessage(Message msg) {
super.handleMessage(msg);
if (this.mGuidView != null) {
mGuidView.refreshGuideView();
}
}
}
}

布局文件——guide_page_layout代码：

<?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/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </android.support.v4.view.ViewPager>


    <LinearLayout
        android:id="@+id/guide_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="35dp"
        android:gravity="center"
        android:minHeight="10dp"
        android:minWidth="60dp"
        android:orientation="horizontal" >
    </LinearLayout>


    <Button
        android:id="@+id/nowenter_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/guide_layout"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="20dp"
        android:background="@drawable/jinru"
        android:visibility="gone" />


</RelativeLayout>

在测试Activity界面调用方法：

guide = (GuideView) findViewById(R.id.guide);
integer = new Integer[] { R.drawable.o1, R.drawable.o2, R.drawable.o3,
R.drawable.o4 };
guide.setLayoutByDrawable(integer);
guide.setOnEnterClickListener(this);
guide.showGuideView();

如果要实现跳转的话，记得实现一下OnEnterClickListener接口，重写其方法就OK了！

很简单是吧！