Android Shape学习

在Android开发中,使用shape可以很方便的帮我们画出我们想要的背景,相对于png等图片来说,使用shape可以减少安装包大小,而且能够更好的适配不同的手机;

Shape属性 官网

下面是官网的示范

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape=["rectangle" | "oval" | "line" | "ring"] >
    <corners
        android:radius="integer"
        android:topLeftRadius="integer"
        android:topRightRadius="integer"
        android:bottomLeftRadius="integer"
        android:bottomRightRadius="integer" />
    <gradient
        android:angle="integer"
        android:centerX="float"
        android:centerY="float"
        android:centerColor="integer"
        android:endColor="color"
        android:gradientRadius="integer"
        android:startColor="color"
        android:type=["linear" | "radial" | "sweep"]
        android:useLevel=["true" | "false"] />
    <padding
        android:left="integer"
        android:top="integer"
        android:right="integer"
        android:bottom="integer" />
    <size
        android:width="integer"
        android:height="integer" />
    <solid
        android:color="color" />
    <stroke
        android:width="integer"
        android:color="color"
        android:dashWidth="integer"
        android:dashGap="integer" />
</shape> 

<shape> 形状可绘制对象,这必须是根元素
xmlns:android="http://schemas.android.com/apk/res/android" ---->定义XML的命名空间
android:shape ---> 定义形状的类型,其有效值是:

描述 效果
android:shape="rectangle" 填充包含视图的矩形,这也是默认形状
android:shape="oval" 适应包含视图尺寸的椭圆形状,定义宽高后可称为圆形
android:shape="line" 跨越包含视图宽度的水平线。此形状需要<stroke>元素定义线宽,虚线和实线
android:shape="ring" 环形

注意:仅当 android:shape="ring" 时才能使用以下属性:
    1. android:innerRadius ---->尺寸,环内部(中间的孔)的半径
    2.android:innerRadiusRatio ---> 浮点型,环的厚度,以环宽度的比例表示。如android:innerRadiusRatio = "5",则内半径等于环宽度除以5,此值被android:innerRadius覆盖,默认值是9。
    3.android:thickness -->尺寸,环的厚度。
    4.android:thicknessRatio--->浮点型,环的厚度,表示为环宽度的比例,如android:thicknessRatio="2",则厚度等于宽度除以2,此值被android:innerRadius覆盖,默认值为3。
    5.android:useLevel--->布尔值,如果这用作LevelListDrawable,则此值为“true”。通常应为“false”,或者形状不会显示。

六个基本节点属性(corners、gradient、padding、size、solid、stroke)

1、<corners> : 为形状产生圆角,仅当android:shape="rectangle"时适用
corners节点下的属性和描述:

属性 描述
android:radius 尺寸。矩形四个角的半径,以尺寸值和尺寸资源(@dimens)表示,会被以下属性覆盖对应的位置。
android:topLeftRadius 尺寸。左上角的半径,以尺寸和尺寸资源表示
android:topRightRadius 尺寸。右上角的半径
android:bottomLeftRadius 尺寸。左下角的半径
androoid:bottomRightRight 尺寸。右下角的半径

注:(最初)必须为每个角提供大于1的角半径,否则无法产生圆角。如果希望特定角不要倒圆角,解决方法是使用android:radius设置大于1的默认角半径,然后使用实际所需的值替换每个角,为不希望倒圆角的角提供零(“0dp”)

2、<gradient> : 指定形状的渐变颜色
gradient的属性和描述

属性 描述
android:angle 整型。渐变的角度(读)。0为从左到右,90为从上到下,必须是45的倍数,默认为0
android:centerX 浮点型。渐变中心的相对X轴的位置(0 -- 1.0)
android:centerY 浮点型。渐变中心的相对Y轴的位置(0 -- 1.0)
android:centerColor 颜色。起始颜色与结束颜色之间的可选颜色,以十六进制或颜色资源表示
android:startColor 起始颜色
android:endColor 结束颜色
android:gradientRadius 渐变的半径。仅在android:type="radial时适用
android:type 关键字。要应用的渐变图案的类型
android:useLevel 布尔值。如果这用作LevelListDrawable,则此值为"true"
android:type关键字说明
说明
android:type="linear" 线性渐变。这是默认值
android:type="radial" 径向渐变。起始颜色为中心颜色
android:type="sweep" 流线型渐变

3、<padding> : 要应用到包含视图元素的内边距(这会填充视图内容的位置,而非形状)
padding的属性和描述

属性 描述
android:left 左内边距
android:top 上内边距
android:right 右内边距
android:bottom 下内边距

4、<size> : 形状的大小
size的属性和描述

属性 描述
android:height 形状的高度
androud:width 形状的宽度

5、<solid> : 用于填充形状的纯色
solid的属性和描述

属性 描述
android:color 颜色。应用于填充形状的颜色

6、<stroke> : 形状的笔画中线
stroke的属性和描述

属性 描述
android:width 尺寸,线的宽度
android:color 颜色。线的颜色
android:dashGap 尺寸。短划线的间距,仅设置了android:dashWidth有效
android:dashWidth 尺寸。每个短划线的大小,仅在设置了android:dashGap有效

示例

1.新建Shape文件

首先在res/drawable文件夹下,new --> Drawable resource file ,新建一个文件,命名为:shape_bg.xml(名称随意,自己定,理解就行),注意Root element选择为shape:

内容:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <gradient
        android:startColor="#FFFF0000"
        android:endColor="#80FF00FF"
        android:angle="45"/>
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <corners android:radius="8dp" />
</shape>

2.XML布局中将shape应用到视图中

既然定义了shape文件,肯定就要使用,下面将其设置为TextView的背景

    <TextView
    android:background="@drawable/shape_bg"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content" 
    android:id="@+id/textview"/>
代码获取Shape,并应用到视图中:
Resources res = getResources();
Drawable shape = res. getDrawable(R.drawable.gradient_box);

TextView tv = (TextView)findViewByID(R.id.textview);
tv.setBackground(shape);
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 223,726评论 6 521
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 95,697评论 3 402
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 170,734评论 0 366
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 60,508评论 1 300
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 69,522评论 6 399
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 53,051评论 1 314
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 41,429评论 3 427
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 40,403评论 0 278
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,930评论 1 323
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,977评论 3 343
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 41,122评论 1 354
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,763评论 5 350
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 42,454评论 3 336
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,931评论 0 25
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 34,047评论 1 275
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 49,613评论 3 380
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 46,150评论 2 363

推荐阅读更多精彩内容