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

原创 2016年06月01日 09:01:39

概述

之前曾写过一篇文章介绍了Android中drawable使用Shape资源,通过定义drawable中的shape资源能够绘制简单的图形效果,如矩形,椭圆形,线形和圆环等。后来我在项目中正好遇到这样一个需求,要在特定的位置上显示一条垂直的虚线。正当我胸有成竹的把上面的资源文件放入进去的时候,我才发现它并不能符合我的要求。使用shape画出的垂直虚线,其实就是将一条水平的线,旋转90度。但这样做的弊端就是,该View有效区域为旋转90度后与原来位置相重合的区域,还不能随意的改动,这样的效果根本没法使用。于是我就想到使用自定义view来绘制我想要的结果。

1.画一条水平虚线

代码如下所示:

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.DashPathEffect;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class CustView extends View{

    private Paint mPaint; //定义画笔

    public CustView(Context context, AttributeSet attrs) {
        super(context, attrs);

        //初始化画笔
        initPaint();
        setLayerType(View.LAYER_TYPE_SOFTWARE, mPaint); //4.0以上关闭硬件加速,否则虚线不显示
    }

    private void initPaint() {
        mPaint = new Paint();
        mPaint.setAntiAlias(true); //设置抗锯齿的效果
        mPaint.setStyle(Paint.Style.STROKE); //设置画笔样式为描边
        mPaint.setStrokeWidth(3);  //设置笔刷的粗细度
        mPaint.setColor(Color.RED); //设置画笔的颜色
        mPaint.setPathEffect(new DashPathEffect(new float[]{5,5,5,5}, 1)); //设置画笔的路径效果为虚线效果
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        canvas.drawLine(0, 0, 100, 0, mPaint);
    }
}

布局文件中引用如下:

    <com.test.CustView
        android:layout_width="100dp"
        android:layout_height="10dp"
        android:layout_marginTop="10dp" />

说明:在自定义View的代码中,onDraw方法中执行的drawLine方法,全名如下:

public void drawLine (float startX, float startY, float stopX, float stopY, Paint paint)

startX:起始端点x坐标
startY:起始端点y坐标
stopX:终止端点x坐标
stopY:终止端点y坐标
上面四个左边的值均以相对位置计算,即与左边控件的相对位置,如果左边没有控件则手机屏幕左边框的相对位置计算。
canvas.drawLine(0, 0, 100, 0, mPaint);表示的是相对左边为x,y坐标为0的位置开始,向右画出100px的虚线。
这里写图片描述
去掉Button按钮后,相对位置开始以屏幕左边框计算,如图所示:
这里写图片描述

还有一点需要注意的是,stopX和stopY的值,不能超过该控件在xml中layout_width和layout_height的值,否则将会以值最小的为基准,超出的长度无效。

2.画一条垂直虚线

与上面代码一致,只需要修改至下面一处:

canvas.drawLine(0, 0, 0, 100, mPaint);

3.画一个实心圆

1.首先设置画笔样式为实心

mPaint.setStyle(Paint.Style.FILL); //设置画笔样式为填充

2.在画布中画圆

canvas.drawCircle(50, 50, 50, mPaint);

同样X和Y的值,不能超过该控件在xml中layout_width和layout_height的值。

4.画一个圆环

同样只需稍微修改一下代码:

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        canvas.drawCircle(50, 50, 50, mPaint); //画一个外圆
        mPaint.setColor(Color.WHITE);           //重新设置画笔颜色
        canvas.drawCircle(50, 50, 30, mPaint); //画一个内圆
    }

5.画一个矩形

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        RectF rect = new RectF(0, 0, 80, 60);
        canvas.drawRect(rect, mPaint);
    }

shape文件的读取和展示

//选择shape文件 public string[] OpenShapeFile() { string[] ShpFile = new ...
  • RSS_40728440
  • RSS_40728440
  • 2018年01月12日 17:00
  • 116

代码修改包shape背景文件的背景颜色

有时候复用同一个布局文件,可以对其用代码设置不同的颜色,但是如果这个布局文件的background设置的是shape文件,那么设置颜色会导致这个shape文件失效,可以用如下方法设置: View...
  • ccfcccc
  • ccfcccc
  • 2016年08月31日 10:21
  • 535

自定义控件shape详解

[TOC] android开发中需要使用自定义资源文件,shape文件可以做成任意形状经常用作背景色。 在AS中可以在drawable文件下右键新建resource file 然后在文件内将标题改...
  • qq_34767498
  • qq_34767498
  • 2016年07月01日 17:56
  • 598

【Android】自定义View-为View加上边框

一、概述 我们在工作中经常会因为产品经理的需求自定义一个界面,这个界面可能是对系统控件的扩展或者完全是一个新的东西,这时候我们就需要根据需求来自定义一个。下面我将对TextView进行简单的...
  • u013466880
  • u013466880
  • 2017年09月26日 20:30
  • 289

安卓自定义控件(三)实现自定义View

前面两篇博客,把View绘制的方法说了一下,但是,我们只在onDraw里面做文章,控件都是直接传入一个Context,并不能在布局文件里使用自定义View。这一篇博客,就不再讲绘制,在我们原先的基础上...
  • chen413203144
  • chen413203144
  • 2016年11月29日 09:13
  • 880

Android自定义view,ShapeView,多边形

童鞋们,你还在为绘制常用的多边形而烦恼吗?不用怕,小福利,有需要的尽管拿去!ShapeView,支持圆、三角形、正方形、五边形、五角星、六边形。 效果图:代码 attr.xml ...
  • jshch2009
  • jshch2009
  • 2017年03月27日 17:59
  • 639

自定义TextView 灵活使用Shape实现边框

效果: 一般写法,使用shape:
  • psmmsp
  • psmmsp
  • 2017年05月05日 10:58
  • 269

Android使用handler和Runnable结合,自定义View更新UI的Demo

前三周在修改android4.2锁屏UI,刚做android好多知识不会啊,里面有个动画效果是一个jian...
  • canghai1129
  • canghai1129
  • 2014年04月12日 12:07
  • 2248

用shape为view添加边框(可以部分添加)

android view添加部分边框
  • yu_124816
  • yu_124816
  • 2016年04月05日 13:48
  • 1546

Android自定义View使用总结

View是一个Android视图的基础类,这个类是用户接口的基础构件。 View 表示屏幕上的一块矩形区域,负责绘制这个区域和事件处理。...
  • wenzhi20102321
  • wenzhi20102321
  • 2016年11月29日 16:49
  • 1663
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android中使用自定义View实现shape图形绘制
举报原因:
原因补充:

(最多只允许输入30个字)