目录：java
前言缓存
（一）建立项目函数
（三）调用工具post
（四）运行效果spa
（五）完整代码3d
前言：code
今天是鸿蒙的手机beta发布活动，很荣幸受邀来到现场，一下子能够给你们上个靓照～。component
本篇旨在经过实践一些样例，让开发者们快速提升肾上腺素，欢乐的加入鸿蒙应用开发之旅。整篇就是一个完整的实操样例，我也尽可能在一片中把内容都讲清楚。blog
基础的一些知识点，能够访问我另外一个系列：《鸿蒙OS应用开发实践》
正文
（一）建立项目
1.建立一个新的TV项目:
2.建立一个新的Java类：
命名为Draw:
这个做为咱们的绘画的核心组件，因此咱们让他继承Component，方便后面的调用。须要注意的是，这里导入包名的时候，咱们选择第一个：ohos.agp.components包。
完成后，依然会报错，提示咱们须要建立构造函数：
一样默认会有不少构造方法，咱们选择第一个（单个参数）便可。
（二）实现绘画工具
这样一个基础的组件类就建立好了，接着咱们构思下一画板工具里须要哪些元素：
画笔：用于画出各类点和线。
画板：用于展示咱们到底花了什么，它是内容的载体。
因此，根据以上这些元素，在接下来咱们须要在代码里定义和建立一些内容：
Path mPath = new Path();
Paint mPaint;
Point mPrePoint = new Point();
Point mPreCtrlPoint = new Point();
Canvas : 画布的意思，属于渲染组件，通常用于渲染各类界面元素，这里须要 import ohos.agp.render.Canvas;包
Path ： 路径的意思，也属于渲染组件，用于描述绘制的路径。须要import ohos.agp.render.Path;
Paint : 表示绘制，属于渲染组件，用于一些绘制操做，须要import ohos.agp.render.Paint;
Point : 表示一个点，一般由二维坐标（x,y）组成，须要import ohos.agp.utils.Point;
因此上面的代码，咱们先定义了一些等待使用的工具变量。
如今咱们缺乏了一个东西，那就是如何交互？通常的，绘图这样的，咱们要么鼠标，要么触屏，要么就是电子绘笔等。这里咱们使用鸿蒙触摸组件来实现。
在代码中去实现Component.TouchEventListener方法：
实现onTouchEvent（）方法：
onTouchEvent包含两个参数:Component表示当前接收的组件，TouchEvent表示当前的触摸事件。
经过getAction实例方法能够获取TouchEvent的状态：
TouchEvent.PRIMARY_POINT_DOWN ： 按下状态
TouchEvent.PRIMARY_POINT_UP ：点按状态抬起
TouchEvent.POINT_MOVE： 点按拖动
咱们须要在按下的时候开始记录点的位置，拖动的时候记录下整个轨迹，而抬起的时候则不作任何事情。
因此，在onTouchEvent事件函数中，咱们的代码这样写：
switch (touchEvent.getAction()) {
case TouchEvent.PRIMARY_POINT_DOWN: {
MmiPoint point = touchEvent.getPointerPosition(touchEvent.getIndex());
mPath.moveTo(point.getX(), point.getY());
mPrePoint.position[0] = point.getX();
mPrePoint.position[1] = point.getY();
mPreCtrlPoint.position[0] = point.getX();
mPreCtrlPoint.position[1] = point.getY();
return true;
}
case TouchEvent.PRIMARY_POINT_UP:
break;
case TouchEvent.POINT_MOVE: {
break;
}
MmiPoint ：表示是人机交互接口的一个Point，这里用来接收点击事件的点，须要import ohos.multimodalinput.event.MmiPoint;
而后在点击下去的这一下，指定路径mPath的moveTo目标为当前事件点击得到的点。
同时也设置了两个预制缓存点的坐标为当前点击的点。
抬起的操做，咱们这里暂时不作处理。
直接来处理下移动分支下的操做：
case TouchEvent.POINT_MOVE: {
MmiPoint point = touchEvent.getPointerPosition(touchEvent.getIndex());
Point currCtrlPoint = new Point((point.getX() + mPrePoint.position[0]) / 2,
(point.getY() + mPrePoint.position[1]) / 2);
mPath.cubicTo(mPrePoint, mPreCtrlPoint, currCtrlPoint);
mPreCtrlPoint.position[0] = currCtrlPoint.position[0];
mPreCtrlPoint.position[1] = currCtrlPoint.position[1];
mPrePoint.position[0] = point.getX();
mPrePoint.position[1] = point.getY();
invalidate();
break;
> 解析：
一样用MmiPoint来接收点击输入，而后先说下mPath.cubicTo：使用path的cubicTo方法来实现三次贝塞尔曲线，就是说两个点之间的线有两个控制点。这样可让曲线更加的平滑,它须要输入三个点的参数，因此，咱们以前定义了两个Point变量，这里就须要用上了，总体上的原理就是，先把点击得到第一个点传入到曲线函数中，而后计算当前点击的位置加上第一个点的二分之一偏移量来细化获得一个更小的值来做为第三个参数，而第二个参数，咱们让缓存的另外一个点直接接收当前点击的点的值，而后传入到第二个参数中，最后又更新当前位置给第一个点，这样第一个点传入（旧的点），加上拖动后的当前点（新点），在当前点的二分偏移量的点，构成了三点传给了曲线函数，最后从新更新旧的点，让旧点变成一个新的位置，再次拖动的时候，就所有有了新的值，造成一个闭环。
invalidate()函数表示申请从新绘制（刷新UI）。
至此，咱们就完成了点绘制（画笔）的计算方法。
下一步，咱们要实现让画笔的这些点和线呈现到画板（Canvas）上：
做者：涂启标
想了解更多内容，请访问： 51CTO和华为官方战略合做共建的鸿蒙技术社区https://harmonyos.51cto.com