zoukankan      html  css  js  c++  java
  • Android GradientDrawable的XML实现

    

    Android GradientDrawable的XML实现

    Android GradientDrawable与附录文章1类似,这次以XML而非Java代码形式实现。比如写好一个shape文件放在res/drawable目录下,名字比如可以命名为gradient.xml。
    然后在上层Java代码里面就可以使用这个shape文件,比如是一个ImageView文件,把这个shape文件加载:

    ImageView image= (ImageView) findViewById(R.id.imageView);
    image.setImageDrawable(getResources().getDrawable(R.drawable.gradient));

    下面是GradientDrawable以不同xml代码实现的不同结果。

    (一)线性渐变的GradientDrawable。

    shape代码:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <gradient
            android:angle="45"
            android:centerColor="@android:color/holo_orange_dark"
            android:endColor="@android:color/holo_blue_dark"
            android:startColor="@android:color/holo_red_dark" />
    
        <stroke
            android:width="20dip"
            android:color="@android:color/black"
            android:dashGap="2dip"
            android:dashWidth="10dip" />
    </shape>

    结果:


    没有dash间断分割的xml代码:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval">
    
        <gradient
            android:angle="135"
            android:centerColor="@android:color/holo_orange_dark"
            android:endColor="@android:color/holo_blue_dark"
            android:startColor="@android:color/holo_red_dark" />
    
        <stroke
            android:width="20dip"
            android:color="@android:color/black" />
    </shape>

    结果:



    以上是GradientDrawable的线性渐变。


    (二)ring环形的GradientDrawable。

    设定Android shape=ring,制作一个圆环。如代码:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="ring"
        android:thickness="20dp"
        android:useLevel="false">
    
        <gradient
            android:angle="90"
            android:centerColor="@android:color/holo_orange_dark"
            android:endColor="@android:color/holo_blue_dark"
            android:startColor="@android:color/holo_red_dark" />
    
    </shape>

    结果:


    这句代码:

    android:thickness="20dp"

    圆环的厚度。



    给圆环描边(假设是5dp):

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="ring"
        android:thickness="30dp"
        android:useLevel="false">
    
        <gradient
            android:angle="90"
            android:centerColor="@android:color/holo_orange_dark"
            android:endColor="@android:color/holo_blue_dark"
            android:startColor="@android:color/holo_red_dark" />
    
        <stroke android:width="5dp"
            android:color="@android:color/black" />
    
    </shape>

    结果:



    (三)渐变矩形。

    代码:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
    
        <gradient
            android:angle="90"
            android:endColor="@android:color/holo_green_light"
            android:startColor="@android:color/transparent" />
    
    </shape>

    结果:


    (四)渐变线。

    用andriod的shape直接设置属性为line即可画一个实现,同时设定size的高度值为1px或者1dp,这很简单就实现了。但是如果要画一个渐变的线,直接使用line就复杂难办了。解决这个问题可以转化一下,我们画一个矩形,但是这个矩形的高度只有1px或1dip,这样就把一个矩形变矮成一条线,矩形的渐变很容易实现。比如实现一个从两边到中间逐渐变黑的高度仅仅为1px的线条,那么可以画一个矩形,设置这个矩形的开始、中间、结束渐变颜色值,同时设定它的高度值是1px,从而就实现了一个渐变线,代码例子:

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="rectangle">
    
        <gradient
            android:angle="0"
            android:centerColor="@android:color/black"
            android:endColor="@android:color/transparent"
            android:startColor="@android:color/transparent" />
    
        <size android:height="1px" />
    
    </shape>

    结果:




    附录:
    1,《Android渲染器Shader:LinearGradient(一)》链接:http://blog.csdn.net/zhangphil/article/details/52004027
    2,《Android渲染器Shader:梯度渐变扫描渲染器SweepGradient(二)》链接:http://blog.csdn.net/zhangphil/article/details/52021677
    3,《Android渲染器Shader:环状放射渐变渲染器RadialGradient(三)》链接:http://blog.csdn.net/zhangphil/article/details/52023723
    4,《Android ShapeDrawable之OvalShape、RectShape、PaintDrawable、ArcShape》链接:http://blog.csdn.net/zhangphil/article/details/52025152
    5,《Android View加载圆形图片且同时绘制圆形图片的外部边缘边线及边框:LayerDrawable实现》链接:http://blog.csdn.net/zhangphil/article/details/52035255

  • 相关阅读:
    【算法学习笔记】27.动态规划 解题报告 SJTU OJ 1254 传手绢
    【算法学习笔记】26.扫描维护法 解题报告 SJTU OJ 1133 数星星
    【算法学习笔记】25.贪心法 均分纸牌问题的分析
    【算法学习笔记】24.记忆化搜索 解题报告 SJTU OJ 1002 二哥种花生
    【算法学习笔记】23.动态规划 解题报告 SJTU OJ 1280 整装待发
    【算法学习笔记】22.算法设计初步 二分查找 上下界判断
    【算法学习笔记】21.算法设计初步 求第k个数 划分法 快排法
    【算法学习笔记】20.算法设计初步 归并排序 求逆序数
    【算法学习笔记】19.算法设计初步 最大子列和问题的几种方法
    【算法学习笔记】18.暴力求解法06 隐式图搜索2 八数码问题 未启发
  • 原文地址:https://www.cnblogs.com/hehehaha/p/6147273.html
Copyright © 2011-2022 走看看