一个应用程序都少不了欢迎页面和引导页面,本文主要讲如何制作一个引页面;

首页所有的目录结构:

新建Welcome引导页面和Activity:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" > <ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/welcome_android"/>
</RelativeLayout>
import android.app.Activity;
import android.content.Intent;
import android.content.SharedPreferences;
import android.content.SharedPreferences.Editor;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message; //进入APP后的第一个欢迎页面
//欢迎页面实现如果是首次运行APP的话,将页面延时2秒后,跳转到到引导页,如果不是第一次加载的话
//则跳到主页面
public class Welcome extends Activity { private Boolean isFirstIn=false;
private static final int GO_HOME=1000;
private static final int GO_GUIDE=1001;
private static final int TIME=2000;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.welcome);
init();
} private void init(){
SharedPreferences shared=getSharedPreferences("rock", MODE_PRIVATE);
//getBoolean 第二个参数defValue:如果Key在shared中不存在的话返回defValue
isFirstIn=shared.getBoolean("isFirstIn", true);
if(!isFirstIn){
// 延时2秒发送消息
myHandelr.sendEmptyMessageDelayed(GO_HOME, TIME);
}else{
//首次加载,保存加载记录并跳转到引导页
myHandelr.sendEmptyMessageDelayed(GO_GUIDE, TIME);
Editor editor=shared.edit();
editor.putBoolean("isFirstIn", false);
editor.commit();
} } //消息的处理者,handler负责将需要传递的信息封装成Message,通过调用handler对象的obtainMessage()来实现;
//将消息传递给Looper,这是通过handler对象的sendMessage()来实现的
private Handler myHandelr=new Handler(){
@Override
public void handleMessage(Message msg) {
switch (msg.what) {
case GO_HOME:
goHome();
break;
case GO_GUIDE:
goGuide();
break;
}
}
};
private void goGuide() {
Intent i=new Intent(Welcome.this,Guide.class);
startActivity(i);
finish();
}
private void goHome() {
Intent i=new Intent(Welcome.this,MainActivity.class);
startActivity(i);
finish();
}
}

然后是引导页面和引导页面的activity:

guide.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" > <android.support.v4.view.ViewPager
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@+id/viewPager1"
android:background="#00000000">
</android.support.v4.view.ViewPager>
<!-- 引导页面导航按钮 -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:layout_alignParentBottom="true"> <ImageView android:id="@+id/iv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/login_point_selected"/>
<ImageView android:id="@+id/iv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/login_point"/>
<ImageView android:id="@+id/iv3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/login_point"/>
</LinearLayout>
</RelativeLayout>

one.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" > <ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_1"/>
</LinearLayout>

two.xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" > <ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_2"/> </RelativeLayout>

trhee.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
tools:context=".MainActivity" > <ImageView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/guide_3"/> <LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
<!-- 进入主页面按钮 -->
<Button android:id="@+id/btnStart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="开始"/>
</LinearLayout>
</RelativeLayout>

Guide acitvity:

import java.util.ArrayList;
import java.util.List; import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView; //引导页面
//1.实现引导页面三张引导图通过左右滑动屏幕可以实现切换
//2.在引导页面下面添加导航条,滑动过程中,让当前页面的导航条处于选中状态
//3.在引导页面的最后一个页面添加进入主页面按钮,点击按钮进入主页面
public class Guide extends Activity implements OnPageChangeListener { private List<View> views;
private ViewPagerAdapter vpa;
private ViewPager vp;
private ImageView[] ivs;
private int[] ids=new int[]{R.id.iv1,R.id.iv2,R.id.iv3}; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.guide);
initViews();
initIvs();
} private void initViews(){
//通过LayoutInflater 加载三个引导页面
LayoutInflater inflater=LayoutInflater.from(this);
views=new ArrayList<View>();
views.add(inflater.inflate(R.layout.one, null));
views.add(inflater.inflate(R.layout.two, null));
views.add(inflater.inflate(R.layout.three, null)); vpa=new ViewPagerAdapter(views, this);
vp=(ViewPager)findViewById(R.id.viewPager1);
vp.setAdapter(vpa);
//为ViewPager设置监听事件
vp.setOnPageChangeListener(this);
//点击第三个页面的开始按钮,进入主页面
Button btn=(Button) views.get(2).findViewById(R.id.btnStart);
btn.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
Intent i=new Intent(Guide.this,MainActivity.class);
startActivity(i);
finish();
}
});
}
// 加载导航条的ImageView
private void initIvs(){
ivs=new ImageView[views.size()];
for(int i=0;i<views.size();i++){
ivs[i]=(ImageView)findViewById(ids[i]);
}
} @Override
public void onPageScrollStateChanged(int arg0) {
} @Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
} // ViewPager监听事件,当ViewPager页面改变的时候,设置当前导航条的状态为选中状态
@Override
public void onPageSelected(int arg0) {
for(int i=0;i<ids.length;i++){
if(arg0==i){
ivs[i].setImageResource(R.drawable.login_point_selected);
}else{
ivs[i].setImageResource(R.drawable.login_point);
}
}
} }

ViewPagerAdapter 容器:

import java.util.List;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
// 继承自PagerAdapter,并且实现添加引导页和移除引导页的方法
public class ViewPagerAdapter extends PagerAdapter{ private List<View> views;
private Context context; public ViewPagerAdapter(List<View> views,Context context){
this.views=views;
this.context=context;
} @Override
public Object instantiateItem(View container, int position) {
((ViewPager)container).addView(views.get(position));
return views.get(position);
} @Override
public void destroyItem(View container, int position, Object object) { ((ViewPager)container).removeView(views.get(position));
} @Override
public int getCount() {
return views.size();
} @Override
public boolean isViewFromObject(View arg0, Object arg1) {
return (arg0==arg1);
} }

