android项目 之 记事本（6）----- 加入手写

       想必大家都用过QQ的白板功能，里面主要有两项，一个是涂鸦功能，事实上类似于上节的画板功能，而还有一个就是手写，那记事本怎么能没有这个功能呢，今天就来为我们的记事本加入手写功能。

       先上图，看看效果：

       看了效果图，是不是心动了呢？那就赶紧着手做吧，事实上，手写功能并不难实现，大体就是全屏书写，定时发送handle消息，更新activity。

       实现手写功能的主要步骤：

             1. 自己定义两个View,一个是TouchView,用于在上面绘图，还有一个是EditText,用于将手写的字显示在当中，而且，要将两个自己定义View通过FrameLayout帧式布局重叠在起，以实现全屏手写的功能。

             2  在TouchView中实现写字，并截取画布中的字以Bitmap保存。

             3. 设置定时器，利用handle更新界面。

       

        以下是实现的细节：

            1. 手写的界面设计：

                      如上图所看到的，和上节的画板界面一致，底部分选项菜单条，有5个选项，各自是调整画笔大小，画笔颜色，撤销，恢复，以及清空，对于这些功能，之后几节再实现。

                    布局文件activity_handwrite.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@android:color/white"><FrameLayoutandroid:layout_width="fill_parent"android:layout_height="wrap_content"android:id="@+id/finger_layout"  ><com.example.notes.LineEditTextandroid:id="@+id/et_handwrite"android:layout_width="match_parent"android:layout_height="match_parent"android:scrollbars="vertical"android:fadingEdge="vertical"android:inputType="textMultiLine"android:gravity="top"android:textSize="20sp"android:layout_margin="5dp"android:focusable="true"android:lineSpacingExtra="10dp"android:textColor="#00000000"android:background="#00000000"/><com.example.notes.TouchViewandroid:id="@+id/touch_view"android:layout_width="fill_parent"android:layout_height="wrap_content"android:background="@android:color/transparent" ></com.example.notes.TouchView></FrameLayout><ImageView android:layout_width="match_parent"android:layout_height="wrap_content"android:src="@drawable/line"android:layout_above="@+id/paintBottomMenu"/><GridView android:id="@+id/paintBottomMenu" android:layout_width="match_parent"android:layout_height="45dp"android:numColumns="auto_fit"android:background="@drawable/navigationbar_bg"android:horizontalSpacing="10dp"android:layout_alignParentBottom="true"></GridView></RelativeLayout>

                 能够看出，里面有两个自己定义view，而且通过FrameLayout重叠在一起。       

           

                先来看com.example.notes.LineEditText，这个事实上和加入记事中的界面一样，就是自己定义EditText,而且在字的以下画一条线。

         LineEditText.java

public class LineEditText extends EditText {private Rect mRect;private Paint mPaint;public LineEditText(Context context, AttributeSet attrs) {// TODO Auto-generated constructor stubsuper(context,attrs);mRect = new Rect();mPaint = new Paint();mPaint.setColor(Color.GRAY);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);//得到EditText的总行数int lineCount = getLineCount();Rect r = mRect;Paint p = mPaint;//为每一行设置格式 for(int i = 0; i < lineCount;i++){//取得每一行的基准Y坐标，并将每一行的界限值写到r中int baseline = getLineBounds(i, r);//设置每一行的文字带下划线canvas.drawLine(r.left, baseline+20, r.right, baseline+20, p);}}
}

         还有一个就是com.example.notes.TouchView，实现了绘制，及定时更新界面的功能，详细看代码

