Android应用程序引导页

一般的Android程序首次进入时都会有一个引导页面,本文简单的实现了一下这个功能。主要是用ViewPager配合GridView实现。ViewPager用来装载引导图片,GridView用来显示底部的指示图标。附件里是一些资源图片。
先看一下效果图:
[img]http://do.jhost.cn/huguojun/iteye/g_example01.png[/img] [img]http://do.jhost.cn/huguojun/iteye/g_example02.png[/img] [img]http://do.jhost.cn/huguojun/iteye/g_example03.png[/img]
具体代码如下,包括一个主Activity和两个适配器:

主Activity

public class GuideActivityActivity extends Activity implements OnPageChangeListener {

private List<View> views;
private ViewPager viewPager;
private GridView gridView;
private GuidePagerAdapter pagerAdapter;
private GuideGridAdapter gridAdapter;

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.guide);
initData();
initView();
}

private void initData() {
int images[] = {R.drawable.guide_first, R.drawable.guide_second, R.drawable.guide_third};
views = new ArrayList<View>();
for (int i = 0; i < images.length; i++) {
ImageView imageView = new ImageView(this);
imageView.setImageResource(images[i]);
imageView.setScaleType(ScaleType.FIT_XY);
views.add(imageView);
}
}

private void initView() {
viewPager = (ViewPager) findViewById(R.id.guide_viewpager);
gridView = (GridView) findViewById(R.id.guide_gridview);

pagerAdapter = new GuidePagerAdapter();
pagerAdapter.setViews(views);
viewPager.setAdapter(pagerAdapter);
viewPager.setCurrentItem(0);
viewPager.setOnPageChangeListener(this);

gridAdapter = new GuideGridAdapter(this);
gridAdapter.setCountSize(views.size());
gridView.setColumnWidth(12);
gridView.setNumColumns(views.size());
gridView.setAdapter(gridAdapter);
gridAdapter.setSelectPoint(0);
gridAdapter.notifyDataSetChanged();
}

@Override
public void onPageScrollStateChanged(int arg0) {}

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

@Override
public void onPageSelected(int position) {
gridAdapter.setSelectPoint(position);
gridAdapter.notifyDataSetChanged();
}

@Override
protected void onPause() {
super.onPause();
if (null != views) {
views.clear();
}
}

@Override
protected void onDestroy() {
super.onDestroy();
if(null != viewPager){
viewPager.removeAllViews();
viewPager.destroyDrawingCache();
}
}
}

GridView和ViewPager的适配器

public class GuideGridAdapter extends BaseAdapter {

private int size;
private int index = 0;
private Context context;

public GuideGridAdapter(Context context) {
this.context = context;
}

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

@Override
public Object getItem(int position) {
return null;
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(final int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = null;
if (convertView == null) {
ImageView imageView = new ImageView(context);
convertView = imageView;
viewHolder = new ViewHolder();
viewHolder.dotView = imageView;
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}

if (index == position) {
viewHolder.dotView.setImageResource(R.drawable.point_select);
} else {
viewHolder.dotView.setImageResource(R.drawable.point_noselect);
}

return convertView;
}

static class ViewHolder {
ImageView dotView = null;
}

/**
* 设置选中页 高亮显示
* @param indexPoint 当前选中页索引
*/
public void setSelectPoint(int indexPoint) {
this.index = indexPoint;
}

/**
* 设置页码总数
* @param countSize 页码总数
*/
public void setCountSize(int countSize) {
this.size = countSize;
}
}


public class GuidePagerAdapter extends PagerAdapter {

private List<View> views;

public void setViews(List<View> views) {
this.views = views;
}

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

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

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

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

}

布局文件guide.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<GridView
android:id="@+id/guide_gridview"
android:layout_width="70.0dip"
android:layout_height="25dip"
android:focusable="false"
android:focusableInTouchMode="false"
android:background="#00000000"
android:cacheColorHint="#00000000"
android:layout_alignParentBottom="true"
android:layout_marginBottom="10.0dip"
android:layout_marginTop="10.0dip"
android:layout_centerHorizontal="true">
</GridView>
<android.support.v4.view.ViewPager
android:id="@+id/guide_viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="@id/guide_gridview"/>
</RelativeLayout>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值