android导航页（欢迎页实现十分简单）

2023-11-01 11:20
文章标签 简单 实现 android 欢迎 导航页 十分

本文主要是介绍android导航页（欢迎页实现十分简单），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

  • 首先要弄明白原理，大致了解一下该流程


    1、创建一个类继承自SimplePagerFragment，实现对导航页面的页面循环的设置、背景颜色的设置以及页面监听事件的设置
    2、创建类定义每一个的页面（有多少页就创建多少个页面，当然布局文件是肯定需要的不再赘叙）
    3、在Activity中启动
  • 创建创建一个类继承自SimplePagerFragment代码如下：
     
        
    1. package com.cleveroad.slidingtutorial.sample;
    2.  
    3. import android.graphics.Color;
    4. import android.support.annotation.ColorInt;
    5. import android.support.v4.content.ContextCompat;
    6. import android.view.View;
    7. import android.widget.Toast;
    8.  
    9. import com.cleveroad.slidingtutorial.PageFragment;
    10. import com.cleveroad.slidingtutorial.SimplePagerFragment;
    11.  //此处继承自SimplePagerFragment查看库文件代码发现SimplePagerFragment继承自CustomPresentationPagerFragment
    12. public class CustomPresentationPagerFragment extends SimplePagerFragment {
    13.  
    14. //获取页面个数
    15.    @Override
    16.    protected int getPagesCount() {
    17.       return 6;
    18.    }
    19.  
    20. //注意此处是背景上所添加的图案的循环出现的次数，运行安装后可以发现第一个页面（position=0）的图案和第四个（position=3）是相同的就是在此处设置的
    21.    @Override
    22.    protected PageFragment getPage(int position) {
    23.       position %= 3;
    24.       if (position == 0)
    25.          return new FirstCustomPageFragment();
    26.       if (position == 1)
    27.          return new SecondCustomPageFragment();
    28.       if (position == 2)
    29.          return new ThirdCustomPageFragment();
    30.       throw new IllegalArgumentException("Unknown position: " + position);
    31.    }
    32.  
    33. //设置背景颜色，现在越来越多的软件背景都是以颜色代替呈现一种扁平化的感觉，也可以自定义图片
    34.    @ColorInt
    35.    @Override
    36.    protected int getPageColor(int position) {
    37.       if (position == 0)
    38.          return ContextCompat.getColor(getContext(), android.R.color.holo_orange_dark);
    39.       if (position == 1)
    40.          return ContextCompat.getColor(getContext(), android.R.color.holo_green_dark);
    41.       if (position == 2)
    42.          return ContextCompat.getColor(getContext(), android.R.color.holo_blue_dark);
    43.       if (position == 3)
    44.          return ContextCompat.getColor(getContext(), android.R.color.holo_red_dark);
    45.       if (position == 4)
    46.          return ContextCompat.getColor(getContext(), android.R.color.holo_purple);
    47.       if (position == 5)
    48.          return ContextCompat.getColor(getContext(), android.R.color.darker_gray);
    49.       return Color.TRANSPARENT;
    50.    }
    51.  
    52. //是否循环滑动（true一直循环滑动不进入程序，false相反）
    53.    @Override
    54.    protected boolean isInfiniteScrollEnabled() {
    55.       return true;
    56.    }
    57.  
    58. //监听事件（页面上左下角Skip的点击事件---布局代码都在库文件中不可修改但是如果需要自己定义点击图标以及事件可以继承其抽象类的抽象方法去实现
    59.    @Override
    60.    protected boolean onSkipButtonClicked(View skipButton) {
    61.       Toast.makeText(getContext(), "Skip button clicked", Toast.LENGTH_SHORT).show();
    62.       return true;
    63.    }
    64. }
  • 设置单个页面（有多少个就设置多少个是不是很简单！）：
     
        
    1. public class FirstCustomPageFragment extends PageFragment {
    2.  
    3. //获取布局文件的ID
    4.    @Override
    5.    protected int getLayoutResId() {
    6.       return R.layout.fragment_page_first;
    7.    }
    8.  
    10. /*为界面上的各个元素设置移动因素，包括方向和系数。一个TransformItem就是一个界面元素，其中它的第一个参数是界面元素对应的id，第二个参数是是否反向，true表示要，false表示不，第三个参数是移动系数。系数越大移动越慢，为一个界面上的不同元素设置不同的方向和系数，就能形成视差效果。**/
    11.    @Override
    12.    protected TransformItem[] provideTransformItems() {
    13.       return new TransformItem[]{
    14.             new TransformItem(R.id.ivFirstImage, true, 20),
    15.             new TransformItem(R.id.ivSecondImage, false, 6),
    16.             new TransformItem(R.id.ivThirdImage, true, 8),
    17.             new TransformItem(R.id.ivFourthImage, false, 10),
    18.             new TransformItem(R.id.ivFifthImage, false, 3),
    19.             new TransformItem(R.id.ivSixthImage, false, 9),
    20.             new TransformItem(R.id.ivSeventhImage, false, 14),
    21.             new TransformItem(R.id.ivEighthImage, false, 7)
    22.       };
    23.    }
    24. }
  • 相对应的布局文件（此处使用的是百分比布局，如果要使用该形式的布局是需要导入百分比布局的库文件的否则编译不通过：'com.android.support:percent:22.2.0'）：
     
        
    1. <?xml version="1.0" encoding="utf-8"?>
    2. <android.support.percent.PercentRelativeLayout
    3.     android:id="@+id/rootFirstPage"
    4.     xmlns:android="http://schemas.android.com/apk/res/android"
    5.     xmlns:app="http://schemas.android.com/apk/res-auto"
    6.     xmlns:tools="http://schemas.android.com/tools"
    7.     android:layout_width="match_parent"
    8.     android:layout_height="match_parent"
    9.     tools:ignore="ContentDescription"
    10.     tools:background="@android:color/holo_orange_dark">
    11.  
    12.     <ImageView
    13.         android:id="@+id/ivFirstImage"
    14.  
    15.         android:layout_width="wrap_content"
    16.         android:layout_height="wrap_content"
    17.         android:layout_centerInParent="true"
    18.  
    19.         android:src="@mipmap/s_0_1"
    20.  
    21.         app:layout_heightPercent="35%"
    22.         app:layout_widthPercent="50%"/>
    23.  
    24.     <ImageView
    25.         android:id="@+id/ivSecondImage"
    26.  
    27.         android:layout_width="wrap_content"
    28.         android:layout_height="wrap_content"
    29.         android:layout_alignParentEnd="true"
    30.         android:layout_alignParentRight="true"
    31.  
    32.         android:src="@mipmap/s_0_2"
    33.  
    34.         app:layout_heightPercent="10%"
    35.         app:layout_marginRightPercent="12%"
    36.         app:layout_marginTopPercent="27%"
    37.         app:layout_widthPercent="12%"/>
    38.  
    39.  
    40.     <ImageView
    41.         android:id="@+id/ivThirdImage"
    42.  
    43.         android:layout_width="wrap_content"
    44.         android:layout_height="wrap_content"
    45.  
    46.         android:src="@mipmap/s_0_3"
    47.  
    48.         app:layout_heightPercent="25%"
    49.         app:layout_marginLeftPercent="14%"
    50.         app:layout_marginTopPercent="49%"
    51.         app:layout_widthPercent="30%"/>
    52.  
    53.     <ImageView
    54.         android:id="@+id/ivFourthImage"
    55.  
    56.         android:layout_width="wrap_content"
    57.         android:layout_height="wrap_content"
    58.  
    59.         android:src="@mipmap/s_0_4"
    60.  
    61.         app:layout_heightPercent="15%"
    62.         app:layout_marginLeftPercent="14%"
    63.         app:layout_marginTopPercent="39%"
    64.         app:layout_widthPercent="20%"/>
    65.  
    66.     <ImageView
    67.         android:id="@+id/ivFifthImage"
    68.  
    69.         android:layout_width="wrap_content"
    70.         android:layout_height="wrap_content"
    71.         android:layout_centerHorizontal="true"
    72.  
    73.         android:src="@mipmap/s_0_5"
    74.  
    75.         app:layout_heightPercent="15%"
    76.         app:layout_marginTopPercent="22%"
    77.         app:layout_widthPercent="45%"/>
    78.  
    79.     <ImageView
    80.         android:id="@+id/ivSixthImage"
    81.  
    82.         android:layout_width="wrap_content"
    83.         android:layout_height="wrap_content"
    84.  
    85.         android:src="@mipmap/s_0_6"
    86.  
    87.         app:layout_heightPercent="6%"
    88.         app:layout_marginLeftPercent="4%"
    89.         app:layout_marginTopPercent="26%"
    90.         app:layout_widthPercent="6%"/>
    91.  
    92.     <ImageView
    93.         android:id="@+id/ivSeventhImage"
    94.  
    95.         android:layout_width="wrap_content"
    96.         android:layout_height="wrap_content"
    97.  
    98.         android:src="@mipmap/s_0_7"
    99.  
    100.         app:layout_heightPercent="8%"
    101.         app:layout_marginLeftPercent="14%"
    102.         app:layout_marginTopPercent="25%"
    103.         app:layout_widthPercent="9%"/>
    104.  
    105.     <ImageView
    106.         android:id="@+id/ivEighthImage"
    107.  
    108.         android:layout_width="wrap_content"
    109.         android:layout_height="wrap_content"
    110.  
    111.         android:src="@mipmap/s_0_8"
    112.  
    113.         app:layout_heightPercent="6%"
    114.         app:layout_marginLeftPercent="77%"
    115.         app:layout_marginTopPercent="38%"
    116.         app:layout_widthPercent="8%"/>
    117.  
    118.     <TextView
    119.         android:layout_width="wrap_content"
    120.         android:layout_height="wrap_content"
    121.         android:layout_alignParentBottom="true"
    122.         android:layout_centerHorizontal="true"
    123.  
    124.         android:gravity="center"
    125.  
    126.         android:text="@string/text_web_ceo"
    127.         android:textColor="@android:color/white"
    128.         android:textSize="@dimen/text_size_large"
    129.  
    130.         app:layout_heightPercent="15%"
    131.         app:layout_marginBottomPercent="11%"
    132.         app:layout_widthPercent="45%"/>
    133. </android.support.percent.PercentRelativeLayout>
    此时导航页面是无限循环的如果需要判断用户是否是第一次启动该软件用savedInstanceState判断一下，MainActivity 中代码较少也简单主要是用了一个replaceTutorialFragment()方法。
  • 具体代码下载地址：https://github.com/Cleveroad/SlidingTutorial-Android.git
  • 如果下载总是中间停止可以用SVN下载无需用户名及密码
  • 如转载请标明转载地址，写的不好尽情谅解！
  • 如有问题可以加我qq:2915859312联系！

