摘要:原文发布于我的博客猿上篇文章实践之打造酷炫启动页中,我们尝试了用实现酷炫的启动页,今天我们再此基础上加入首次使用时的引导页功能。以上,我们华丽丽的引导页就完成了,需要完整代码的请戳代码传送门
原文发布于我的博客 Android猿
上篇文章 :RxJava实践之打造酷炫启动页中,我们尝试了用RxJava实现酷炫的启动页,今天我们再此基础上加入首次使用APP时的引导页功能。效果如下图:
思路:思路其实很简单,就是在WelcomeActivity 中setContentView()之前判断是否是首次打开APP,若是,则去启动引导页(WelcomeGuideActivity)并return;若不是,则直接setContentView(),然后启动动画再启动MainActivity。
一、WelcomeActivity中判断是否是第一次启动@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // 判断是否是第一次开启应用 boolean isFirstOpen = SharedPreferencesUtil.getBoolean(this, SharedPreferencesUtil.FIRST_OPEN, true); // 如果是第一次启动,则先进入功能引导页 if (isFirstOpen) { Intent intent = new Intent(this, WelcomeGuideActivity.class); startActivity(intent); finish(); return; } // 如果不是第一次启动app,则正常显示启动屏 setContentView(R.layout.activity_welcome); ButterKnife.bind(this); startMainActivity(); }
我们判断是否是第一次打开APP是用了SharedPreferences,我们这里对他进行了一下简单封装,代码如下:
/** * Created by xialo on 2016/7/25. */ public class SharedPreferencesUtil { private static final String spFileName = "welcomePage"; public static final String FIRST_OPEN = "first_open"; public static Boolean getBoolean(Context context, String strKey, Boolean strDefault) {//strDefault boolean: Value to return if this preference does not exist. SharedPreferences setPreferences = context.getSharedPreferences( spFileName, Context.MODE_PRIVATE); Boolean result = setPreferences.getBoolean(strKey, strDefault); return result; } public static void putBoolean(Context context, String strKey, Boolean strData) { SharedPreferences activityPreferences = context.getSharedPreferences( spFileName, Context.MODE_PRIVATE); SharedPreferences.Editor editor = activityPreferences.edit(); editor.putBoolean(strKey, strData); editor.commit(); } }二、WelcomeGuideActivity中,我们使用ViewPager以加载多个引导页面使其可以左右滑动
不多说,请看WelcomeGuideActivity.java代码:
/** * Created by xialo on 2016/7/25. */ public class WelcomeGuideActivity extends Activity implements View.OnClickListener { private ViewPager vp; private GuideViewPagerAdapter adapter; private Listviews; private Button startBtn; // 引导页图片资源 private static final int[] pics = { R.layout.guide_view1, R.layout.guide_view2, R.layout.guide_view3}; // 底部小点图片 private ImageView[] dots; // 记录当前选中位置 private int currentIndex; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_guide); views = new ArrayList (); // 初始化引导页视图列表 for (int i = 0; i < pics.length; i++) { View view = LayoutInflater.from(this).inflate(pics[i], null); if (i == pics.length - 1) { startBtn = (Button) view.findViewById(R.id.btn_enter); startBtn.setTag("enter"); startBtn.setOnClickListener(this); } views.add(view); } vp = (ViewPager) findViewById(R.id.vp_guide); adapter = new GuideViewPagerAdapter(views); vp.setAdapter(adapter); vp.addOnPageChangeListener(new PageChangeListener()); initDots(); } @Override protected void onResume() { super.onResume(); } @Override protected void onPause() { super.onPause(); // 如果切换到后台,就设置下次不进入功能引导页 SharedPreferencesUtil.putBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false); finish(); } @Override protected void onStop() { super.onStop(); } @Override protected void onDestroy() { super.onDestroy(); } private void initDots() { LinearLayout ll = (LinearLayout) findViewById(R.id.ll); dots = new ImageView[pics.length]; // 循环取得小点图片 for (int i = 0; i < pics.length; i++) { // 得到一个LinearLayout下面的每一个子元素 dots[i] = (ImageView) ll.getChildAt(i); dots[i].setEnabled(false);// 都设为灰色 dots[i].setOnClickListener(this); dots[i].setTag(i);// 设置位置tag,方便取出与当前位置对应 } currentIndex = 0; dots[currentIndex].setEnabled(true); // 设置为白色,即选中状态 } /** * 设置当前view * * @param position */ private void setCurView(int position) { if (position < 0 || position >= pics.length) { return; } vp.setCurrentItem(position); } /** * 设置当前指示点 * * @param position */ private void setCurDot(int position) { if (position < 0 || position > pics.length || currentIndex == position) { return; } dots[position].setEnabled(true); dots[currentIndex].setEnabled(false); currentIndex = position; } @Override public void onClick(View v) { if (v.getTag().equals("enter")) { enterMainActivity(); return; } int position = (Integer) v.getTag(); setCurView(position); setCurDot(position); } private void enterMainActivity() { Intent intent = new Intent(WelcomeGuideActivity.this, WelcomeActivity.class); startActivity(intent); SharedPreferencesUtil.putBoolean(WelcomeGuideActivity.this, SharedPreferencesUtil.FIRST_OPEN, false); finish(); } private class PageChangeListener implements ViewPager.OnPageChangeListener { @Override public void onPageScrollStateChanged(int position) { } @Override public void onPageScrolled(int position, float arg1, int arg2) { } @Override public void onPageSelected(int position) { // 设置底部小点选中状态 setCurDot(position); } } }
我们用了三个页面guide_view1、guide_view2、guide_view3作为引导页面,布局类似,只是guide_view3多了个点击进入的Button。以下是guide_view3.xml
WelcomeGuideActivity中值得注意的是该Button点击事件的处理,在点击Button后我们并没有直接进入MainActivity,而是先把SharedPreferences中标记是否第一次进入的布尔值设为false,而后再次进入WelcomeActivity,此时WelcomeActivity会直接setContentView()然后启动动画,进入MainActivity。
以上,我们华丽丽的引导页就完成了,需要完整代码的请戳 代码传送门
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/13140.html
摘要:原文发布于我的博客猿之前注意到启动页很是酷炫,今天我们使用和属性动画模仿实现其效果。需要完整代码可以戳这里代码传送门 原文发布于我的博客Android猿 之前注意到coding APP启动页很是酷炫,今天我们使用RxJava和属性动画模仿实现其效果。 showImg(/img/remote/1460000006773379); 一、新建启动页WelcomeActivity 注意,我们这...
摘要:原文发布于我的博客猿之前注意到启动页很是酷炫,今天我们使用和属性动画模仿实现其效果。需要完整代码可以戳这里代码传送门 原文发布于我的博客Android猿 之前注意到coding APP启动页很是酷炫,今天我们使用RxJava和属性动画模仿实现其效果。 showImg(https://segmentfault.com/img/remote/1460000006773379); 一、新建启...
摘要:作为一个有好奇心的工程狮,当然第一时间就去试了试手,效果非常赞,因此这关于的那些开源掘金摘要自从推出后,其对布局的灵活控制是让开发者们称赞不已。 Android 引导页根据滑动切换逐渐改变背景色 - Android - 掘金下面的知识点呢,是自己第一次做这个效果,记录下知识,不知道有没有更好的实现方法。 在Android项目中有些引导页上面是一些小图组合成的,背景颜色是纯色的,每一张颜...
摘要:新推出基于物理的动画库,完全诠释什么叫做弹簧效果掘金最近推出一个新的基于物理学的动画支持库,命名为弹簧动画,发布在里面。它也是不必纠结还是,听我说两句掘金故事开始全称是也就是模型视图控制器。 【掘金日报】第二期 全球最大成人网站 PornHub 爬虫??? - 掘金掘金日报主打分享优质深度技术内容,技术内容分:前端、后端、Android、iOS、产品设计、工具资源和一些有趣的东西。 前...
阅读 2204·2021-11-16 11:44
阅读 1642·2021-10-12 10:12
阅读 1875·2021-09-22 15:22
阅读 2870·2021-08-11 11:17
阅读 1382·2019-08-29 16:53
阅读 2553·2019-08-29 14:09
阅读 3373·2019-08-29 14:03
阅读 3182·2019-08-29 11:09