加快Android开发!教你用shape绘制!

标签: shape android
8人阅读 评论(0) 收藏 举报
分类:

目录

  • 前言
  • 矩形
  • 椭圆
  • 线
  • 最后

前言

在没有UI设计师的时候, 或者是想简单看下效果的时候, 用shape进行快速绘制是极好的!

官方文档传送门

一共有四种shape:

  • rectangle
  • oval
  • line
  • ring

矩形

我们一个一个来看, 首先是矩形:

矩形例子

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <!-- 尺寸 -->
    <size
        android:width="160dp"
        android:height="80dp" />

    <!-- 颜色 -->
    <!--<solid android:color="@color/colorPrimary" />-->

    <!-- 内间距 -->
    <padding
        android:bottom="8dp"
        android:left="8dp"
        android:right="8dp"
        android:top="8dp" />

    <!-- 渐变 -->
    <gradient
        android:angle="45"
        android:endColor="@color/colorPrimary"
        android:startColor="@color/colorAccent"
        android:type="linear" />

    <!-- 圆角 -->
    <!--<corners android:radius="200dp" />-->

    <!-- 圆角单独设置 -->
    <corners
        android:bottomLeftRadius="0dp"
        android:bottomRightRadius="0dp"
        android:topLeftRadius="40dp"
        android:topRightRadius="40dp" />

    <!-- 描边 -->
    <stroke
        android:width="2dp"
        android:color="#666"
        android:dashGap="4dp"
        android:dashWidth="4dp" />
</shape>
  • 渐变gradient是会覆盖颜色的, 如果你想要纯色, 直接设置颜色值即可, 就是设置solid中的color.
  • 顺带一提, solid只有color一个参数.
  • 如果你没有渐变gradient, 也不写solid, 那么将会是空心的.
  • 渐变gradienttype参数有3个:

    • linear 线性渐变
    • sweep 扫描渐变
    • radial 放射渐变, 需要配合参数gradientRadius
  • 圆角corners可以直接设置radius, 也可以一个一个指定.

  • 描边stroke的话不写dashGap, dashWidth就会是实线, dashWidth代表虚线宽度, dashGap代表虚线间隔.
  • 内间距padding和尺寸size就不提了, 大家都懂的.

椭圆

然后是椭圆:

椭圆例子

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">

    <!-- 尺寸 -->
    <size
        android:width="160dp"
        android:height="80dp" />

    <!-- 颜色 -->
    <!--<solid android:color="@color/colorPrimary" />-->

    <!-- 内间距 -->
    <padding
        android:bottom="8dp"
        android:left="8dp"
        android:right="8dp"
        android:top="8dp" />

    <!-- 渐变 -->
    <gradient
        android:centerColor="@color/colorPrimary"
        android:endColor="@color/colorPrimaryDark"
        android:startColor="@color/colorAccent"
        android:type="sweep" />

    <!-- 描边 -->
    <stroke
        android:width="1dp"
        android:color="#333" />
</shape>
  • 渐变是最多可以设置三种颜色:

    • startColor, centerColor, endColor
  • 一般椭圆都会用来绘制实心的小圆点.


线

线就很简单了:

线例子

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">

    <!-- 描边 -->
    <stroke
        android:width="8dp"
        android:color="@color/colorPrimary"
        android:dashGap="8dp"
        android:dashWidth="6dp" />
</shape>

最后来看环, 它有些特有属性:

环例子

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="4"
    android:shape="ring"
    android:thicknessRatio="100"
    android:useLevel="false">

    <!-- 尺寸 -->
    <size
        android:width="200dp"
        android:height="200dp" />

    <!-- 渐变 -->
    <gradient
        android:angle="0"
        android:centerColor="@color/colorPrimaryDark"
        android:endColor="@color/colorPrimary"
        android:startColor="@color/colorAccent"
        android:type="sweep" />

    <!-- 描边 -->
    <stroke
        android:width="1dp"
        android:color="#777"
        android:dashGap="4dp"
        android:dashWidth="4dp" />
</shape>

thicknessRatio指的是环厚度百分比, 默认是9, 比如说这里宽度是200dp, thicknessRatio是100, 环厚度就是200dp / 100 = 2dp. 当然, 你可以直接用thickness设置厚度.
innerRadiusRatio是内环百分比, 默认是3, 就是指用宽度 / 百分比得到的值就是内环半径. 同样可以用innerRadius直接设置.


最后

这样一来很多简单图形都可以直接画出来了, 是不是方便多了.


查看评论

MIS 建设的误区

MIS 建设的误区 作者: 麻国毅----最近,笔者看了一些刊物上发表的关于管理信息系统(MIS)建设的体会文章 ,也参加了一些关于企业信息化的讨论,感受颇深。MIS建设目前还不尽如人意, 或者说远未...
  • vcbear
  • vcbear
  • 2001-02-25 01:56:00
  • 1895

手把手教你用Android开发新浪微博客户端》

  • 2011年11月18日 13:40
  • 332KB
  • 下载

Android Shape绘制实用圆圈

Android允许通过xml定义资源,常见的事string,id,integer,dimen等,也可以定义一些图片资源,比如用来做几何的矢量图就非常好用,其中有许多的细节问题,具体需求可以再结合goo...
  • HGuang_ZJH
  • HGuang_ZJH
  • 2014-06-20 15:36:39
  • 55550

android使用shape来绘制控件

在android中常使用shape来作为控件的背景,来实现对控件形状的设计 shape的文件 位于 drawable文件中  在drawable目录下 添加 任意文件名的xml文件(myshape.x...
  • liaomin416100569
  • liaomin416100569
  • 2016-10-27 11:49:12
  • 618

Android可绘制对象资源之shape和layer-list使用

11
  • xiehuimx
  • xiehuimx
  • 2017-04-20 22:47:32
  • 1168

Android Shape绘制背景

需要绘制一个背景,上面有圆角,然后四边有边框。是Shape很简单的用法。大概是这样的,就是有几层绘制出来的。...
  • shenyu_njau
  • shenyu_njau
  • 2017-09-06 15:21:29
  • 137

ANDROID SHAPE画圆形背景实现圆形TextView

xml version="1.0" encoding="UTF-8"?> shape xmlns:android="http://schemas.android.com/apk/res/andro...
  • lc547913923
  • lc547913923
  • 2016-07-21 14:42:36
  • 1577

Android 画三角形shape

  • u013598111
  • u013598111
  • 2016-01-10 22:22:16
  • 20339

Android中使用自定义View实现shape图形绘制

概述之前曾写过一篇文章介绍了Android中drawable使用Shape资源,通过定义drawable中的shape资源能够绘制简单的图形效果,如矩形,椭圆形,线形和圆环等。后来我在项目中正好遇到这...
  • yuminfeng728
  • yuminfeng728
  • 2016-06-01 09:01:39
  • 1417

使用shape图形资源制作引导页面的提示圆点

在app引导界面通常有引导界面提示小圆点,下面简单介绍一下利用shape图形资源如何实现: 本文引导界面是使用的ViewPager,当ViewPager滑动时候可以动态的改变小圆点的颜色来提示用户 ...
  • zw382701145
  • zw382701145
  • 2016-02-03 10:31:10
  • 2250
    个人资料
    持之以恒
    等级:
    访问量: 1543
    积分: 133
    排名: 119万+
    文章分类
    文章存档