这篇关于android导航页（欢迎页实现十分简单）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/322585。

相关文章

SpringBoot集成redisson实现延时队列教程

SpringBoot集成redisson实现延时队列教程

《SpringBoot集成redisson实现延时队列教程》文章介绍了使用Redisson实现延迟队列的完整步骤,包括依赖导入、Redis配置、工具类封装、业务枚举定义、执行器实现、Bean创建、消费... 目录1、先给项目导入Redisson依赖2、配置redis3、创建 RedissonConfig 配
阅读更多...
Python的Darts库实现时间序列预测

Python的Darts库实现时间序列预测

《Python的Darts库实现时间序列预测》Darts一个集统计、机器学习与深度学习模型于一体的Python时间序列预测库,本文主要介绍了Python的Darts库实现时间序列预测,感兴趣的可以了解... 目录目录一、什么是 Darts？二、安装与基本配置安装 Darts导入基础模块三、时间序列数据结构与
阅读更多...
Python使用FastAPI实现大文件分片上传与断点续传功能

Python使用FastAPI实现大文件分片上传与断点续传功能

《Python使用FastAPI实现大文件分片上传与断点续传功能》大文件直传常遇到超时、网络抖动失败、失败后只能重传的问题,分片上传+断点续传可以把大文件拆成若干小块逐个上传,并在中断后从已完成分片继... 目录一、接口设计二、服务端实现（FastAPI）2.1 运行环境2.2 目录结构建议2.3 serv
阅读更多...
C#实现千万数据秒级导入的代码

