文档章节

自定义ProgressBar(长)

lsy999
 lsy999
发布于 2017/04/26 20:39
字数 764
阅读 11
收藏 0

首先在布局上

<RelativeLayout
    android:layout_below="@id/just_used_to_locate_04"
    android:layout_marginLeft="16.0dip"
    android:layout_marginRight="16.0dip"
    android:layout_marginTop="5dp"
    android:layout_toRightOf="@+id/cim_xinix"
    android:layout_width="wrap_content"
    android:layout_height="30dp">
    <ProgressBar
        android:id="@+id/gradient_progress"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
        android:progress="60"
        android:progressDrawable="@drawable/my_xinxi_progress"
        android:indeterminateDuration="10"
        />

    <ImageView
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:background="@drawable/redbag_img_minitree"
        android:layout_centerVertical="true"
        android:layout_marginLeft="10dp"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="6/10"
        android:textColor="#ffffff"
        />
</RelativeLayout>

在drawable下布局两个

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="20dp" />
            <stroke
                android:width="2dp"
                android:color="#ffffff" />
            <gradient
                android:angle="270"
                android:centerColor="#C55C18"
                android:centerY="0.75"
                android:endColor="#C55C18"
                android:startColor="#C55C18" />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="20dp" />
                <stroke
                    android:width="2dp"
                    android:color="#ffffff" />
                <gradient
                    android:angle="270"
                    android:centerColor="#80ffb600"
                    android:centerY="0.75"
                    android:endColor="#a0ffcb00"
                    android:startColor="#80ffd300" />
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">
        <clip>

            <scale android:scaleWidth="100%"
                android:drawable="@drawable/progressview_xinxi"   />
        </clip>
    </item>

</layer-list>
效果图如上
progressview_xinxi.xml
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle"
  xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="20dp"/>
    <stroke
        android:width="2dp"
        android:color="#00000000" />
    <stroke
        android:width="4dp"/>
    <solid android:color="#00000000"/>
    <solid android:color="#F55c18"/>
    <gradient
        android:angle="0"
        android:centerY="0.75"
        android:endColor="#ff3e24"
        android:startColor="#ffcf23"/>

</shape>

然后在mainActivity里面加上一句

ProgressBar gradient_progress = (ProgressBar) findViewById(R.id.gradient_progress);
ObjectAnimator
        .ofInt(gradient_progress, "progress", 0, 60)
        .setDuration(500)
        .start();

就这样 这个动态的长形出来了。

shape的定义

android:shape=["rectangle"|"oval"|"line"|"ring"]

shape的 形状,默认为矩形,可以设置为矩形(rectangle), 、椭圆形(oval)、线性形状(line)、环形(ring)

下面的属性只有在android:shape=”ring时可用:
android:innerRadius 尺寸,内环的半径。
android:innerRadiusRatio 浮点型,以环的宽度比率来表示内环的半径,

  • solid
    实心,填充的意思
    android:color指定填充的颜色

  • gradient
    渐变
    android:startColor 开始的颜色
    android:endColor 渐变结束的颜色
    android:angle 渐变角度,必须为45的整数倍,当angle=0时,渐变色是从左向右。 然后逆时针方向转,当angle=90时为从下往上
    android:type=”linear”,即线性渐变,可以指定渐变为径向渐变,android:type=”radial”,径向渐变需要指定半径android:gradientRadius=”50”

  • stroke
    描边缘
    android:width=”2dp” 描边的宽度
    android:color 描边的颜色
    我们还可以把描边弄成虚线的形式,设置方式为:android:dashWidth=”5dp” android:dashGap=”3dp”
    其中android:dashWidth表示’-‘这样一个横线的宽度,android:dashGap表示之间隔开的距离。

  • corners
    拐角,radius属性为半径,android:radius为角的弧度,值越大角越圆。

  • padding:间隔

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <gradient
                android:startColor="#ff8c00"
                android:endColor="#ff8c00"
                android:angle="270"/>
            <stroke
                android:width="0dp"
                android:color="#dcdcdc">
            </stroke>
            <corners
                android:radius="10dp">
            </corners>
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp"></padding>
        </shape>
    </item>
    <item android:state_focused="true">
        <shape>
            <gradient
                android:startColor="#ffc2b7"
                android:endColor="#ffc2b7"
                android:angle="270">
            </gradient>
            <stroke
                android:width="0dp"
                android:color="#dcdcdc">
            </stroke>
            <corners
                android:radius="10dp">
            </corners>
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp">
            </padding>
        </shape>
    </item>
    <item>
        <shape>
            <gradient
                android:startColor="#ff9677"
                android:endColor="#ff9d77"
                android:angle="270">
            </gradient>
            <stroke
                android:width="0dp"
                android:color="#fad3cf">
            </stroke>
            <corners
                android:radius="10dp">
            </corners>
            <padding
                android:left="10dp"
                android:right="10dp"
                android:top="10dp"
                android:bottom="10dp">
            </padding>
        </shape>
    </item>
