安卓 Day 23 ：利用视图翻页器实现引导项
2024-04-06 04:15:59
一.基础知识
- 活动（Activity）
- 按钮（Button）
- 图像视图（ImageView）
- 视图翻页器（ViewPager）
- 消息处理器（Handler）
- 线性布局（LinearLayout）
二.通过实训案例来了解
1.创建安卓项目
- 将主界面MainActivity更名为SplashActivity，将activity_main.xml更名为activity_splash.xml
2.准备图片资源
3.基于模板创建引导页界面
- finish之后就会出现两个
4.基于模板创建主界面
5.创建共享参数工具类
package net.yuanjing.guide;import android.content.Context;
import android.content.SharedPreferences;public class ShareUtils {private static final String NAME = "config";//文件名private static final int MODE = Context.MODE_PRIVATE;//访问模式private static SharedPreferences sp;//共享参数private static SharedPreferences.Editor editor;//编辑器public static void putBoolean(Context context, String key, boolean value) {sp = context.getSharedPreferences(NAME, MODE);//获取共享参数editor = sp.edit();//获取编辑器对象editor.putBoolean(key, value);//写入数据到指定文件（config.xml)editor.commit();//提交，确认写操作}public static boolean getBoolean(Context context, String key, boolean defaultValue) {sp = context.getSharedPreferences(NAME,MODE);//获取共享参数return sp.getBoolean(key, defaultValue);//如果键不存在，那么就返回缺省值defValue}
}6.实现欢迎界面功能
（1）布局文件Activity_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/splash_back"android:gravity="center"android:orientation="vertical"tools:context=".SplashActivity"><LinearLayoutandroid:layout_width="match_parent"android:layout_height="0dp"android:layout_weight="5"></LinearLayout><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="0dp"android:layout_weight="1"android:gravity="center_vertical"><ImageViewandroid:id="@+id/iv_car"android:layout_width="100dp"android:layout_height="100dp"android:layout_marginBottom="20dp"android:background="@mipmap/car" /></LinearLayout>
</LinearLayout>
- 运行程序，欢迎界面有活动栏
（2）全屏显示欢迎界面
- 在项目清单文件设置
- 此时运行结果
（3）创建动画资源文件
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" ><alphaandroid:duration="3000"android:fromAlpha="0.0"android:toAlpha="1.0" /><rotateandroid:duration="3000"android:fromDegrees="0"android:pivotX="50%"android:pivotY="50%"android:toDegrees="360" />
</set>
（4）欢迎界面代码SplashActivity.java
package net.yuanjing.guide;import androidx.appcompat.app.AppCompatActivity;import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;public class SplashActivity extends AppCompatActivity {private Animation animation;//动画对象private ImageView ivCar;//小车图像视图private final int DELAY_TIME = 4000;//延迟时间@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//利用布局资源文件设置用户资源文件setContentView(R.layout.activity_splash);//通过资源标识符获取控件实例ivCar = findViewById(R.id.iv_car);//创建动画animation = AnimationUtils.loadAnimation(this, R.anim.animator);//启动动画ivCar.startAnimation(animation);//利用消息处理器实现延迟跳转new Handler().postDelayed(new Runnable() {@Overridepublic void run() {Intent intent = null;//判读安卓应用，根据安卓应用是否是第一次运行，决定跳转到不同界面if (isFirstRunning()) {//创建意图，目标组件是引导页界面intent = new Intent(SplashActivity.this, GuideActivity.class);} else {//创建意图，目标组件是主界面intent = new Intent(SplashActivity.this, MainActivity.class);} //按照意图跳转到目标组件startActivity(intent);//关闭启动界面finish();}},DELAY_TIME);}/*判断是否第一次运行true 就是第一次运行，false就不是第一次运行*/private boolean isFirstRunning() {//从配置文件里获取变量值（如果按键没有取到值，那么肯定是第一次运行，因此defValue一个设置为true）boolean isFirstRunning = ShareUtils.getBoolean(this,"isFirstRunning",true);//判读安卓应用是否是第一次运行if (isFirstRunning) {//已经运行了第一次，写入数据共享参数配置文件（注意：isFirstRunning = false）ShareUtils.putBoolean(this,"isFirstRunning",false);return true;} else {return false;}}
}
在设备文件浏览器的data/data目录里，查看
此时运行程序查看结果
打开配置文件，查看内容
7.实现引导页界面
（1）三个引导页布局文件
1.第一个引导页界面
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/page1">
</LinearLayout>
2.第二个引导页界面
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/page2">
</LinearLayout>
3.第三个引导页界面
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@mipmap/page3">
</LinearLayout>
（2）引导页布局资源文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><androidx.viewpager.widget.ViewPagerandroid:id="@+id/pager"android:layout_width="match_parent"android:layout_height="match_parent" /><LinearLayoutandroid:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_marginBottom="15dp"android:gravity="center"android:orientation="horizontal"><ImageViewandroid:id="@+id/point1"android:layout_width="10dp"android:layout_height="10dp" /><ImageViewandroid:id="@+id/point2"android:layout_width="10dp"android:layout_height="10dp"android:layout_marginLeft="10dp"android:layout_marginRight="10dp" /><ImageViewandroid:id="@+id/point3"android:layout_width="10dp"android:layout_height="10dp"android:layout_marginEnd="10dp" /></LinearLayout><Buttonandroid:id="@+id/btn_skip"android:layout_width="80dp"android:layout_height="40dp"android:layout_alignParentEnd="true"android:layout_marginTop="25dp"android:layout_marginEnd="25dp"android:background="@drawable/shape_skip"android:text="@string/skip"android:textColor="@android:color/white"android:textSize="20sp" />
</RelativeLayout>（3）字符串资源文件
<resources><string name="app_name">引导页演示</string><string name="skip">跳过</string><string name="start">开始使用</string></resources>
（4）创建背景配置文件
1.开始背景
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"><solid android:color="#aa00bb" /><cornersandroid:bottomLeftRadius="10dp"android:bottomRightRadius="10dp"android:topLeftRadius="10dp"android:topRightRadius="10dp" /><strokeandroid:width="0.5dp"android:color="#787878" />
</shape>
2.结束背景
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"><solid android:color="#aaaaaa" /><cornersandroid:bottomLeftRadius="10dp"android:bottomRightRadius="10dp"android:topLeftRadius="10dp"android:topRightRadius="10dp" /><strokeandroid:width="0.5dp"android:color="#787878" />
</shape>
3.跳过按钮背景配置文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"><solid android:color="#00aadd" /><cornersandroid:bottomLeftRadius="8dp"android:bottomRightRadius="8dp"android:topLeftRadius="8dp"android:topRightRadius="8dp" /><strokeandroid:width="0.5dp"android:color="#787878" />
</shape>
4.开始使用按钮背景配置文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"><solid android:color="#886688" /><cornersandroid:bottomLeftRadius="8dp"android:bottomRightRadius="8dp"android:topLeftRadius="8dp"android:topRightRadius="8dp" /><strokeandroid:width="0.5dp"android:color="#787878" />
</shape>
（5）引导页界面代码
package net.yuanjing.guide;import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;import java.util.ArrayList;
import java.util.List;public class GuideActivity extends AppCompatActivity {private ViewPager pager;//视图翻页private List<View> views = new ArrayList<>();//三个引导页视图private View view1, view2, view3; // 三个引导页视图private ImageView point1,point2,point3;//三个圆点视图private Button btnSkip;//跳过按钮private Button btnStart;//开始按钮private GuideAdapter adapter;//引导页适配器@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);//利用布局资源文件设置用户界面setContentView(R.layout.activity_guide);//初始化用户界面initView();//进行事件处理eventHandling();}/*设置圆点(当前圆点用shape_point_on)非当前圆点用shape_point_off*/private void setPoint(int index) {point1.setBackgroundResource(R.drawable.shape_point_off);point2.setBackgroundResource(R.drawable.shape_point_off);point3.setBackgroundResource(R.drawable.shape_point_off);switch (index) {case 1://第一个引导页是当前引导页point1.setBackgroundResource(R.drawable.shape_point_on);break;case 2://第一个引导页是当前引导页point2.setBackgroundResource(R.drawable.shape_point_on);break;case 3://第一个引导页是当前引导页point3.setBackgroundResource(R.drawable.shape_point_on);break;}}private void initView() {// 通过资源标识符获取控件实例point1 = findViewById(R.id.point1);point2 = findViewById(R.id.point2);point3 = findViewById(R.id.point3);btnSkip = findViewById(R.id.btn_skip);pager = findViewById(R.id.pager);// 设置默认图片setPoint(1);// 获取引导页视图view1 = View.inflate(this, R.layout.page1, null);view2 = View.inflate(this, R.layout.page2, null);view3 = View.inflate(this, R.layout.page3, null);btnStart = view3.findViewById(R.id.btn_start);// 添加到引导页容器views.add(view1);views.add(view2);views.add(view3);// 创建引导页适配器adapter = new GuideAdapter(this, views);// 设置适配器pager.setAdapter(adapter);}private void eventHandling() {//跳过按钮注册监听器btnSkip.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {//创建意图，目标组件是主界面Intent intent = new Intent(GuideActivity.this, MainActivity.class);//按意图启动主界面startActivity(intent);//关闭引导页界面finish();}});//给【视图翻页器】注册监听器pager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}@Overridepublic void onPageSelected(int position) {switch (position) {case 0://第一个引导页是当前引导页setPoint(1);btnSkip.setVisibility(View.VISIBLE);break;case 1://第二个引导页是当前引导页setPoint(2);btnSkip.setVisibility(View.VISIBLE);break;case 2://第一个引导页是当前引导页setPoint(3);btnSkip.setVisibility(View.GONE);break;}}@Overridepublic void onPageScrollStateChanged(int state) {}});//给【开始使用】按钮注册监听器btnStart.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View view) {//创建意图，目标组件是主界面Intent intent = new Intent(GuideActivity.this, MainActivity.class);//按意图启动主界面startActivity(intent);//关闭引导页界面finish();}});}
}
（6）全局显示
- 将这个文件删除
（7）运行，查看效果
安卓 Day 23 ：利用视图翻页器实现引导项相关推荐
- 基于ESP32的蓝牙翻页器设计(论文附调试成功代码！！）
基于ESP32的蓝牙翻页器设计 目录 基于ESP32的蓝牙翻页器设计 1 摘要 1 1.绪论 2 1.1认识蓝牙 2 1.2研究思路 3 2.软硬件设计 3 2.1中央处理模块------ESP32 ...
- 使用jQuery封装翻页器
<div class="pagination"></div> (function($) {$.fn.pagination = function(option ...
- ViewPager 视图翻页工具
视图翻页工具 先创建三个布局,用于当做翻页 其他俩个类似 回到activity_main.xml 我们可以看到这里是androidx里的全类名 然后去java代码中 创建一个MyAdapter 这里M ...
- elementUI 写一个表头列名、表体单元格样式、翻页器相对较为动态的表格el-table
<template><!-- 表格---------------------------------------- --><div class="table&q ...
- element ui 上一页下一页_vue翻页器，包括上一页，下一页，跳转
翻页组件 -- 子组件 上一页 {{i}} {{i}} {{i}} - - - - 下一页 跳转到: GO export default { model: { // 通过v-model传过来的参数 p ...
- Vue 实现翻页器 下一页 处理显示多页面要下一页非表格
vue里面因为数据太多要弄多个页面,路由又不行,element ui的分页器用不了 我的环境是electron-vue,和vue通用的可以无视,这里采用了element ui 的走马灯当做容器翻页 首 ...
- avue中crud翻页器currentPage等修改数据，页面不同步问题
<avue-crud :option="option" ref="crud" //表格常用事件 @on-load="getList"/ ...
- 一种语音控制PPT翻页系统的制作方法
本实用新型属于智能语音领域,特别是涉及一种语音控制PPT翻页系统. 背景技术: 随着计算机技术.投影技术和网络技术的发展,各行各业的工作已经离不开计算机的参与.多媒体演示已经受到了人们的广泛应用.而多 ...
- 控制翻页c语言,阅读器多种翻页的设计与实现
前言 前文介绍的是小说阅读器的设计和实现,本文作为补充对多种翻页模式做详细剖析. 正文 常见的阅读器翻页模式包括:平移.仿真.滑页和上下: 平移:左右滑动: 仿真:左右滑动:(纸质书翻页效果) 滑页: ...
- 利用CSS，实现翻页效果
利用css3的3d效果,实现一个简单的翻页器: <!DOCTYPE html> <html lang="en"> <head><meta ...
最新文章
- debug —— C语言 编译时候进行debug的调试
- Trie树的常见应用大总结（面试+附代码实现）
- Codeforces Round #628 (Div. 2) E. Ehab‘s REAL Number Theory Problem 巧妙的质因子建图
- 【转】三五个人十来条枪 如何走出软件作坊成为开发正规军
- IoT -- (三) 2018 Top物联网项目排名
- python做线性回归统计推断提取参数_概率分析方法与推断统计(来自我写的python书)...
- vue（组件、路由）懒加载
- brctl tunctl 虚拟网卡 桥接
- 离线ROS API文档（Zeal或Dash）
- Leftist Heaps
- 数据结构（一）、二叉树（BT），二叉查找树（BST），平衡二叉树（AVL树）
- 自抗扰控制中的扩张状态观测器收敛性分析1
- 一只小白，在学习delphi.感觉很吃力。。
- PyTorch学习（十一）encoded，decoded
- SLAM 03.多传感器融合算法
- SSM——SpringMVC
- 狂乱的潇洒主义者，频繁的追求自由者！
- 【模式识别1】PCA+FLD人脸识别
- 全自动细菌菌落计数器
- CloudComparePCL 基于FPFH特征的SAC-IA算法