android的颜色渐变动画效果图,Android简单实现一个颜色渐变的ProgressBar
今天看一个教程,看到一个颜色渐变的ProgressBar,觉得有点意思,所以记录一番。
下面这个是效果图
颜色渐变的ProgressBar
看到效果图可能会给人一种使用了高端技术的感觉,其实这个没有那么高深,我们只是简单改变了ProgressBar的样式即可实现,下面说说实现方式。
首先我们简单分析一下:
1 . 上面的样式只是实现了颜色渐变,但它旋转和呈现的方式仍然是一个圆形的ProgressBar。
2 . 这个ProgressBar实现了颜色渐变,我们就需要用到gradient,这个也比较简单,只要我们配置开始,中间,结束颜色即可实现
明白了上面两点我们就开始写代码。
首先,我们实现上面的布局,背景灰色,一个ProgressBar居中,一个TextView位于ProgressBar下方。
代码如下:
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="cn.codekong.androidloading.MainActivity">
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#de262a3b">
android:id="@+id/loading"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_centerInParent="true"
android:indeterminate="false"/>
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/loading"
android:text="加载中"
android:textColor="#ffffff"
android:textSize="20sp"
android:layout_centerHorizontal="true"/>
上面其他代码都很好理解,只有ProgressBar有一个 indeterminate 属相需要解释一下:
一般的ProgressBar都是用于显示加载进度,如果我们直到当前的具体进度,那个这个属性要设置为true,并设置正确的进度,如果我们也不知道正确的进度,则设置为false。
布局设置好了,下一步就是设置ProgressBar的渐变样式,这里我们需要自定义一个Drawable。
自定义的Drawable代码如下:
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="1080.0">
android:shape="ring"
android:thicknessRatio="10"
android:useLevel="false">
android:centerY="0.50"
android:endColor="#CE0000"
android:startColor="#FFFFFF"
android:type="sweep"/>
下面解释一下上面的代码:
外层的 rotate 表明这是一个旋转的动画,并且该规定了开始角度和结束角度,还有旋转中心为圆心
内层的shape定义了形状为一个环(ring),其中有三个属性:
<1> innerRadiusRatio 为外环半径和内径的比值,比如外环半径为30,内环半径为10,则比值为3
<2> thicknessRatio 为外环半径与环的厚度的比值
<3> useLevel 如果为true,则可以在LevelListDrawable中使用
接下来的 gradient 定义了渐变效果,规定了开始结束的颜色,还规定渐变方式为扫描渐变
最后一步,我们通过一个ProgressBar的属性给他设置我们上面定义的样式:
android:indeterminateDrawable="@drawable/loading_drawable"
经过上面的步骤我们就实现了一个简单的渐变的ProgressBar,是不是超级简单,希望可以帮助到需要的人。
android的颜色渐变动画效果图,Android简单实现一个颜色渐变的ProgressBar相关推荐
- android的颜色渐变动画效果图,android – 渐变色动画
我想要实现的目标: 径向渐变,开始和结束颜色随着时间的推移从一种定义的颜色到另一种颜色的平滑变化. 到目前为止我尝试过的: 像这样使用ObjectAnimator: searchAnimator = ...
- android 颜色过渡动画效果,Android buttom textview 颜色平滑过渡的动画效果
1.TransitionDrawable.例如,在文件夹中绘制一个xml文件,你可以这样写: 然后,在你的xml的实际检视你都引用这个TransitionDrawable在android:backgr ...
- android 360动画效果图,Android实现360手机助手底部的动画菜单
首先来看下我们实现的效果和360效果的对比: 360手机助手效果演示 本库实现的效果(Icon来自360手机助手,侵删) xml布局文件 注:为了美观,讲每个Button的高度以及固定,设置wrap_ ...
- android 破碎酷炫动画,【Android效果集】学习ExplosionField之粒子破碎效果
编辑推荐:稀土掘金,这是一个针对技术开发者的一个应用,你可以在掘金上获取最新最优质的技术干货,不仅仅是Android知识.前端.后端以至于产品和设计都有涉猎,想成为全栈工程师的朋友不要错过! 前段时间 ...
- android 加载更多动画效果,Android实践之带加载效果的下拉刷新上拉加载更多
前言 之前写的一个LoadingBar,这次把LoadingBar加到下拉刷新的头部.从头写一个下拉刷新,附赠上拉加载更多.下面话不多说了,来一起看看详细的介绍吧. 效果图: 实现过程 首先是自定义属 ...
- android 点击图片动画效果,Android仿微信图片点击全屏效果
废话不多说,先看下Android图片点击全屏效果: 先是微信的 再是模仿的 先说下实现原理,再一步步分析 这里总共有2个Activity一个就是主页,一个就是显示我们图片效果的页面,参数通过Inten ...
- html5 渐变动画效果图,html5+css3城市场景动画_觉唯设计
最近一直在研究HTML5的动画表现,特别是在移动设备上的呈现.在上一篇文章<盛开的CSS3梦幻荷花>中提到如何用css3制作丰富动画效果的两个思路,当然除此之外,结合使用javascrip ...
- android 张口逐帧动画,《Android 动画》逐帧动画
关于 Android 的动画学习可以分为以下几个大类: 逐帧动画 补间动画(也说 View 动画) 属性动画 转场动画 这里注意,我只是从学习的角度分为了这四类:从面试的角度,只需要说前面三类,转场动 ...
- 电子脑PHP动画制作,PS简单制作一个动态的字体动画
这篇教程是向PHP中文网的朋友分享PS简单制作一个动态的字体动画方法,教程制作出来的字体动画非常漂亮,难度不是很大,来看看吧 动态的文字比静态的文字更加吸引人的目光.如果在平时的海报中,在平时的促销活 ...
最新文章
- linux下卸载自带jdk,重新安装jre运行环境
- 【Qt】pro中使用DEFINES来实现条件编译
- HDU 1754 I Hate It
- c++心得之struct和class(结构体和类)
- DNS术语,组件和概念介绍
- 无法定位程序输入点 except_软件测试中的功能测试点(三)
- 脉脉就APP整改下架一事致歉:正积极排查 将尽快完成整改
- 配置kerberos_Step by Step 实现基于 Cloudera 5.8.2 的企业级安全大数据平台 Kerberos的整合...
- 各型号交换机端口镜像配置方法和命令
- 网页打开摄像头_只要5分钟,快速掌握摄像头课件直播技巧
- 如何清空其他终端上的屏幕
- matlab中的语言,matlab语言学习MATLAB语言基础.pdf
- php 类 抽象方法,「php抽象类和抽象方法」- 海风纷飞Blog
- 纸机器人的折法_手工折纸教程:一分钟教你折出战斗机器人,看完手里痒痒的...
- 「易见股份」暴涨背后:炒区块链概念半年赚2亿
- 情人节有哪些礼物可以送给男朋友的,情人节送礼推荐
- 五招教你做好企业年终绩效考核,太实用了!
- linux挂载移动硬盘乱码
- Matlab修改字体方法,解决中文乱码问题
- 一文了解Python流程控制
热门文章
- 微信公众账号 token 验证失败 解决办法
- Java I/O NIO学习
- Silverlight4Beta之与剪切板通信
- java基础—IO流——复制一个文件到当前文件夹中
- [Vue warn]: Property or method id is not defined on the instance but referenced during render.
- CF#574E. OpenStreetMap 题解
- 爬虫之操作excel
- Django:新手入门学习资料汇总
- sftp方式从windows上传文件到Linux服务器
- 十九、动态加载脚本和样式