700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > android的颜色渐变动画效果图 Android简单实现一个颜色渐变的ProgressBar

android的颜色渐变动画效果图 Android简单实现一个颜色渐变的ProgressBar

时间:2021-06-27 18:50:57

相关推荐

android的颜色渐变动画效果图 Android简单实现一个颜色渐变的ProgressBar

今天看一个教程,看到一个颜色渐变的ProgressBar,觉得有点意思,所以记录一番。

下面这个是效果图

颜色渐变的ProgressBar

看到效果图可能会给人一种使用了高端技术的感觉,其实这个没有那么高深,我们只是简单改变了ProgressBar的样式即可实现,下面说说实现方式。

首先我们简单分析一下:

1 . 上面的样式只是实现了颜色渐变,但它旋转和呈现的方式仍然是一个圆形的ProgressBar。

2 . 这个ProgressBar实现了颜色渐变,我们就需要用到gradient,这个也比较简单,只要我们配置开始,中间,结束颜色即可实现

明白了上面两点我们就开始写代码。

首先,我们实现上面的布局,背景灰色,一个ProgressBar居中,一个TextView位于ProgressBar下方。

代码如下:

xmlns:android="/apk/res/android"

xmlns:app="/apk/res-auto"

xmlns:tools="/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="/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,是不是超级简单,希望可以帮助到需要的人。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。