Android中常常使用shape来定义控件的一些显示属性,今天看了一些shape的使用,对shape有了大体的了解,稍作总结:

先看下面的代码:

XML/HTML代码
  1. <shape>
  2. <!--实心-->
  3. <solidandroid:color="#ff9d77"/>
  4. <!--渐变-->
  5. <gradient
  6. android:startColor="#ff8c00"
  7. android:endColor="#FFFFFF"
  8. android:angle="270"/>
  9. <!--描边-->
  10. <stroke
  11. android:width="2dp"
  12. android:color="#dcdcdc"/>
  13. <!--圆角-->
  14. <corners
  15. android:radius="2dp"/>
  16. <padding
  17. android:left="10dp"
  18. android:top="10dp"
  19. android:right="10dp"
  20. android:bottom="10dp"/>
  21. </shape>


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

gradient:渐变
android:startColor和android:endColor分别为起始和结束颜色,ndroid:angle是渐变角度,必须为45的整数倍。
另外渐变默认的模式为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:圆角
android:radius为角的弧度,值越大角越圆。
我们还可以把四个角设定成不同的角度,方法为:

XML/HTML代码
  1. <corners
  2. android:topRightRadius="20dp"右上角
  3. android:bottomLeftRadius="20dp"右下角
  4. android:topLeftRadius="1dp"左上角
  5. android:bottomRightRadius="0dp"左下角
  6. />


这里有个地方需要注意,bottomLeftRadius是右下角,而不是左下角,这个有点郁闷,不过不影响使用,记得别搞错了就行。
还有网上看到有人说设置成0dp无效,不过我在测试中发现是可以的,我用的是2.2,可能修复了这个问题吧,如果无效的话那就只能设成1dp了。

padding:间隔
这个就不用多说了,XML布局文件中经常用到。


大体的就是这样,以下是一个使用的具体示例:用在Selector中作为Button的背景,分别定义了按钮的一般状态、获得焦点状态和按下时的状态,具体代码如下:

XML/HTML代码
  1. main.xml:
  2. <Button
  3. android:layout_width="wrap_content"
  4. android:layout_height="wrap_content"
  5. android:text="TestShapeButton"
  6. android:background="@drawable/button_selector"
  7. />
  8. >



button_selector.xml:

复制到剪贴板XML/HTML代码
  1. <?xmlversion="1.0"encoding="utf-8"?>
  2. <selector
  3. xmlns:android="http://schemas.android.com/apk/res/android">
  4. <itemandroid:state_pressed="true">
  5. <shape>
  6. <!--渐变-->
  7. <gradient
  8. android:startColor="#ff8c00"
  9. android:endColor="#FFFFFF"
  10. android:type="radial"
  11. android:gradientRadius="50"/>
  12. <!--描边-->
  13. <stroke
  14. android:width="2dp"
  15. android:color="#dcdcdc"
  16. android:dashWidth="5dp"
  17. android:dashGap="3dp"/>
  18. <!--圆角-->
  19. <corners
  20. android:radius="2dp"/>
  21. <padding
  22. android:left="10dp"
  23. android:top="10dp"
  24. android:right="10dp"
  25. android:bottom="10dp"/>
  26. </shape>
  27. </item>
  28. <itemandroid:state_focused="true">
  29. <shape>
  30. <gradient
  31. android:startColor="#ffc2b7"
  32. android:endColor="#ffc2b7"
  33. android:angle="270"/>
  34. <stroke
  35. android:width="2dp"
  36. android:color="#dcdcdc"/>
  37. <corners
  38. android:radius="2dp"/>
  39. <padding
  40. android:left="10dp"
  41. android:top="10dp"
  42. android:right="10dp"
  43. android:bottom="10dp"/>
  44. </shape>
  45. </item>
  46. <item>
  47. <shape>
  48. <solidandroid:color="#ff9d77"/>
  49. <stroke
  50. android:width="2dp"
  51. android:color="#fad3cf"/>
  52. <corners
  53. android:topRightRadius="5dp"
  54. android:bottomLeftRadius="5dp"
  55. android:topLeftRadius="0dp"
  56. android:bottomRightRadius="0dp"
  57. />
  58. <padding
  59. android:left="10dp"
  60. android:top="10dp"
  61. android:right="10dp"
  62. android:bottom="10dp"/>
  63. </shape>
  64. </item>
  65. </selector>


运行效果如下图:
一般状态:
android:shape的使用2_第1张图片

获得焦点状态:
android:shape的使用2_第2张图片

按下状态:
android:shape的使用2_第3张图片


更多相关文章

  1. Android如何代码混淆
  2. android 实用代码片段整理
  3. [代码分享] 乐淘Android客户端源码
  4. Android 响应System UI状态,焦点改变,手势处理
  5. 在Ubuntu上下载编译安装Android最新内核源代码
  6. Android声音播放实例代码
  7. 2013.12.23 (2)——— android 代码调用shell
  8. 监听android电话呼叫状态

随机推荐

  1. Android Canvas 圆角处理
  2. Android Studio 调试
  3. Android通过JDBC直连MySql
  4. Android消息推送机制
  5. 生成release版本的Android系统
  6. Json解析速度比较-Android API、Gson、Fa
  7. Android引导界面设计之ParallaxViewPager
  8. Android、iOS添加子视图方法比较
  9. Android开发板串口(SerialPort)通信
  10. Android屏幕自适应