码迷,mamicode.com
首页 > 移动开发 > 详细

Android简易实战教程--第十七话《自定义彩色环形进度条》

时间:2016-08-14 13:12:18      阅读:173      评论:0      收藏:0      [点我收藏+]

标签:

转载请注明出处:http://blog.csdn.net/qq_32059827/article/details/52203533   点击打开链接

在Android初级教程里面,介绍了shape用法的理论知识,再来完成这个小案例将会变得非常简单哦。(欢迎学习阅读):http://blog.csdn.net/qq_32059827/article/details/52203347 点击打开链接

这一篇就针对这个知识点,完成一个自定义的彩色进度条。系统自带的环形进度条是黑白相间的,如果你不是色盲,肯定觉得那个进度条其丑无比!就有必要设计一下它的状态,让我们给她点”颜色”看看。

首先看一下要设计的进度条长什么样子,动态截图如下:

技术分享

接下来就一步步的完成这个效果。

还是老样子,在drawable目录下建一个shape类型的文件。里面代码如下:

在style里面加入如下代码:

<style name="ProgressBar">
        <item name="android:indeterminateOnly">true</item>
        <item name="android:indeterminateDrawable">@drawable/progressstyleshape</item>
        <item name="android:indeterminateBehavior">repeat</item>
        <item name="android:indeterminateDuration">3500</item>
        <item name="android:minWidth">60dip</item>
        <item name="android:maxWidth">60dip</item>
        <item name="android:minHeight">60dip</item>
        <item name="android:maxHeight">60dip</item>
        <item name="android:mirrorForRtl">false</item>
    </style>
在style里面引入了shape,drawable/progressstyleshape.xml文件里面的代码如下:

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toDegrees="360" >

    <!--
    封装一个动画
    0~360°旋转、锚点位于中心
    -->
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadiusRatio="3"
        android:shape="ring"
        android:thicknessRatio="10"
        android:useLevel="false" >
        <gradient
            android:endColor="#0000ff"
            android:startColor="#ff0000"
            android:type="sweep" />
        <!--
    android:shape="ring"系统默认矩形,这里修改为环形 
    android:innerRadiusRatio=""表示内半径比:半径/比值,这个值越大,环形的外环越细
	 android:thicknessRatio="10"表示厚度比
	android:useLevel="false"表示让进度条环形不切分,完全显示
	 gradint表示颜色的渐变
	android:type="sweep" 表示扫射的效果

        -->

    </shape>

</rotate>

然后再布局文件里面引入样式:

<RelativeLayout 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"
    tools:context=".MainActivity" >

    <ProgressBar
        android:layout_centerInParent="true"
        style="@style/ProgressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</RelativeLayout>

运行程序截图:

技术分享


Android简易实战教程--第十七话《自定义彩色环形进度条》

标签:

原文地址:http://blog.csdn.net/qq_32059827/article/details/52203533

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!