C#实现千万数据秒级导入的代码

《C#实现千万数据秒级导入的代码》在实际开发中excel导入很常见,现代社会中很容易遇到大数据处理业务,所以本文我就给大家分享一下千万数据秒级导入怎么实现,文中有详细的代码示例供大家参考,需要的朋友可... 目录前言一、数据存储二、处理逻辑优化前代码处理逻辑优化后的代码总结前言在实际开发中excel导入很
阅读更多...
SpringBoot+RustFS 实现文件切片极速上传的实例代码

SpringBoot+RustFS 实现文件切片极速上传的实例代码

《SpringBoot+RustFS实现文件切片极速上传的实例代码》本文介绍利用SpringBoot和RustFS构建高性能文件切片上传系统,实现大文件秒传、断点续传和分片上传等功能,具有一定的参考... 目录一、为什么选择 RustFS + SpringBoot？二、环境准备与部署2.1 安装 RustF
阅读更多...
Nginx部署HTTP/3的实现步骤

Nginx部署HTTP/3的实现步骤

《Nginx部署HTTP/3的实现步骤》本文介绍了在Nginx中部署HTTP/3的详细步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录前提条件第一步：安装必要的依赖库第二步：获取并构建 BoringSSL第三步：获取 Nginx
阅读更多...
MyBatis Plus实现时间字段自动填充的完整方案

