Android程序开发中,我们经常会去用到Shape这个东西去定义各种各样的形状,shape可以绘制矩形环形以及椭圆,所以只需要用椭圆即可,在使用的时候将控件比如imageview或textview的高宽设置成一样就是正圆,solid表示远的填充色,stroke则代表远的边框线,所以两者结合可以实现带边缘的圆,当然也可以直接加上size控制高宽。那么我首先带你们了解一下Shape下有哪些标签,并且都代表什么意思:

shape属性:

rectangle:矩形

oval:椭圆

line:线,需要 stroke 来设置宽度

ring:环形

solid属性:

color:填充颜色

stroke属性:

color:边框颜色

width:边框宽度

dashWidth:虚线框的宽度

dashGap:虚线框的间隔

corners属性:

radius:四个角的半径

topRightRadius:右上角的半径

bottomLeftRadius:右下角的半径

opLeftRadius:左上角的半径

bottomRightRadius:左下角的半径

gradient属性:

startColor:其实颜色

centerColor:中间颜色

endColor:结束颜色

centerX:中间颜色的相对X坐标(0 -- 1)

centerY:中间颜色的相对Y坐标(0 -- 1)

useLevel:(true/false), 是否用作LevelListDrawable的标志

angle是渐变角度,必须为45的整数倍。0从左到右,90从下到上,180从右到左,270从上到下

type:渐变模式。 默认线性渐变,可以指定渐变为radial(径向渐变)或者sweep(类似雷达扫描的形式)

gradientRadius:渐变半径,径向渐变需指定半径。

padding属性:

left:左内边距

top:上内边距

right:右内边距

bottom:下内边距

size属性:

width:宽

height:高

现在接下来我们通过一个例子,画了五个不一样的形状,来详细了解有关Shape的用法。例子如下:

1、画椭圆虚线边框背景,资源文件代码如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  3. <!-- 圆角 -->
  4. <corners
  5. android:bottomLeftRadius="8dp"
  6. android:bottomRightRadius="8dp"
  7. android:radius="15dp"
  8. android:topLeftRadius="8dp"
  9. android:topRightRadius="8dp" />
  10. <!-- 描边 -->
  11. <stroke
  12. android:dashGap="4dp"
  13. android:dashWidth="4dp"
  14. android:width="2dp"
  15. android:color="@color/ellipse_dashed_line_color" />
  16. </shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圆角 -->
<corners
android:bottomLeftRadius="8dp"
android:bottomRightRadius="8dp"
android:radius="15dp"
android:topLeftRadius="8dp"
android:topRightRadius="8dp" /> <!-- 描边 -->
<stroke
android:dashGap="4dp"
android:dashWidth="4dp"
android:width="2dp"
android:color="@color/ellipse_dashed_line_color" /> </shape>

2、画实线透明边框背景,资源文件代码如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  3. <!-- 圆角 -->
  4. <corners
  5. android:bottomLeftRadius="6dp"
  6. android:bottomRightRadius="6dp"
  7. android:radius="10dp"
  8. android:topLeftRadius="6dp"
  9. android:topRightRadius="6dp" />
  10. <!-- 描边 -->
  11. <stroke
  12. android:width="1dp"
  13. android:color="@color/ellipse_dashed_line_color" />
  14. </shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圆角 -->
<corners
android:bottomLeftRadius="6dp"
android:bottomRightRadius="6dp"
android:radius="10dp"
android:topLeftRadius="6dp"
android:topRightRadius="6dp" /> <!-- 描边 -->
<stroke
android:width="1dp"
android:color="@color/ellipse_dashed_line_color" /> </shape>

3、画实线填充颜色边框背景,资源文件代码如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <shape xmlns:android="http://schemas.android.com/apk/res/android" >
  3. <!-- 圆角 -->
  4. <corners
  5. android:bottomLeftRadius="6dp"
  6. android:bottomRightRadius="6dp"
  7. android:radius="10dp"
  8. android:topLeftRadius="6dp"
  9. android:topRightRadius="6dp" />
  10. <!-- 描边 -->
  11. <solid
  12. android:width="1dp"
  13. android:color="@color/ellipse_dashed_line_color" />
  14. </shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" > <!-- 圆角 -->
<corners
android:bottomLeftRadius="6dp"
android:bottomRightRadius="6dp"
android:radius="10dp"
android:topLeftRadius="6dp"
android:topRightRadius="6dp" /> <!-- 描边 -->
<solid
android:width="1dp"
android:color="@color/ellipse_dashed_line_color" /> </shape>

4、画实线透明半边椭圆边框,资源文件代码如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
  3. <item>
  4. <shape android:shape="rectangle" >
  5. <stroke
  6. android:width="1.2dp"
  7. android:color="#669df3" />
  8. <solid android:color="#00000000" />
  9. <corners
  10. android:bottomRightRadius="10dp"
  11. android:topRightRadius="10dp" />
  12. <padding
  13. android:bottom="8dp"
  14. android:left="12dp"
  15. android:right="12dp"
  16. android:top="8dp" />
  17. </shape>
  18. </item>
  19. </layer-list>
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > <item>
<shape android:shape="rectangle" >
<stroke
android:width="1.2dp"
android:color="#669df3" /> <solid android:color="#00000000" /> <corners
android:bottomRightRadius="10dp"
android:topRightRadius="10dp" /> <padding
android:bottom="8dp"
android:left="12dp"
android:right="12dp"
android:top="8dp" />
</shape>
</item> </layer-list>