最后设置AndroidManifest.xml:

<activity
android:name="com.example.lo12viewpager2.MainActivity"
android:label="@string/app_name" >
</activity>
<activity
android:name="com.example.lo12viewpager2.Guide"
android:label="@string/app_name" >
</activity>
<activity
android:name="com.example.lo12viewpager2.Welcome"
android:label="@string/app_name" >
<intent-filter>
<action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>

效果:

AndroidUI 引导页面的使用的更多相关文章

  1. swift3.0 创建一个app引导页面

    swift毕竟不像是oc ,第三方的框架很多,更何况是3.0,自己动手写了个引导页面,看得上我代码的麻友可以拿去用 引导页面有三个部分构成,scrollview用语切换引导视图,pageControl ...

  2. android UI进阶之用ViewPager实现欢迎引导页面

    ViewPager需要android-support-v4.jar这个包的支持,来自google提供的一个附加包.大家搜下即可. ViewPager主要用来组织一组数据,并且通过左右滑动的方式来展示. ...

  3. iOS 应用首次开启 出现引导页面

    关于引导页面 ,可以是独立的一个视图控制器控制的滚动视图. 重点是处理 如何判断app是首次开启 而调用这个视图控制器得方法. 逻辑如下: -(BOOL)isFirstLoad { if(!标记第一次 ...

  4. 使用 StoryBoard 的时候加入用户引导页面

    如果想让一个APP加上引导页面是一个非常完美的举动 但是,总会遇到一些问题 (不要忘记在APDelegate里面加上用户引导页面的头文件和程序启动时的第一个页面哦) 情况一:纯代码 判断是否是第一次启 ...

  5. Android开发必知--WebView加载html5实现炫酷引导页面

    大多数人都知道,一个APP的引导页面还是挺重要的,不过要想通过原生的Android代码做出一个非常炫酷的引导页相对还是比较复杂的,正巧html5在制作炫酷动画网页方面比较给力,我们不妨先利用html5 ...

  6. android UI进阶之用ViewPager实现欢迎引导页面[转]

    ViewPager需要android-support-v4.jar这个包的支持,来自google提供的一个附加包.大家搜下即可. ViewPager主要用来组织一组数据,并且通过左右滑动的方式来展示. ...

  7. App引导页面源代码的实现

    一.页面效果图

  8. ViewPager实现启动引导页面(个人认为很详细)

    效果如图: 启动页面是一张图片+延时效果,这里就不给出布局文件了. WelcomeActivity分析:在启动页面检测是否是第一次运行程序,如果是,则先跳转到引导界面的Activity——AndyVi ...

  9. Android欢迎页面以及引导页面

    开发环境:Windows 10 x64,Android Studio 3.0 很多APP都会在启动主界面(MainActivity)之前显示一个短暂的欢迎页面,设置微博,知乎,百度之类APP还是在欢迎 ...

随机推荐

  1. USB学习小记-HID类键盘的报告描述符的理解

    前言 断断续续的学习了将近三个月,才把USB的HID类搞明白,速度真是够慢的.利用晚上+周末的时间学习自己的东西确实是必要的,不过效率是有点低,以后要更专注一些才行,希望自己能做到吧. 在学习过程中, ...

  2. C#尝试读取或写入受保护的内存。这通常指示其他内存已损坏。

    安装VS2013后,win7 + .net 4 + c#程序无法连接到SQL Server2000的实例 SQLServer2012在登录远程服务器实例时报错:尝试读取或写入受保护的内存. “尝试读取 ...

  3. thinkphp 表名注意

    $db = "DomainInfo";//查找相关任务的结果表 $result = M($db); $rescc = $result->select(); var_dump( ...

  4. pushMeBaby,github链接

    https://github.com/stefanhafeneger/PushMeBaby

  5. sharepoint 2010 使用自定义列表模版创建列表(2)

    前面用的方法是通过界面上操作,根据自定义模版,创建的列表.sharepoint 2010 使用自定义列表模版创建列表(1) 这里顺便记录多另一种方法,通过程序来创建. ---------------- ...

  6. 关于CoreData的理解和使用.

    CoreData是苹果官方推出的一种方便的面向对象的存储方式,相信大家都已经对其有所了解,但是对于CoreData的概念大家都存在部分的误区.给大家推荐个网址是苹果的官方文档的翻译版(http://o ...

  7. Pet(dfs+vector)

    Pet Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...

  8. Eclipse中更改默认java代码格式【转】

    在写代码时常常有2种代码样式习惯,如下图.由于一直习惯了第一种代码格式,而看第二种代码格式时感觉代码很乱,总找不到“{ }”对称的感觉.Eclipse自动格式化代码的快捷方式是Ctrl+Shift+F ...

  9. javascript如何判断访问网页的设备及是否支持触屏功能

    var system ={}; var p = navigator.platform; system.win = p.indexOf("Win") == 0; system.mac ...

  10. Flash Recovery Area

    1. 设置闪回恢复区 闪回恢复区主要通过3个初始化参数来设置和管理 db_recovery_file_dest:指定闪回恢复区的位置db_recovery_file_dest_size:指定闪回恢复区 ...