Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> android應用循環獲取資源Id之引導頁

android應用循環獲取資源Id之引導頁

編輯:關於Android編程

目前市面上幾乎所有的APP應用在第一次使用時都會有個引導頁面,要麼用引導用戶操作,要麼介紹產品優勢,要麼用來打廣告等。引導頁面一般是由3-6張圖形界面組成,好的引導頁面也不失為該app的亮麗風景!今天我也來說說引導頁面的設計(當然有N種方法),我只是把我們項目中用到的方法代碼貼出來,方便自己做個筆記。

我們實現的原理很簡單,就是用一個ViewPager全屏展示一些圖片,主要代碼如下:

主頁面布局:


<frameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_height="fill_parent"
android:orientation="vertical" >


android:id="@+id/whatsnew_viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />


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


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


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


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

</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;
}
}

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved