在ViewPager下面加圆点指示(使用selector方式)

    前面讲了如何使用ViewPager来做多个可滑动的页面。今天在页面的下面加上一排小圆点,用于指示当前在第几页。效果如下(请忽略颜色和图案):

一、产生一个小圆点的视图

1、在drawable下产生一个选中和不选中颜色不同的小圆点形状(shape):dot.xml。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_selected="true"><shape android:shape="oval"><solid android:color="@color/purple_200" /><corners android:radius="8dp" /></shape></item><item android:state_selected="false"><shape android:shape="oval"><solid android:color="@color/white" /><corners android:radius="8dp" /></shape></item>
</selector>

2、产生合适大小的小圆点视图ImageView:dot_view.xml

<?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:padding="5dp"><ImageViewandroid:id="@+id/v_dot"android:layout_width="10dp"android:layout_height="10dp"android:src="@drawable/dot"/></LinearLayout>

二、修改主视图,在ViewPager下面加入一个线性视图

    为了能在背景图上显示小圆点,我们用一个RelativeLayout来将ViewPager和一个LinearLayout放在一起,LinearLayout放在中央+下方。

    这个LinearLayout就是我们准备用于放置一排小圆点的容器。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"><RelativeLayoutandroid:layout_width="match_parent"android:layout_height="100dp"android:background="#FFFFFF"android:orientation="vertical"><androidx.viewpager.widget.ViewPagerandroid:id="@+id/viewpager"android:layout_width="match_parent"android:layout_height="wrap_content" /><LinearLayoutandroid:id="@+id/dots_container"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:gravity="center"android:orientation="horizontal" /></RelativeLayout></LinearLayout>

三、动态选中小圆点(选中变色)

1、定义一个变量记录滑动前是第几页

2、动态生成一排小圆点,并选中第一个

3、设置PageChange事件监听器,当滑动页面时选中新的小圆点

