android 安装后首次启动的欢迎页面的总结和demo
本例子一种介绍了四种启动方式来
1老赶集网的启动，
效果图 ：
实现原理 ：通过handler延时一段时间 向主线程发送一条跳转界面的消息（这也是大部分启动页所用到的）
代码示例：
public class SplashActivity extends Activity {
private static final long DELAY_TIME = 2000L;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_splash);
redirectByTime();
}
private void redirectByTime() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
startActivity(new Intent(SplashActivity.this,SuccessLaunchActivity.class));
AnimationUtil.finishActivityAnimation(SplashActivity.this);
}
}, DELAY_TIME);
}
}
2使用ViewPage
效果图： 
实现原理 ：（1）ViewPager 添加4个Fragment ，滑动的圆点是图片上自带的
（2）Viewpager 动态添加小圆点，图片
代码示例：
（1）
public class ViewPagerActivity extends FragmentActivity {
private ViewPager mVPActivity;
private Fragment1 mFragment1;
private Fragment2 mFragment2;
private Fragment3 mFragment3;
private Fragment4 mFragment4;
private List<Fragment> mListFragment = new ArrayList<Fragment>();
private PagerAdapter mPgAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_viewpager);
initView();
}
private void initView() {
mVPActivity = (ViewPager) findViewById(R.id.vp_activity);
mFragment1 = new Fragment1();
mFragment2 = new Fragment2();
mFragment3 = new Fragment3();
mFragment4 = new Fragment4();
mListFragment.add(mFragment1);
mListFragment.add(mFragment2);
mListFragment.add(mFragment3);
mListFragment.add(mFragment4);
mPgAdapter = new ViewPagerAdapter(getSupportFragmentManager(),
mListFragment);
mVPActivity.setAdapter(mPgAdapter);
}
}（2）
public class ViewPageTwoActivity extends Activity {
private Button jinru_youzhen;// 进入启动页
private ViewPager welcome_viewPager;
private LinearLayout llayout_dots;// 小圆点的布局
// 定义数据源
private List<View> listViews;
// 自定义适配器
private MyAdapter adapter;
int[] imgsIcon;
boolean misScrolled = false;
@SuppressWarnings("deprecation")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_viewpagetwo);
welcome_viewPager = (ViewPager) this
.findViewById(R.id.welcome_viewPager);
llayout_dots = (LinearLayout) this.findViewById(R.id.llayout_dots);
jinru_youzhen = (Button) this.findViewById(R.id.jinru_youzhen);
jinru_youzhen.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new Intent(ViewPageTwoActivity.this,
SuccessLaunchActivity.class));
ViewPageTwoActivity.this.finish();
}
});
initData();
adapter = new MyAdapter();
welcome_viewPager.setAdapter(adapter);
// viewPager监听
welcome_viewPager.setOnPageChangeListener(new OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
// 动态更改选中的小圆点
// 还原所有默认的小圆点，选中的position小圆点更换图片就可以了
for (int i = 0; i < llayout_dots.getChildCount(); i++) {
ImageView iv = (ImageView) llayout_dots.getChildAt(i);
if (i == position) {// 选中状态
iv.setImageResource(R.drawable.dark_dot);
} else {
iv.setImageResource(R.drawable.white_dot);
}
}
if (position == listViews.size() - 1) {
jinru_youzhen.setVisibility(View.VISIBLE);
} else {
jinru_youzhen.setVisibility(View.GONE);
}
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
switch (arg0) {
case ViewPager.SCROLL_STATE_DRAGGING:
misScrolled = false;
break;
case ViewPager.SCROLL_STATE_SETTLING:
misScrolled = true;
break;
case ViewPager.SCROLL_STATE_IDLE:
if (welcome_viewPager.getCurrentItem() == welcome_viewPager
.getAdapter().getCount() - 1 && !misScrolled) {
startActivity(new Intent(ViewPageTwoActivity.this,
SuccessLaunchActivity.class));
ViewPageTwoActivity.this.finish();
}
misScrolled = true;
break;
default:
break;
}
}
});
}
/**
* 初始化数据源
*
*/
private void initData() {
listViews = new ArrayList<View>();
// 实际显示图片的数据源(记录了所有图片的资源id，图片最好都放在xxhdpi下面)
imgsIcon = new int[] { R.drawable.guide_1, R.drawable.guide_2,
R.drawable.guide_3, R.drawable.guide_4 };
// 动态加载视图
for (int i = 0; i < imgsIcon.length; i++) {
// 将实际的图片动态添加到ImageView控件中
ImageView imageView = new ImageView(this);
// 设置属性
imageView.setLayoutParams(new LayoutParams(
LayoutParams.MATCH_PARENT, // 宽度
LayoutParams.MATCH_PARENT) // 高度
);
imageView.setImageResource(imgsIcon[i]);
// 保持不形变的情况等比例拉伸图片，结果放在容器中间FIT_CENTER
// 图片全部拉伸并且充满容器，但是可能会发生图片形变失真,FIT_XY
imageView.setScaleType(ScaleType.FIT_XY);
// 放入到容器当中
listViews.add(imageView);
}
// 初始化底部的小圆点(实际的数量和图片的数量一样)
for (int i = 0; i < imgsIcon.length; i++) {
// 构建ImageView,放dot的图片
ImageView ivDot = new ImageView(this);
// 设置属性
ivDot.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, // 宽度
LayoutParams.WRAP_CONTENT) // 高度
);
if (i == 0) {// 默认初始化的时候，第一个小圆点是不一样的图片
ivDot.setImageResource(R.drawable.dark_dot);
} else {
ivDot.setImageResource(R.drawable.white_dot);
}
// 保持不形变的情况等比例拉伸图片，结果放在容器中间FIT_CENTER
// 图片全部拉伸并且充满容器，但是可能会发生图片形变失真,FIT_XY
ivDot.setScaleType(ScaleType.FIT_CENTER);
// 设置ivDot的paddingLeft,使每个圆点的间距隔开
// 四个参数:left,top,right,bottom,不用的写0就可以了
ivDot.setPadding(36, 0, 0, 0);
// 添加到容器中
llayout_dots.addView(ivDot);
}
}
public class MyAdapter extends PagerAdapter {
@Override
public int getCount() {
return listViews.size();
}
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
return arg0 == arg1;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(listViews.get(position));
return listViews.get(position);
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// super.destroyItem(container, position, object);
container.removeView(listViews.get(position));
}
}
}
3使用ViewFlipper
效果图：
和2有点类似 ，他可以实现循环的滚动，效果图中就没有展示了，这里大家应该能够联想到banner的轮播图了
实现原理：通过ViewFlipper控件显示所有的图片，然后通过GestureDetector设置滚动的监听
代码示例：
（1）布局
<?xml version="1.0" encoding="utf-8"?>
<ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/vf_activity"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/guide_1" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/guide_2" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/guide_3" />
<!-- 最后一个布局有按钮所以这么写了 -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/guide_4" >
<TextView
android:id="@+id/tvInNew"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="40dp"
android:gravity="center"
android:text="立即体验"
android:background="@drawable/btn_innew"
android:textColor="@android:color/white"
android:textSize="22sp" />
</RelativeLayout>
</ViewFlipper>
public class ViewFlipperActivity extends Activity implements OnGestureListener {
@ViewInject(R.id.vf_activity)
private ViewFlipper mVFActivity;
private GestureDetector mGestureDetector;
@ViewInject(R.id.tvInNew)
private TextView tvInNew;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_viewflipper);
ViewUtils.inject(this);
initView();
}
@SuppressWarnings("deprecation")
private void initView() {
mGestureDetector = new GestureDetector(this);
//界面跳转
tvInNew.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new Intent(ViewFlipperActivity.this,SuccessLaunchActivity.class));
AnimationUtil.finishActivityAnimation(ViewFlipperActivity.this);
}
});
}
@Override
public boolean onDown(MotionEvent e) {
return false;
}
@Override
public void onShowPress(MotionEvent e) {
}
@Override
public boolean onSingleTapUp(MotionEvent e) {
return false;
}
@Override
public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
float distanceY) {
return false;
}
@Override
public void onLongPress(MotionEvent e) {
}
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
if (e1.getX() > e2.getX()) {
mVFActivity.showNext();
} else if (e1.getX() < e2.getX()) {
mVFActivity.showPrevious();
} else {
return false;
}
return true;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
return mGestureDetector.onTouchEvent(event);
}
}
4 ScrollView
效果图：
实现原理：重写ScrollViewde的onScrollChanged（）方法，实现对移动距离的监听，从而做出一些动画效果
代码示例：
（1）重写的ScrollView
public class MyScrollView extends ScrollView {
private OnScrollChangedListener onScrollChangedListener;
public MyScrollView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyScrollView(Context context) {
super(context);
}
@Override
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
// l oldl 水平位移距离
// t oldt 垂直滚动的距离，一个是目前的一个是上一次的
super.onScrollChanged(l, t, oldl, oldt);
if (this.onScrollChangedListener != null) {
onScrollChangedListener.onScrollChanged(t, oldt);
}
}
public void setOnScrollChangedListener(
OnScrollChangedListener onScrollChangedListener) {
this.onScrollChangedListener = onScrollChangedListener;
}
}(2)界面实现代码：
public class ScollerViewActivity extends Activity implements
OnScrollChangedListener {
@ViewInject(R.id.ll_anim)
private LinearLayout mLLAnim;
private MyScrollView mSVmain;
private int mScrollViewHeight;
private int mStartAnimateTop;
private boolean hasStartED = false;
@ViewInject(R.id.tvInNew)
private TextView tvInNew;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_scrollview);
ViewUtils.inject(this);
initView();
setView();
}
private void initView() {
mSVmain = (MyScrollView) findViewById(R.id.sv_main);
//界面的跳转
tvInNew.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
startActivity(new Intent(ScollerViewActivity.this,SuccessLaunchActivity.class));
AnimationUtil.finishActivityAnimation(ScollerViewActivity.this);
}
});
}
private void setView() {
mSVmain.setOnScrollChangedListener(this);
mLLAnim.setVisibility(View.INVISIBLE);
}
@Override
public void onWindowFocusChanged(boolean hasFocus) {
super.onWindowFocusChanged(hasFocus);
mScrollViewHeight = mSVmain.getHeight();//此时获取的是屏幕的高度
mStartAnimateTop = mScrollViewHeight /5* 4;// 为了让mLLAnim开始动画能够被人看见所以设置这个距离
}
@Override
public void onScrollChanged(int top, int oldTop) {
int animTop = mLLAnim.getTop() - top;// mLLAnim还有多少距离就显示出来了
if (top > oldTop) {// 判断是上滑还是下滑
if (animTop < mStartAnimateTop && !hasStartED) {// 当mLLAnim 在界面的时候
Animation anim = AnimationUtils
.loadAnimation(this, R.anim.show);
mLLAnim.setVisibility(View.VISIBLE);
mLLAnim.startAnimation(anim);
hasStartED = true;
}
} else {//手指向下滑的时候
if (animTop > mStartAnimateTop && hasStartED) {
Animation anim = AnimationUtils.loadAnimation(this,
R.anim.close);
mLLAnim.setVisibility(View.INVISIBLE);
mLLAnim.startAnimation(anim);
hasStartED = false;
}
}
}
}
5仿墨迹天气
效果图：
实现原理：各种动画的结合，对控件的显示，隐藏的设置（看着高大上，其实也是很low是不是
，这么说应该不会被人打吧）
这里就不贴代码了，因为代码量真的有点大
对了，想看动画的可以看下http://blog.csdn.net/u013424496/article/details/51144171
注：在2,3中实现的方式中，图片尽量放在drawable_xxhdpi这种文件夹下面,这个应该不要说明理由了吧
最后附上demo:http://download.csdn.net/detail/u013424496/9539810
开源上一些启动动画：http://www.jianshu.com/p/b08286b9e3f6