android用户引导页,android欢迎界面引导页

android欢迎界面是所有程序开始的一个简短的自我介绍，让用户能够通过简单的描述和图片信息更好的了解软件，对用户体验效果非常的重要。这里我会使用VIewPager做一个欢迎界面。

1设计背景图片

根据4.0手机的宽高480:800 = 3:5的一个比例，所以自己图片宽要大于480，同时比例要和3:5差距不大。这里使用640:960这样常见的宽高，保证图片的完整比例，既不会被拉伸的明显，也不会被缩放的变形。

设计各个页面的显示情况，最好是简单明晰，吸引人。

2设计页面

这里总共设计了四个界面，背景依次为：

 

 

 

接下来就是在界面上加上一些效果。

2.1统一的字体样式

在每个页面的字体我都是用了统一的格式，代码如下：

wrap_content

wrap_content

20dp

?android:attr/textAppearanceLarge

@color/yellow

20sp

bold|italic

2.2进入最后一个页面的一个按键格式

xmlns:android="http://schemas.android.com/apk/res/android">

3 程序实现页面的切换功能

publicclassmainWelcomextendsActivity {

//翻页控件

privateViewPager mViewPager;

privateImageView mPage0;

privateImageView mPage1;

privateImageView mPage2;

privateImageView mPage3;

@Override

publicvoidonCreate(Bundle savedInstanceState) {

//去掉标题栏全屏显示

requestWindowFeature(Window.FEATURE_NO_TITLE);

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

mViewPager = (ViewPager)findViewById(R.id.whatsnew_viewpager);

mViewPager.setOnPageChangeListener(newMyOnPageChangeListener());

mPage0 = (ImageView)findViewById(R.id.page0);

mPage1 = (ImageView)findViewById(R.id.page1);

mPage2 = (ImageView)findViewById(R.id.page2);

mPage3 = (ImageView)findViewById(R.id.page3);

/*

* 这里是每一页要显示的布局，根据应用需要和特点自由设计显示的内容

* 以及需要显示多少页等

*/

LayoutInflater mLi = LayoutInflater.from(this);

View view1 = mLi.inflate(R.layout.whats_news_gallery1, null);

View view2 = mLi.inflate(R.layout.whats_news_gallery2, null);

View view3 = mLi.inflate(R.layout.whats_news_gallery3, null);

View view4 = mLi.inflate(R.layout.whats_news_gallery4, null);

/*

* 这里将每一页显示的view存放到ArrayList集合中

* 可以在ViewPager适配器中顺序调用展示

*/

finalArrayList views =newArrayList();

views.add(view1);

views.add(view2);

views.add(view3);

views.add(view4);

//填充ViewPager的数据适配器

pagerAdapter mPagerAdapter = newpagerAdapter(views);

mViewPager.setAdapter(mPagerAdapter);

}

publicclassMyOnPageChangeListenerimplementsOnPageChangeListener {

publicvoidonPageSelected(intpage) {

//翻页时当前page,改变当前状态园点图片

switch(page) {

case0:

mPage0.setImageDrawable(getResources().getDrawable(R.drawable.page_now));

mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page));

break;

case1:

mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page_now));

mPage0.setImageDrawable(getResources().getDrawable(R.drawable.page));

mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page));

break;

case2:

mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page_now));

mPage1.setImageDrawable(getResources().getDrawable(R.drawable.page));

mPage3.setImageDrawable(getResources().getDrawable(R.drawable.page));

break;

case3:

mPage3.setImageDrawable(getResources().getDrawable(R.drawable.page_now));

mPage2.setImageDrawable(getResources().getDrawable(R.drawable.page));

break;

}

}

publicvoidonPageScrolled(intarg0,floatarg1,intarg2) {

}

publicvoidonPageScrollStateChanged(intarg0) {

}

}

}

这里的ViewPager相当于一个双向队列，实现界面的左右切换。设置一pagerAdapter

packagecom.news.welcome;

importjava.util.ArrayList;

importandroid.support.v4.view.PagerAdapter;

importandroid.support.v4.view.ViewPager;

importandroid.view.View;

publicclasspagerAdapterextendsPagerAdapter {

privateArrayList views;

publicpagerAdapter(ArrayList views){

this.views = views;

}

@Override

publicintgetCount() {

returnthis.views.size();

}

@Override

publicbooleanisViewFromObject(View arg0, Object arg1) {

returnarg0 == arg1;

}

publicvoiddestroyItem(View container,intposition, Object object) {

((ViewPager)container).removeView(views.get(position));

}

//页面view

publicObject instantiateItem(View container,intposition) {

((ViewPager)container).addView(views.get(position));

returnviews.get(position);

}

}

4 程序启动显示此界面

android:allowBackup="true"

android:icon="@drawable/ic_launcher"

android:label="@string/app_name">

android:name="com.news.welcome.mainWelcom"

android:label="@string/app_name"

android:theme="@android:style/Theme.NoTitleBar.Fullscreen">

这里要注意，android:theme="@android:style/Theme.NoTitleBar.Fullscreen需要使用，因为在Mainfest中的设置会在程序中先执行，也就是他会比requestWindowFeature

(Window.FEATURE_NO_TITLE)先运行。如果有其他title则会先显示title，这并不是我们想要的结果。

 

 

 

最后附上源码：

转载地址：

http://blog.csdn.net/feiyangxiaomi/article/details/12840881