5、画实线填充颜色半边椭圆边框,资源文件代码如下:

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    3. <item>
    4. <shape android:shape="rectangle" >
    5. <solid android:color="#669df3" />
    6. <corners
    7. android:bottomLeftRadius="10dp"
    8. android:topLeftRadius="10dp" />
    9. <padding
    10. android:bottom="8dp"
    11. android:left="12dp"
    12. android:right="12dp"
    13. android:top="8dp" />
    14. </shape>
    15. </item>
    16. </layer-list>

//---------------------------------------------------------------------

TextView组件可指定一个android:background属性,该属性用于为该文本框指定背景。大部分的时候,文本框的背景只是一个简单的图片,或者只是一个简单的颜色。
  如果程序使用ShapeDrawable资源作为文本框的android:background属性,则可以在Android应用中作出各种外观的文本框。

ShapeDrawable资源文件如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
<?xml version="1.0" encoding="UTF-8"?>
    android:shape="rectangle">
    <!-- 设置填充颜色 -->
    <solid android:color="#fff"/>
    <!-- 设置四周的内边距 -->
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <!-- 设置边框 -->
    <stroke android:width="3dip" android:color="#ff0" />
</shape>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?xml version="1.0" encoding="UTF-8"?>
    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>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?xml version="1.0" encoding="UTF-8"?>
    android:shape="oval">
    <!-- 定义填充渐变颜色 -->
    <gradient
        android:startColor="#ff0"
        android:endColor="#00f"
        android:angle="45"
        android:type="sweep"/>
    <!-- 设置内填充 -->
    <padding android:left="7dp"
        android:top="7dp"
        android:right="7dp"
        android:bottom="7dp" />
    <!-- 设置圆角矩形 -->
    <corners android:radius="8dp" />
</shape>

接下来在界面布局文件中用这三个ShapeDrawable资源作为文本框的背景。界面布局文件代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/my_shape_1"
    />
<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/my_shape_2"
    />  
<EditText
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/my_shape_3"
    />
</LinearLayout>
 
 
 
 

Android中的shape的更多相关文章

  1. Android中的Shape使用总结

    参考:http://www.cnblogs.com/gzggyy/archive/2013/05/17/3083218.html 在Android程序开发中,我们经常会去用到Shape这个东西去定义各 ...

  2. Android中使用shape来定义控件

    本文章转接于:http://kofi1122.blog.51cto.com/2815761/521605 Android中常常使用shape来定义控件的一些显示属性,今天看了一些shape的使用,对s ...

  3. Android中使用shape实现EditText圆角

    之前看到手机上的百度editText控件是圆角的就尝试做了一下,看了看相关的文章. 因为代码少,看看就知道了.所以下面我就直接贴上代码供大家参考,有其他的好方法记得分享哦~ 整个代码不涉及JAVA代码 ...

  4. Android中使用shape制作一个旋转的progressbar

    public class ZNtestResActivity extends Activity { @Override public void onCreate(Bundle savedInstanc ...

  5. android中自定义shape

    <shape> <!-- 实心 --> <solid android:color="#ff9d77"/> <!-- 渐变 --> & ...

  6. (转)Android中的Shape使用总结

    http://blog.csdn.net/bear_huangzhen/article/details/24488337 在Android程序开发中,我们经常会去用到Shape这个东西去定义各种各样的 ...

  7. Android 中shape的使用(圆角矩形)

    一.在res/drawable文件夹下创建一个名为gradient_box的xml文件: <?xml version="1.0" encoding="utf-8&q ...

  8. 转 Android中shape中的属性大全

    <shape>            <!-- 实心 -->            <solid android:color="#ff9d77"/&g ...

  9. 【Android 界面效果19】Android中shape的使用

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

随机推荐

  1. c3p0私有属性checkoutTimeout设置成1000引发的调试错误:

    checkoutTimeout设置成1000引发的调试错误: org.mybatis.spring.MyBatisSystemException: nested exception is org.ap ...

  2. request相关研究

    一.什么是httpservletrequest 用来处理一个对Servlet的HTTP格式的请求信息. 二.httpservletrequest的作用是什么 优点: 公共接口类HttpServletR ...

  3. SharpZipLib.dll 压缩文件,可以应用于MVC, webform. C# windows application 等等地方

    Nuget 安装:Install-Package ICSharpCode.SharpZipLib.dll private void WriteZipFile(string[] filesToZip, ...

  4. Qt 5.7 > QML

    本文档翻译自Qt官方文档: http://doc.qt.io/qt-5/qtqml-index.html Qt QML Qt QML模块使用QML语言为开发应用与库提供一个框架.它定义并实现了语言与引 ...

  5. 安装node-sass

    SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ npm install node-sass

  6. USACO 2.3 Cow Pedigrees

    Cow Pedigrees Silviu Ganceanu -- 2003 Farmer John is considering purchasing a new herd of cows. In t ...

  7. USACO 1.5 Prime Palindromes

    Prime Palindromes The number 151 is a prime palindrome because it is both a prime number and a palin ...

  8. L2-010. 排座位

    L2-010. 排座位 题目链接:https://www.patest.cn/contests/gplt/L2-010 并查集 相关题目:L2-007. 家庭房产,L3-003. 社交集群 下午打的时 ...

  9. React源码解析-Virtual DOM解析

    前言:最近一直在研究React,看了陈屹先生所著的深入React技术栈,以及自己使用了这么长时间.对React应该说有比较深的理解了,正好前阵子也把两本关于前端设计模式的书看完了,总感觉有一种知识错综 ...

  10. placeholder的美化

    之前在介绍HTML5的placeholder属性时,曾实现了一些页面例子让大家参考,但这些例子里的背景文字都是灰色的,样式很单一,其实它们可以做的更好看.CSS3里提供了专门的规则属性来美化用plac ...