MyBatis Plus实现时间字段自动填充的完整方案

《MyBatisPlus实现时间字段自动填充的完整方案》在日常开发中,我们经常需要记录数据的创建时间和更新时间,传统的做法是在每次插入或更新操作时手动设置这些时间字段,这种方式不仅繁琐,还容易遗漏,... 目录前言解决目标技术栈实现步骤1. 实体类注解配置2. 创建元数据处理器3. 服务层代码优化填充机制详
阅读更多...
Python实现Excel批量样式修改器(附完整代码)

Python实现Excel批量样式修改器(附完整代码)

《Python实现Excel批量样式修改器(附完整代码)》这篇文章主要为大家详细介绍了如何使用Python实现一个Excel批量样式修改器,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一... 目录前言功能特性核心功能界面特性系统要求安装说明使用指南基本操作流程高级功能技术实现核心技术栈关键函
阅读更多...
Java实现字节字符转bcd编码

Java实现字节字符转bcd编码

《Java实现字节字符转bcd编码》BCD是一种将十进制数字编码为二进制的表示方式,常用于数字显示和存储,本文将介绍如何在Java中实现字节字符转BCD码的过程,需要的小伙伴可以了解下... 目录前言BCD码是什么Java实现字节转bcd编码方法补充总结前言BCD码（Binary-Coded Decima
阅读更多...
SpringBoot全局域名替换的实现

SpringBoot全局域名替换的实现

《SpringBoot全局域名替换的实现》本文主要介绍了SpringBoot全局域名替换的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一... 目录 项目结构⚙️ 配置文件application.yml️ 配置类AppProperties.Ja
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2