码迷,mamicode.com
首页 > 移动开发 > 详细

android应用循环获取资源Id之引导页

时间:2015-03-02 13:16:31      阅读:162      评论:0      收藏:0      [点我收藏+]

标签:android应用   界面   引导页   

      目前市面上几乎所有的APP应用在第一次使用时都会有个引导页面,要么用引导用户操作,要么介绍产品优势,要么用来打广告等。引导页面一般是由3-6张图形界面组成,好的引导页面也不失为该app的亮丽风景!今天我也来说说引导页面的设计(当然有N种方法),我只是把我们项目中用到的方法代码贴出来,方便自己做个笔记。

    我们实现的原理很简单,就是用一个ViewPager全屏展示一些图片,主要代码如下:

主页面布局:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >


    <com.huika.pmall.views.MyViewPager
        android:id="@+id/whatsnew_viewpager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

<!--下面这个LinearLayout是装载图片指导步圆点的-->
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:layout_marginBottom="30dp"
        android:gravity="center_horizontal"
        android:orientation="horizontal"
        android:visibility="gone" >


        <ImageView
            android:id="@+id/page0"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="matrix"
            android:src="@drawable/page_now" />


        <ImageView
            android:id="@+id/page1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:scaleType="matrix"
            android:src="@drawable/page" />


        <ImageView
            android:id="@+id/page2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:scaleType="matrix"
            android:src="@drawable/page" />
    </LinearLayout>
</FrameLayout>

主页面代码:

public class GuideViewAct extends Activity implements OnRightEndScrollListener {
private MyViewPager mViewPager;
private ImageView mPage0;
private ImageView mPage1;
private ImageView mPage2;
@SuppressWarnings("unused")
private int currIndex = 0;


@Override
public void onCreate() {

     requestWindowFeature(Window.FEATURE_NO_TITLE);

      getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);

    setContentView(R.layout.layout_guide_view);

              initViews() ;
}


private void initViews() {
mViewPager = (MyViewPager) findViewById(R.id.whatsnew_viewpager);
mViewPager.setRightEndScrollListener(this);
mViewPager.setOnPageChangeListener(new MyOnPageChangeListener());

mPage0 = (ImageView) findViewById(R.id.page0);
mPage1 = (ImageView) findViewById(R.id.page1);
mPage2 = (ImageView) findViewById(R.id.page2);
PagerAdapter mPagerAdapter = new PagerAdapter() {


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


@Override
public int getCount() {
return 3;//我们引导页面只有3个
}


@Override
public void destroyItem(View container, int position, Object object) {
((ViewPager) container).removeView((View) object);
}


@Override
public View instantiateItem(View container, int position) {
LayoutInflater inflater = LayoutInflater.from(container.getContext());

                                //用getIdentifier()循环获取资源Id
int layoutId = getResources().getIdentifier("view_guide_" + (position + 1), "layout", getPackageName());
View pView = inflater.inflate(layoutId, (ViewPager) container, false);
((ViewPager) container).addView(pView);
return pView;
}
};


mViewPager.setAdapter(mPagerAdapter);
}


@Override
public void widgetClick(View v) {
super.widgetClick(v);
}


/**
* 最后一张图片Viewpager上面的开始按钮

* @param v
*/
public void startbutton(View v) {
System.gc();
Intent intent = new Intent();
intent.setClass(GuideViewAct.this, MainAct.class);
startActivity(intent);
this.finish();
}


@Override
public void onRightEndScrollListener() {
startbutton(null);
}


public class MyOnPageChangeListener implements OnPageChangeListener {
public void onPageSelected(int arg0) {
switch (arg0) {
case 0:
mPage0.setImageResource(R.drawable.page_now);
mPage1.setImageResource(R.drawable.page);
mPage2.setImageResource(R.drawable.page);
break;
case 1:
mPage1.setImageResource(R.drawable.page_now);
mPage0.setImageResource(R.drawable.page);
mPage2.setImageResource(R.drawable.page);
break;
case 2:
mPage2.setImageResource(R.drawable.page_now);
mPage0.setImageResource(R.drawable.page);
mPage1.setImageResource(R.drawable.page);
break;
// case 4:
// mPage4.setImageResource(R.drawable.page_now);
// mPage3.setImageResource(R.drawable.page);
// break;
}
currIndex = arg0;
}


@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub


}


@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub


}
}
}

发现上面int layoutId = getResources().getIdentifier("view_guide_" + (position + 1), "layout", getPackageName());这句没有,我们的view_guide_是从哪来的呢?我们在要res/layout下面新建对应的布局,比如有三张引导页面,我们就要三个布局,分别命名为:view_guide_1.xml,view_guide_2.xml,view_guide_3.xml,在三个页面中分别放上你应用要展示的图片或信息就可以了。

最后贴上自定义的ViewPager:

public class MyViewPager extends ViewPager {
private OnRightEndScrollListener rightEndScrollListener;
private float pStart;
private VelocityTracker mVelocityTracker;
private int touchSlop;
private float scrollFriction;
private boolean mCanDrag = true;


public interface OnRightEndScrollListener {
void onRightEndScrollListener();
}


public MyViewPager(Context context) {
super(context);
init();
}


public MyViewPager(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}


private void init() {
touchSlop = 200;
scrollFriction = 2000;
}


@Override
public boolean onInterceptTouchEvent(MotionEvent arg0) {
if (!mCanDrag)
return false;


boolean flag = false;
try {
flag = super.onInterceptTouchEvent(arg0);
}
catch (Exception e) {


}
return flag;
}


@Override
public boolean onTouchEvent(MotionEvent event) {
try {
if (getAdapter() != null && (getCurrentItem() + 1) == getAdapter().getCount())// 最后一项
{
if (mVelocityTracker == null) {
mVelocityTracker = VelocityTracker.obtain();
}
mVelocityTracker.addMovement(event);


int action = event.getAction() & MotionEvent.ACTION_MASK;
switch (action) {
case MotionEvent.ACTION_DOWN:
pStart = event.getX();
break;
case MotionEvent.ACTION_MOVE:
break;
case MotionEvent.ACTION_CANCEL:
case MotionEvent.ACTION_UP:
float pEnd = event.getX();
mVelocityTracker.computeCurrentVelocity(1000);
float velocityX = mVelocityTracker.getXVelocity();


if ((pStart > pEnd && (pStart - pEnd) > touchSlop) || (velocityX < -scrollFriction)) {// 触发左滑事件
if (rightEndScrollListener != null) {
rightEndScrollListener.onRightEndScrollListener();
}
}


Log.v("fan", touchSlop + "velocityX=" + velocityX);
Log.v("fan", scrollFriction + "(x1-x2)=" + (pStart - pEnd) + "," + pStart + "=" + "x2=" + pEnd);


mVelocityTracker.clear();
break;
default:
break;
}
}
}
catch (Exception e) {


}
return super.onTouchEvent(event);
}


public void setRightEndScrollListener(OnRightEndScrollListener rightEndScrollListener) {
this.rightEndScrollListener = rightEndScrollListener;
}


/**
* 是否可以滑动

* @param canDrag
*/
public void setCanDragState(boolean canDrag) {
mCanDrag = canDrag;
}
}

android应用循环获取资源Id之引导页

标签:android应用   界面   引导页   

原文地址:http://blog.csdn.net/true100/article/details/44016341

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!