public class MainActivity extends AppCompatActivity {// 记录滑动前是第几页private int currentIndex = 0;// 定义引导页图片数组private int[] imageArray = {R.drawable.yingdao1, R.drawable.yingdao2,R.drawable.yingdao3, R.drawable.yingdao4};@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);ViewPager viewPager = findViewById(R.id.viewpager);MyPagerAdapter adapter = new MyPagerAdapter(this, imageArray);viewPager.setAdapter(adapter);// 动态生成小圆点LinearLayout linearLayoutDots = findViewById(R.id.dots_container);for (int i = 0; i < imageArray.length; i++) {linearLayoutDots.addView(LayoutInflater.from(this).inflate(R.layout.dot_view, null));}// 选中第一页linearLayoutDots.getChildAt(0).setSelected(true);// 添加PageChange监听器viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {@Overridepublic void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}@Overridepublic void onPageSelected(int position) {linearLayoutDots.getChildAt(currentIndex).setSelected(false);linearLayoutDots.getChildAt(position).setSelected(true);currentIndex = position;}@Overridepublic void onPageScrollStateChanged(int state) {}});}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/228323.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

1- Electron 创建项目、初始化项目

Electron官网 Build cross-platform desktop apps with JavaScript, HTML, and CSS | Electron Electron 初始化 初始化项目 - 构造package.json npm init -y 安装Electron模块包 npm i electron -D // 注意&#xff01;如果报错查看node包是否太高 配置启动脚本 {&quo…

SQL、Jdbc、JdbcTemplate、Mybatics

数据库&#xff1a;查询&#xff08;show、select&#xff09;、创建&#xff08;create)、使用(use)、删除(drop)数据库 表&#xff1a;创建&#xff08;【字段】约束、数据类型&#xff09;、查询、修改&#xff08;alter *add&#xff09;、删除 DML&#xff1a;增加(inse…

MySql的增、删、改、查(MySql数据库学习——五)

增&#xff08;数据添加/插入数据&#xff09; 使用 INSERT INTO SQL 语句来插入数据。我们可以通过 mysql> 命令提示窗口中向数据表中插入数据&#xff0c;或者 通过PHP 脚本来插入数据。 sql语句&#xff1a; INSERT INTO table_name ( field1, field2,...fieldN ) …

AC843. n皇后问题--60

我们只需要把蓝色的往上移动就行了 if(!col[i][j]&&!dg[ui]&&!udg[])//1y&#xff08;i&#xff09;向下&#xff0c;x&#xff08;u&#xff09;向右为正。yxb的by-x一定>0,y-xb的bxy可能>0,这个不考虑&#xff0c;只看-bxy. 为什么for里面只有一个if呢…

操作系统期末复习-内存管理

一、内存管理 分页存储管理&#xff0c;是将一个进程的逻辑地址空间分成若干个大小相等的片&#xff0c;称为页面或页&#xff0c;并为各页加以编号&#xff0c;从0开始&#xff0c;如第0页、第1页等。相应地&#xff0c;也把内存空间分成与页面相同大小的若干个存储块&#xf…

QT最大线程并发

声明一个处理函数;int timeTask(); 头文件&#xff1a; #include <QtConcurrent> #include <QFuture> 并发处理改函数的任务&#xff0c;直到处理完成&#xff1a; QFuture<int> ft QtConcurrent::run(this, &ch72_concurrent::timeTask);while (!f…

Vue学习计划-Vue2--VueCLi(八)vuex统一状态管理实现数据共享

1. vuex是什么 概念&#xff1a;专门在Vue中实现集中式状态&#xff08;数据&#xff09;管理的一个Vue插件&#xff0c;对Vue应用中多个组件的共享状态进行集中式的管理&#xff08;读/写&#xff09;&#xff0c;也是一种组件间通信的方式&#xff0c;且适用于任意组件间通信…

【Unity入门】物体5种移动方法

目录 一、通过修改位置来实现移动二、通过物理系统实现位移三、通过CharacterController组件四、通过输入控制物体移动 一、通过修改位置来实现移动 利用修改Transform组件的position的两种常用方法。 使用Translate&#xff08;&#xff09;函数 /*物体将向x方向移动1.5单位…

18、vue3(十八):菜单权限,按钮权限,打包,发布nginx

目录 一、菜单权限和路由拆分 1.思路分析 2.深拷贝插件 3.代码实现 4.效果展示

Javascript 嵌套函数 - 递归函数 - 内置函数详解

Javascript 嵌套函数 - 递归函数 - 内置函数详解 目录 Javascript 嵌套函数 - 递归函数 - 内置函数详解 一、嵌套函数 二、递归函数 三、内置函数 在了解了函数的定义和函数调用外&#xff0c;下面我们来介绍一下JavaScript中几种特殊的函数。 JavaScript特殊函数有3种&a…

AVL树-详细解析【数据结构】

AVL树是首个被发明的自平衡二叉查找树&#xff0c;在1962年由两位苏联科学家G.M. Adelson-Velsky和E.M. Landis提出。AVL树得名于发明者的首字母。在AVL树中&#xff0c;任何节点的两个子树的高度最大差别为一&#xff0c;确保了树的平衡度&#xff0c;使得查找操作相比于普通的…

JavaScript数组分组groupBy

JavaScript 最近发布了一个方法 Object.groupBy&#xff0c;可以对可迭代对象中的元素进行分组。 语法&#xff1a; Object.groupBy(items, callbackFn)items 被分组的可迭代对象&#xff0c;如 Array。 callbackFn 对可迭代对象中的每个元素执行的函数。 举个例子&#…

173.【2023年华为OD机试真题(C卷)】用连续自然数之和来表达整数(双指针法实现JavaPythonC++JS)

🚀你的旅程将在这里启航!本专栏所有题目均包含优质解题思路,高质量解题代码,详细代码讲解,助你深入学习,深度掌握! 文章目录 【华为OD机试AB必刷题目】题目描述解题思路题解代码Python题解代码JAVA题解代码C/C++题解代码JS题解代码代码OJ评判结果代码讲解Python题解代码…

【Qt QML 入门】TextEdit

TextEdit可以显示多行可编辑的格式化文。默认是无边框的&#xff0c;可以和父控件完美融合。 import QtQuick import QtQuick.Window import QtQuick.ControlsWindow {id: winwidth: 800height: 600visible: trueTextEdit {id: textEditanchors.centerIn: parenttext: "He…

并发编程中常见的设计模式

文章目录 一、 终止线程的设计模式1. 简介2. Tow-phase Termination&#xff08;两阶段终止模式&#xff09;—优雅的停止线程 二、避免共享的设计模式1. 简介2. Immutability模式—想破坏也破坏不了3. Copy-on-Write模式4. Thread-Specific Storage模式—没有共享就没有伤害 三…

Python之构造函数

参考&#xff1a; Python之构造函数_构造函数 python-CSDN博客 构造函数的特点&#xff1a; 创建对象&#xff1b;给对象的成员变量赋值 构造函数和成员函数之间的区别&#xff1a; 成员函数需要被手动调用&#xff0c;但是&#xff0c;构造函数在创建对象的过程中是自动被…

八大排序——快速排序(霍尔 | 挖空 | 前后指针 | 非递归)

我们今天来讲讲八大排序中的快速排序&#xff0c;快速排序最明显的特点就是排序快&#xff0c;时间复杂度是O&#xff08;N* logN&#xff09;&#xff0c;但是坏处就是如果排序的是一个逆序的数组的时候&#xff0c;时间复杂度是O&#xff08;N^2&#xff09;,还不用我们的插入…

被带偏的中国云计算,重归正途

文 | 智能相对论 作者 | 叶远风 阿里云战略聚焦公共云&#xff0c;对整个云计算市场而言都是一场自我审视。 从市场背景、行业发展、中外对比等多个方面&#xff0c;业界舆论给出了大量详实的数据分析&#xff0c;已经对阿里云为什么要聚焦公共云有了结论&#xff0c;这里不…

会 C# 应该怎么学习 C++?

会 C# 应该怎么学习 C&#xff1f; 在开始前我有一些资料&#xff0c;是我根据自己从业十年经验&#xff0c;熬夜搞了几个通宵&#xff0c;精心整理了一份「C的资料从专业入门到高级教程工具包」&#xff0c;点个关注&#xff0c;全部无偿共享给大家&#xff01;&#xff01;&a…

Vue3源码梳理:响应式系统的前世今生

响应性数据的前世 js的程序性: 一套固定的&#xff0c;不会发生变化的执行流程 1 &#xff09;没有响应的数据 // 定义商品对象 const product {price: 10,quantity: 2 }// 总价格 let total product.price * product.quantity console.log(总价格&#xff1a;${total}) //…