</selector>

© 著作权归作者所有

共有 人打赏支持
lsy999
粉丝 0
博文 96
码字总数 26024
作品 0
程序员
私信 提问
自定义之progressbar(图片实现)

自定义Progressbar: 1.自选一张图片 2.在drawable下创建一个rotate相关xml文件 3.自定义一个Style , 在控件Progressbar上引入自定义的style , 指定转动速度 在drawable文件下的 rotateprog...

新根
2015/09/25
1K
0
Android Progressbar

各种类型的Android进度条:CircleProgress: http://www.open-open.com/lib/view/open1415936845930.html#label0 自定义圆形的ProgressBar: http://www.cnblogs.com/xingfuzzhd/archive/2013......

当空皓月
2015/04/20
0
0
Android 两种自定义ProgressBar

横向的ProgressBar 在res下创建drawable文件夹,新建文件drawable/progressbar_color.xml <?xml version="1.0" encoding="utf-8"?><layer-list xmlns:android="http://schemas.android.com/......

yaly
2015/05/05
0
0
Android实用笔记——使用ProgressBar实现进度条

1、ProgressBar的分类 可以精确显示进度(可以显示刻度或者精确百分比) 不可以精确显示精度(一直转,类似于一个过场动画) 2、关键属性和方法 指定ProgressBar显示风格 style="?android:at...

落叶-归根
2016/07/27
248
0
ProgressBar使用 (自定义背景颜色,控制进度)

Progressbar的Progress和Background颜色可以通过自定义Drawable的形式来实现. 需要注意三个点: item属性对象的id,background对应"android:background",progress对应"android:progress". sha......

fantasiter
2016/06/06
278
0

没有更多内容

加载失败,请刷新页面

加载更多

Cookie 显示用户上次访问的时间

import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.Cookie;import javax.servlet.http.HttpServlet;import javax.serv......

gwl_
今天
1
0
网络编程

第14天 网络编程 今日内容介绍  网络通信协议  UDP通信  TCP通信 今日学习目标  能够辨别UDP和TCP协议特点  能够说出UDP协议下两个常用类名称  能够说出TCP协议下两个常用类名称...

stars永恒
今天
1
0
二进制相关

二进制 众所周知计算机使用的是二进制,数字的二进制是如何表示的呢? 实际就是逢二进一。比如 2 用二进制就是 10。那么根据此可以推算出 5的二进制等于 10*10+1 即为 101。 在计算机中,负数以...

NotFound403
昨天
3
0
day22:

1、写一个getinterface.sh 脚本可以接受选项[i,I],完成下面任务: 1)使用格式:getinterface.sh [-i interface | -I ip] 2)当用户使用-i选项时,显示指定网卡的IP地址;当用户使用-I选项...

芬野de博客
昨天
2
0
Spring Cloud Alibaba基础教程:使用Nacos实现服务注册与发现

自Spring Cloud Alibaba发布第一个Release以来,就备受国内开发者的高度关注。虽然Spring Cloud Alibaba还没能纳入Spring Cloud的主版本管理中,但是凭借阿里中间件团队的背景,还是得到不少...

程序猿DD
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部