android 闪屏页—>ViewPager引导页—>主页面
效果图介绍：通过旋转、缩放、淡入淡出引入闪屏页后进入引导页，页面滑动时，底部的红点会随之移动（注意不是从一个灰点直接跳到另一个灰点），到达最后一个页面时才显示开始体验按钮，点击进入主页面；当再次登入时，直接由闪屏页进入到主页面（要想显示引导页，可以将app的缓存清除）；
1、自定义类BaseActivity继承自Activity：
public class BaseActivity extends Activity
{
@Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
//去掉标题栏；
requestWindowFeature(Window.FEATURE_NO_TITLE);
}
//重写startActivity方法；
public void startActivity(Context context1, Class context2)
{
startActivity(new Intent(context1, context2));
}
}
2、闪屏页的代码SplashActivity ：
public class SplashActivity extends BaseActivity {
RelativeLayout rlRoot;
@Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
rlRoot = (RelativeLayout)findViewById(R.id.rl_root);
startAnimation(); //设置动画；
}
private void startAnimation()
{
AnimationSet set = new AnimationSet(false); //设置动画集合；
//旋转动画,0到360度旋转，自身围绕中心点（0.5f）旋转；
RotateAnimation rotate = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
rotate.setDuration(1000); //旋转事件；
rotate.setFillAfter(true); //保持动画状态；
//缩放动画；
ScaleAnimation scale = new ScaleAnimation(0, 1, 0, 1, Animation.RELATIVE_TO_SELF, 0.5f);
scale.setDuration(1000);
scale.setFillAfter(true);
//淡入淡出动画；
AlphaAnimation alpha = new AlphaAnimation(0, 1);
alpha.setDuration(1000);
alpha.setFillAfter(true);
set.addAnimation(rotate);
set.addAnimation(scale);
set.addAnimation(alpha);
//设置动画监听；
set.setAnimationListener(new AnimationListener()
{
@Override
public void onAnimationStart(Animation animation)
{
}
@Override
public void onAnimationRepeat(Animation animation)
{
}
//动画执行结束；
@Override
public void onAnimationEnd(Animation animation)
{
nextPage();
}
});
rlRoot.startAnimation(set); //播放动画；
}
//不是第一次登陆就直接跳转页面；
private void nextPage()
{
boolean userGuide = PreUtils.getBoolean(this, "guide_showed", false);
if(!userGuide)
{
startActivity(SplashActivity.this, GuideActivity.class);
}
else
{
startActivity(SplashActivity.this, MainActivity.class);
}
finish();
}
}
3、闪屏页的布局文件activity_splash：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/rl_root"
android:background="@drawable/splash_bg_newyear">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/splash_horse_newyear"
/>
RelativeLayout>
4、记录是否第一次登陆的工具类PreUtils：
/*
* 当用户第一次登入时显示引导页，并通过SharePreferences记录状态，之后不再显示引导页（将缓存清除会再次显示）；
*/
public class PreUtils
{
public static final String PREF_NAME = "config"; //文件名；记录用户是否初次登入；
//根据键key获取value值（false/true）；
public static boolean getBoolean(Context context, String key, boolean value)
{
SharedPreferences sp = context.getSharedPreferences(PREF_NAME, Context.MODE_PRIVATE);
return sp.getBoolean(key, value);
}
//根据键key设置value值（false/true）并且提交；
public static void setBoolean(Context context, String key, boolean value)
{
SharedPreferences sp = context.getSharedPreferences(PREF_NAME, Context.MODE_PRIVATE);
sp.edit().putBoolean(key, value).commit();
}
}5、引导页GuideActivity ：
public class GuideActivity extends BaseActivity
{
private static final int[] mImgIds = new int[]
{R.drawable.guide_1, R.drawable.guide_2, R.drawable.guide_3};
private ArrayList mImgViewList; //引导页图片集合；
private ViewPager vpGuide;
private LinearLayout llPointGroup; //引导页圆点；
private int mPointWidth; //两点间的距离；
private View viewRedPoint; //底部跟随图片而动的红色point；
private Button btnStart; //开始体验按钮；
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_guide);
vpGuide = (ViewPager)findViewById(R.id.guide_vp);
llPointGroup = (LinearLayout)findViewById(R.id.guide_ll_point);
viewRedPoint = (View)findViewById(R.id.view_red_point);
btnStart = (Button)findViewById(R.id.guide_start_btn);
btnStart.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
PreUtils.setBoolean(GuideActivity.this, "guide_showed", true);//将值设置为true后不再显示引导页；
startActivity(GuideActivity.this, MainActivity.class);
finish();
}
});
initViews(); //初始化界面；
vpGuide.setAdapter(new GuideAdapter()); //设置适配器；
vpGuide.setOnPageChangeListener(new GuidePageListener()); //ViewPager的滑动监听；
}
//初始化界面；
private void initViews()
{
mImgViewList = new ArrayList();
for(int i=0; inew ImageView(this);
img.setBackgroundResource(mImgIds[i]); //设置引导页的背景；
mImgViewList.add(img); //将背景添加进集合中；
}
//初始化灰色小圆点；
for(int i=0; inew View(this);
point.setBackgroundResource(R.drawable.shape_point_grey);//设置引导页默认圆点；
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams
(DensityUtils.dp2px(this, 10), DensityUtils.dp2px(this, 10)); //设置圆点的大小1；
if(i>0)
{
params.leftMargin = DensityUtils.dp2px(this, 10); //设置圆点的间距；
}
point.setLayoutParams(params); //设置圆点的大小2；
llPointGroup.addView(point); //将圆点添加给线性布局；
}
//获取视图树； 当layout执行结束后回调此方法；
llPointGroup.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener()
{
@Override
public void onGlobalLayout()
{
llPointGroup.getViewTreeObserver().removeGlobalOnLayoutListener(this);
// 使用下行代码代替上行，但要改变版本号为14以上；
// llPointGroup.getViewTreeObserver().removeOnGlobalFocusChangeListener(this);
// 获取两个
mPointWidth = llPointGroup.getChildAt(1).getLeft() - llPointGroup.getChildAt(0).getLeft();
}
});
}
//自定义适配器；
class GuideAdapter extends PagerAdapter
{
//获取页卡数量；
@Override
public int getCount()
{
return mImgIds.length;
}
@Override
public boolean isViewFromObject(View arg0, Object arg1)
{
return arg0 == arg1;
}
//初始化界面；
@Override
public Object instantiateItem(View container, int position)
{
((ViewGroup) container).addView(mImgViewList.get(position));
return mImgViewList.get(position);
}
//移除页卡；
@Override
public void destroyItem(View container, int position, Object object)
{
((ViewPager) container).removeView((View)object);
}
}
//ViewPager的滑动监听；
class GuidePageListener implements OnPageChangeListener
{
//滑动状态变化；
@Override
public void onPageScrollStateChanged(int arg0)
{
}
//滑动事件；1、 当前位置（0,1,2）；2、偏移的百分比；3、偏移的距离；
@Override
public void onPageScrolled(int arg0, float arg1, int arg2)
{
int lenth = (int) (mPointWidth * arg1 + arg0 * mPointWidth);
//获取当前红点的布局参数，该view的父布局是relativelayout；
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) viewRedPoint.getLayoutParams();
params.leftMargin = lenth; //实时更新红点与第一个灰点的间距；
viewRedPoint.setLayoutParams(params);//重新给小红点设置布局参数，效果是可以看到红点在两个灰点之间移动；
}
//被选中页面，当滑动到最后一个页面时才显示“开始体验”按钮；
@Override
public void onPageSelected(int arg0)
{
if(arg0 == mImgIds.length - 1)
{
btnStart.setVisibility(View.VISIBLE);
}
else
{
btnStart.setVisibility(View.INVISIBLE);
}
}
}
} 6、引导页的布局文件activity_guide：
<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/guide_vp"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<Button
android:id="@+id/guide_start_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="60dp"
android:padding="5dp"
android:text="开始体验"
android:textColor="@drawable/btn_guide_text_selector"
android:background="@drawable/btn_guide_selector"
android:visibility="invisible"
/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
>
<LinearLayout
android:id="@+id/guide_ll_point"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>LinearLayout>
<View
android:id="@+id/view_red_point"
android:layout_width="10dp"
android:layout_height="10dp"
android:background="@drawable/shape_point_red"/>
RelativeLayout>
RelativeLayout>
7、尺寸适配工具类DensityUtils ：
/*
* 尺寸适配；dp = px / 设备密度；
*/
public class DensityUtils
{
public static int dp2px(Context ctx, float dp)
{
float density = ctx.getResources().getDisplayMetrics().density;
int px = (int) (dp * density + 0.5f);
// 2.8 + 0.5 = 3.3 ——> 3（2.8——3）; 2.2 + 0.5 = 2.7 ——>2（2.2——2）;
return px;
}
public static float px2dp(Context ctx, int px)
{
float density = ctx.getResources().getDisplayMetrics().density;
float dp = px / density;
return dp;
}
}8、底部灰色小点的xml文件shape_point_grey（将8、9、10、11的资源文件放在res/drawable文件夹中）：
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
>
<solid android:color="@android:color/darker_gray" />
shape>
9、跟随图片滑动的红色小点的xml文件shape_point_red：
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval"
>
<solid android:color="#f00" />
shape>
10、点击开始按钮背景颜色改变的资源文件btn_guide_selector：
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="@drawable/button_red_pressed" android:state_pressed="true"/>
<item android:drawable="@drawable/button_red_normal" android:state_pressed="false"/>
selector>
11、点击“开始体验”按钮文字颜色改变的资源文件btn_guide_text_selector：
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" android:color="#000" />
<item android:color="#fff" />
selector>
12、主界面MainActivity ：
public class MainActivity extends BaseActivity
{
@Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
这些内容是根据网上下载的视频进行整理的，还真是耗时不少，
资源代码链接：http://download.csdn.net/detail/baidu_32731497/9487810