         TouchView.java

public class TouchView extends View {private Bitmap  mBitmap,myBitmap;private Canvas  mCanvas;private Path    mPath;private Paint   mBitmapPaint;private Paint mPaint;private Handler bitmapHandler;GetCutBitmapLocation getCutBitmapLocation;private Timer timer;DisplayMetrics dm;private int w,h;public TouchView(Context context) {super(context);dm = new DisplayMetrics();((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(dm);w = dm.widthPixels;h = dm.heightPixels;initPaint();}public TouchView(Context context, AttributeSet attrs) {super(context,attrs);dm = new DisplayMetrics();((Activity) context).getWindowManager().getDefaultDisplay().getMetrics(dm);w = dm.widthPixels;h = dm.heightPixels;initPaint();}//设置handlerpublic void setHandler(Handler mBitmapHandler){bitmapHandler = mBitmapHandler;}//初始化画笔，画布private void initPaint(){mPaint = new Paint();mPaint.setAntiAlias(true);mPaint.setDither(true);mPaint.setColor(0xFF00FF00);mPaint.setStyle(Paint.Style.STROKE);mPaint.setStrokeJoin(Paint.Join.ROUND);mPaint.setStrokeCap(Paint.Cap.ROUND);mPaint.setStrokeWidth(15);  getCutBitmapLocation = new GetCutBitmapLocation();//画布大小 mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);mCanvas = new Canvas(mBitmap);  //全部mCanvas画的东西都被保存在了mBitmap中mCanvas.drawColor(Color.TRANSPARENT);mPath = new Path();mBitmapPaint = new Paint(Paint.DITHER_FLAG);timer = new Timer(true);}/*** 处理屏幕显示*/Handler handler = new Handler(){public void handleMessage(Message msg) {switch (msg.what) {			case 1:	myBitmap = getCutBitmap(mBitmap); Message message = new Message();message.what=1;Bundle bundle = new Bundle();;bundle.putParcelable("bitmap",myBitmap);message.setData(bundle);bitmapHandler.sendMessage(message);RefershBitmap();break;}super.handleMessage(msg);}};/*** 发送消息给handler更新ACTIVITY		*/TimerTask task = new TimerTask() {public void run() {Message message = new Message();message.what=1;Log.i("线程", "来了");handler.sendMessage(message);}};//分割画布中的字并返回public Bitmap getCutBitmap(Bitmap mBitmap){//得到手写字的四周位置，并向外延伸10pxfloat cutLeft = getCutBitmapLocation.getCutLeft() - 10;float cutTop = getCutBitmapLocation.getCutTop() - 10;float cutRight = getCutBitmapLocation.getCutRight() + 10;float cutBottom = getCutBitmapLocation.getCutBottom() + 10;cutLeft = (0 > cutLeft ? 0 : cutLeft);cutTop = (0 > cutTop ? 0 : cutTop);cutRight = (mBitmap.getWidth() < cutRight ? mBitmap.getWidth() : cutRight);cutBottom = (mBitmap.getHeight() < cutBottom ? mBitmap.getHeight() : cutBottom);//取得手写的的高度和宽度 float cutWidth = cutRight - cutLeft;float cutHeight = cutBottom - cutTop;Bitmap cutBitmap = Bitmap.createBitmap(mBitmap, (int)cutLeft, (int)cutTop, (int)cutWidth, (int)cutHeight);if (myBitmap!=null ) {myBitmap.recycle();myBitmap= null;}return cutBitmap;}//刷新画布private void RefershBitmap(){initPaint();invalidate();if(task != null)task.cancel();}@Overrideprotected void onDraw(Canvas canvas) {            canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);     //显示旧的画布       canvas.drawPath(mPath, mPaint);  //画最后的path}private float mX, mY;private static final float TOUCH_TOLERANCE = 4;//手按下时private void touch_start(float x, float y) {mPath.reset();//清空pathmPath.moveTo(x, y);mX = x;mY = y;if(task != null)task.cancel();//取消之前的任务task = new TimerTask() {@Overridepublic void run() {Message message = new Message();message.what=1;Log.i("线程", "来了");handler.sendMessage(message);}};getCutBitmapLocation.setCutLeftAndRight(mX,mY);}//手移动时private void touch_move(float x, float y) {float dx = Math.abs(x - mX);float dy = Math.abs(y - mY);if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {mPath.quadTo(mX, mY, x, y);// mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);//源码是这样写的，但是我没有弄明确，为什么要这样？mX = x;mY = y;if(task != null)task.cancel();//取消之前的任务task = new TimerTask() {@Overridepublic void run() {Message message = new Message();message.what=1;Log.i("线程", "来了");handler.sendMessage(message);}};getCutBitmapLocation.setCutLeftAndRight(mX,mY);}}//手抬起时private void touch_up() {//mPath.lineTo(mX, mY);mCanvas.drawPath(mPath, mPaint);mPath.reset();if (timer!=null) {if (task!=null) {task.cancel();task = new TimerTask() {public void run() {Message message = new Message();message.what = 1;handler.sendMessage(message);}};timer.schedule(task, 1000, 1000);				//2200秒后发送消息给handler更新Activity}}else {timer = new Timer(true);timer.schedule(task, 1000, 1000);					//2200秒后发送消息给handler更新Activity}}//处理界面事件@Overridepublic boolean onTouchEvent(MotionEvent event) {float x = event.getX();float y = event.getY();switch (event.getAction()) {case MotionEvent.ACTION_DOWN:touch_start(x, y);invalidate(); //刷新break;case MotionEvent.ACTION_MOVE:touch_move(x, y);invalidate();break;case MotionEvent.ACTION_UP:touch_up();invalidate();break;}return true;}}

        这里面的难点就是利用TimerTask和Handle来更新界面显示，须要在onTouchEvent的三个事件中都要通过handle发送消息来更新显示界面。

        

       接下来就是在activity里通过handle来得到绘制的字，并加入在editText中。

       关于配置底部菜单，以及顶部标题栏，这里不再赘述，直接怎样将绘制的字得到，并加入在edittext中：

      

         得到绘制字体的Bitmap

	   //处理界面Handler handler = new Handler(){@Overridepublic void handleMessage(Message msg) {super.handleMessage(msg);Bundle bundle = new Bundle();bundle = msg.getData();Bitmap myBitmap = bundle.getParcelable("bitmap");	InsertToEditText(myBitmap);}};


          当中myBitmap就是取得的手写字，保存在Bitmap中，  InsertToEditText(myBitmap);是将该图片加入在edittext中,详细例如以下：

	private LineEditText et_handwrite;      
	et_handwrite = (LineEditText)findViewById(R.id.et_handwrite);

                    

	   //将手写字插入到EditText中private void InsertToEditText(Bitmap mBitmap){int imgWidth = mBitmap.getWidth();int imgHeight = mBitmap.getHeight();//缩放比例float scaleW = (float) (80f/imgWidth);float scaleH = (float) (100f/imgHeight);Matrix mx = new Matrix();//对原图片进行缩放mx.postScale(scaleW, scaleH);mBitmap = Bitmap.createBitmap(mBitmap, 0, 0, imgWidth, imgHeight, mx, true);//将手写的字插入到edittext中SpannableString ss = new SpannableString("1");ImageSpan span = new ImageSpan(mBitmap, ImageSpan.ALIGN_BOTTOM);ss.setSpan(span, 0, 1, Spannable.SPAN_INCLUSIVE_EXCLUSIVE);et_handwrite.append(ss);}

            这样，就实现了手写的功能，下节就实现手写字的撤销，恢复，以及清空的功能。

                 

            

              

 

 

 

      

转载于:https://www.cnblogs.com/blfshiye/p/4264408.html

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/273413.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

HTTP协议中常见请求方法以及一些常见错误代码

HTTP协议中常见请求方法以及一些常见错误代码

GET&#xff1a; 请求指定的页面信息&#xff0c;并返回实体主体。 HEAD&#xff1a; 只请求页面的首部。 POST&#xff1a; 请求服务器接受所指定的文档作为对所标识的URI的新的从属实体。 PUT&#xff1a; 从客户端向服务器传送的数据取代指定的文档的内容。 DELETE&#xff…
阅读更多...
license文件生成原理

license文件生成原理

byte解密weblogic加密oraclehex现在很多J2EE应用都采用一个license文件来授权系统的使用&#xff0c;特别是在系统购买的早期&#xff0c;会提供有限制的license文件对系统进行限制&#xff0c;比如试用版有譬如IP、日期、最大用户数量的限制等。 而license控制的方法又有很…
阅读更多...
linux常用关机命令及其区别-Shutdown halt reboot init

linux常用关机命令及其区别-Shutdown halt reboot init

1.shutdown shutdown命令安全地将系统关机。 shutdown 参数说明: [-t] 在改变到其它runlevel之前﹐告诉init多久以后关机。 [-r] 重启计算器。 [-k] 并不真正关机﹐只是送警告信号给每位登录者〔login〕。 [-h] 关机后关闭电源〔halt〕。 [-n] 不用init﹐而是自己来关机。不鼓…
阅读更多...
CSS3动画@keyframes中translate和scale混用出错问题

CSS3动画@keyframes中translate和scale混用出错问题

在写基于网页的2048时&#xff0c;想让一个元素出现时已经通过translate属性固定在指定位置&#xff0c;同时显示动画scale(0)-->scale(1)&#xff0c;以实现放大出现效果。 CSS代码为 -webkit-keyframes mymove_failed{0% {-webkit-transform:translate(50px,50px) scale…
阅读更多...
metero学习

metero学习

博客园首页新随笔联系订阅管理最新随笔 最新评论 node.js相关的中文文档及教程 (转) Posted on 2013-08-30 10:40 小小清清 阅读(61) 评论(0) 编辑 收藏 node.js api中英文对照: http://docs.cnodejs.net/cman/ node.js入门中文版: http://nodebeginner.org/index-zh-cn.html e…
阅读更多...
Linux统计单个文件统计

Linux统计单个文件统计

语法&#xff1a;wc [选项] 文件… 说明&#xff1a;该命令统计给定文件中的字节数、字数、行数。如果没有给出文件名&#xff0c;则从标准输入读取。wc同时也给出所有指定文件的总统计数。字是由空格字符区分开的最大字符串。 该命令各选项含义如下&#xff1a; - c 统计字节数…
阅读更多...
jQuery慢慢啃之事件对象（十一）

jQuery慢慢啃之事件对象（十一）

1.event.currentTarget//在事件冒泡阶段中的当前DOM元素 $("p").click(function(event) {alert( event.currentTarget this ); // true }); 2.event.data//当前执行的处理器被绑定的时候&#xff0c;包含可选的数据传递给jQuery.fn.bind。 $("a").ea…
阅读更多...
Linuxcurl命令参数详解

Linuxcurl命令参数详解

Linuxcurl是通过url语法在命令行下上传或下载文件的工具软件&#xff0c;它支持http,https,ftp,ftps,telnet等多种协议&#xff0c;常被用来抓取网页和监控Web服务器状态。1.linuxcurl抓取网页&#xff1a;抓取百度&#xff1a;curlhttp://www.baidu.com如发现乱码&#xff0c;…
阅读更多...
android解析XML总结（SAX、Pull、Dom三种方式）

android解析XML总结（SAX、Pull、Dom三种方式）

在android开发中&#xff0c;经常用到去解析xml文件&#xff0c;常见的解析xml的方式有一下三种&#xff1a;SAX、Pull、Dom解析方式。 今天解析的xml示例&#xff08;channels.xml&#xff09;如下&#xff1a; 1 <?xml version"1.0" encoding"utf-8"…
阅读更多...
查看Eclipse中的jar包的源代码：jd-gui.exe

查看Eclipse中的jar包的源代码：jd-gui.exe

前面搞了很久的使用JAD&#xff0c;各种下载插件&#xff0c;最后配置好了&#xff0c;还是不能用&#xff0c;不知道怎么回事&#xff0c; 想起一起用过的jd-gui.exe这个工具&#xff0c;是各种强大啊&#xff01;&#xff01;&#xff01; 只需要把jar包直接扔进去就可以了&a…
阅读更多...
maven scope含义的说明

maven scope含义的说明

compile &#xff08;编译范围&#xff09; compile是默认的范围&#xff1b;如果没有提供一个范围&#xff0c;那该依赖的范围就是编译范围。编译范围依赖在所有的classpath 中可用&#xff0c;同时它们也会被打包。 provided &#xff08;已提供范围&#xff09; provided 依…
阅读更多...
此地址使用了一个通常用于网络浏览以外的端口。出于安全原因，Firefox 取消了该请求...

此地址使用了一个通常用于网络浏览以外的端口。出于安全原因，Firefox 取消了该请求...

FirFox打开80以外的端口&#xff0c;会弹出以下提示&#xff1a; “此地址使用了一个通常用于网络浏览以外的端口。出于安全原因&#xff0c;Firefox 取消了该请求。”。 解决方法如下&#xff1a; 在Firefox地址栏输入about:config,然后在右键新建一个字符串键network.securit…
阅读更多...
Java操作shell脚本

Java操作shell脚本

public class Exec {private static ILogger logger LoggerFactory.getLogger(Exec.class);public Exec() {super();}/*** 执行命令&#xff08;如Shell脚本&#xff09;<br>* * param cmd 操作命令* param timeout 超时时间* return 命令执行过程输出内容* * throws IO…
阅读更多...
Mysql更新插入

Mysql更新插入

在向表中插入数据的时候&#xff0c;经常遇到这样的情况&#xff1a;1. 首先判断数据是否存在&#xff1b; 2. 如果不存在&#xff0c;则插入&#xff1b;3.如果存在&#xff0c;则更新。 在 SQL Server 中可以这样处理&#xff1a; if not exists (select 1 from t where id …
阅读更多...
信息加密之信息摘要加密MD2、MD4、MD5

信息加密之信息摘要加密MD2、MD4、MD5

对于用户数据的保密一直是各个互联网企业头疼的事&#xff0c;那如何防止用户的个人信息泄露呢&#xff1f;今天为大家介绍一种最简单的加密方式--信息摘要算法MD。它如何来保护用户的个人信息呢&#xff1f;其实很简单&#xff0c;当获得到用户的信息后&#xff0c;先对其进行…
阅读更多...
Java 从网络上下载文件

Java 从网络上下载文件

/*** 下载文件到本地 */public static void downloadPicture(String imageUrl, String filename){ URL url;try {url new URL(imageUrl);//打开网络输入流DataInputStream dis new DataInputStream(url.openStream());//建立一个新的文件FileOutputStream fos new FileOutp…
阅读更多...
An error was encountered while running(Domain=LaunchSerivcesError, Code=0)

An error was encountered while running(Domain=LaunchSerivcesError, Code=0)

今天突然遇到这样一个错误&#xff0c;编译可以通过&#xff0c;但是运行就会弹出这个错误提示&#xff1a; An error was encountered while running(DomainLaunchSerivcesError, Code0) 解决办法就是重置模拟器。 点击模拟器菜单中的Reset Contents and Settings&#xff0c;…
阅读更多...
hdu 4091 线性规划

hdu 4091 线性规划

分析转自&#xff1a;http://blog.csdn.net/dongdongzhang_/article/details/7955136 题意 &#xff1a; 背包能装体积为N, 有两种宝石&#xff0c; 数量无限&#xff0c; 不能切割。 分别为 size1 value 1 size2 value2 问背包能装最大的价值&#xff1f; 思路 &#xff…
阅读更多...
linux fmt命令

linux fmt命令

简单的格式化文本 fmt [option] [file-list] fmt通过将所有非空白行的长度设置为几乎相同&#xff0c;来进行简单的文本格式化 参数 fmt从file-list中读取文件&#xff0c;并将其内容的格式化版本发送到标准输出。如果不制定文件名或者用连字符&#xff08;-&#xff09;来替代…
阅读更多...
基于 jQuery支持移动触摸设备的Lightbox插件

基于 jQuery支持移动触摸设备的Lightbox插件

Swipebox是一款支持桌面、移动触摸手机和平板电脑的jquery Lightbox插件。该lightbox插件支持手机的触摸手势&#xff0c;支持桌面电脑的键盘导航&#xff0c;并且支持视频的播放。 在线预览 源码下载 简要教程 Swipebox是一款支持桌面、移动触摸手机和平板电脑的jQuery Ligh…
阅读更多...
最新文章

Copyright @ 2022~2023