android 绘制几何背景,Android之用layer-list,shape,selector画各种背景

本文介绍了Android绘制几何背景的相关知识,包括Shape、Selector和layer - list的简介、属性及使用方法。Shape可在XML中定义几何形状,Selector能根据不同状态定义显示效果,layer - list可将多个item叠层。还给出多个绘制背景图的实例,通过叠层可实现各种背景图。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.Shape

简介

作用:XML中定义的几何形状

位置:res/drawable/文件的名称.xml

使用的方法:

Java代码中:R.drawable.fileName

XML中:android:background="@drawable/fileName"

或:android:src="@drawable/fileName"

属性

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

其中rectagle矩形,oval椭圆,line水平直线,ring环形

中子节点的常用属性:

  渐变

android:startColor

起始颜色

android:endColor

结束颜色

android:angle

渐变角度,0从左到右,90表示从下到上,数值为45的整数倍,默认为0;

android:type

渐变的样式 liner线性渐变radial环形渐变sweep

  填充

android:color

填充的颜色

描边

android:width

描边的宽度

android:color

描边的颜色

android:dashWidth

表示'-'横线的宽度

android:dashGap

表示'-'横线之间的距离

圆角

android:radius

圆角的半径 值越大角越圆

android:topRightRadius

右上圆角半径

android:bottomLeftRadius

右下圆角角半径

android:topLeftRadius

左上圆角半径

android:bottomRightRadius

左下圆角半径

填充

android:bottom="1.0dip"

底部填充

android:left="1.0dip"

左边填充

android:right="1.0dip"

右边填充

android:top="0.0dip"

上面填充

2.Selector

简介

根据不同的选定状态来定义不同的现实效果

分为四大属性:

android:state_selected 是选中

android:state_focused 是获得焦点

android:state_pressed 是点击

android:state_enabled 是设置是否响应事件,指所有事件

另:

android:state_window_focused 默认时的背景图片

引用位置:res/drawable/fileName

使用的方法:

Java代码中:R.drawable.fileName

XML中:android:background="@drawable/fileName"

或:android:src="@drawable/fileName"

3.layer-list

简介

作用:将多个item叠层

Java代码中:R.drawable.fileName

XML中:android:background="@drawable/fileName"

或:android:src="@drawable/fileName"

说完了它们的基本用简介和属性,下面来直接列几个例子:

white_bg_solid.xml  画的是一个叠层后显示为:四个圆角的一张背景图

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottom="6dp"

android:left="6dp"

android:right="6dp"

android:top="6dp" />

white_bg_solid_pressed.xml 跟上面的一样,只不过颜色变了,用来做点击色

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottom="6dp"

android:left="6dp"

android:right="6dp"

android:top="6dp" />

white_bg_top_solid.xml 画的是叠层后显示为:上面两个角为圆角,下面两个直角的一张背景图 ,细节第三层的

android:bottom="0.7dp"(底边立体效果)

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottom="0.7dp">

android:left="6dp"

android:top="6dp"

android:right="6dp"

android:bottom="6dp"/>

white_bg_bottom_solid.xml 画的是叠层后显示为:上面两个角为直角,下面为两个圆角的一张背景图

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottomLeftRadius="6dp"

android:bottomRightRadius="6dp"

android:topLeftRadius="6dp"

android:topRightRadius="6dp" />

android:bottom="6dp"

android:left="6dp"

android:right="6dp"

android:top="6dp" />

edit_text._layer.xml 画的是带有带有钩子的文本输入框背景图,类似于微信输入框的效果

android:bottom="1dp"

android:left="1dp"

android:right="1dp">

white_bg_solid_selector.xml

最终测试布局

test.xml

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

android:background="@color/space_bg" >

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="100dp"

android:layout_margin="10dp"

android:background="@drawable/white_bg_solid_selector">

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:background="@drawable/edit_text_layer"

android:hint="@null"

android:padding="4dp"/>

android:layout_width="match_parent"

android:layout_height="100dp"

android:layout_margin="10dp"

android:background="@drawable/white_bg_top_solid"/>

android:layout_width="match_parent"

android:layout_height="100dp"

android:layout_margin="10dp"

android:background="@drawable/white_bg_bottom_solid"/>

好了,例子说完了,想要画什么样的背景图,我们都通过layer-list叠层来拼成背景图,就可以实现我们想要的背景图了。

说了这么半天,来看下效果图:

b2159dd0052474ccf35de75b89937df1.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值