IOS 绘制画画板(封装上下文)
封装上下文
UIImage (CaptureView).h / .m
@interface UIImage (CaptureView) + (UIImage *)captureImageWithView:(UIView *)view;
@end
#import "UIImage+captureView.h" @implementation UIImage (CaptureView) + (UIImage *)captureImageWithView:(UIView *)view
{
// 1.创建bitmap上下文
UIGraphicsBeginImageContext(view.frame.size);
// 2.将要保存的view的layer绘制到bitmap上下文中
[view.layer renderInContext:UIGraphicsGetCurrentContext()];
// 3.取出绘制号的图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
return newImage;
} @end
画画板
NJView.h / .m
@interface NJView : UIView - (void)clearView;
- (void)backView;
@end
#import "NJView.h" @interface NJView () @property (nonatomic, strong) NSMutableArray *paths; @end @implementation NJView - (NSMutableArray *)paths
{
if (_paths == nil) {
_paths = [NSMutableArray array];
}
return _paths;
} // 开始触摸
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{ // 1.获取手指对应UITouch对象
UITouch *touch = [touches anyObject];
// 2.通过UITouch对象获取手指触摸的位置
CGPoint startPoint = [touch locationInView:touch.view]; // 3.当用户手指按下的时候创建一条路径
UIBezierPath *path = [UIBezierPath bezierPath];
// 3.1设置路径的相关属性
[path setLineJoinStyle:kCGLineJoinRound];
[path setLineCapStyle:kCGLineCapRound];
[path setLineWidth:]; // 4.设置当前路径的起点
[path moveToPoint:startPoint];
// 5.将路径添加到数组中
[self.paths addObject:path]; }
// 移动
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
// 1.获取手指对应UITouch对象
UITouch *touch = [touches anyObject];
// 2.通过UITouch对象获取手指触摸的位置
CGPoint movePoint = [touch locationInView:touch.view]; // 3.取出当前的path
UIBezierPath *currentPaht = [self.paths lastObject];
// 4.设置当前路径的终点
[currentPaht addLineToPoint:movePoint]; // 6.调用drawRect方法重回视图
[self setNeedsDisplay]; } // 离开view(停止触摸)
- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{ [self touchesMoved:touches withEvent:event];
/*
// 1.获取手指对应UITouch对象
UITouch *touch = [touches anyObject];
// 2.通过UITouch对象获取手指触摸的位置
CGPoint endPoint = [touch locationInView:touch.view]; // 3.取出当前的path
UIBezierPath *currentPaht = [self.paths lastObject];
// 4.设置当前路径的终点
[currentPaht addLineToPoint:endPoint]; // 6.调用drawRect方法重回视图
[self setNeedsDisplay];
*/ } // 画线
- (void)drawRect:(CGRect)rect
{ [[UIColor redColor] set];
// 边路数组绘制所有的线段
for (UIBezierPath *path in self.paths) {
[path stroke];
} } - (void)test
{
/*
// 1.创建一条路径
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, 20, 20);
CGPathAddLineToPoint(path, NULL, 100, 100); CGMutablePathRef path2 = CGPathCreateMutable();
CGPathMoveToPoint(path2, NULL, 120, 120);
CGPathAddLineToPoint(path2, NULL, 200, 200); CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.将路径添加到上下文中
CGContextAddPath(ctx, path);
CGContextAddPath(ctx, path2); // 3.渲染
CGContextStrokePath(ctx);
*/ /*
// UIBezierPath == CGMutablePathRef // 1.创建一条路径
UIBezierPath *path = [UIBezierPath bezierPath];
// 2.给路径设置起点和重点
[path moveToPoint:CGPointMake(20, 20)];
[path addLineToPoint:CGPointMake(100, 100)]; [path setLineCapStyle:kCGLineCapRound];
[path setLineWidth:10];
[path setLineJoinStyle:kCGLineJoinRound]; // 3.渲染路径
[path stroke]; // 1.创建一条路径
UIBezierPath *path2 = [UIBezierPath bezierPath];
// 2.给路径设置起点和重点
[path2 moveToPoint:CGPointMake(120, 120)];
[path2 addLineToPoint:CGPointMake(200, 200)]; [path2 stroke];
*/
} - (void)clearView
{
[self.paths removeAllObjects];
[self setNeedsDisplay];
}
- (void)backView
{
[self.paths removeLastObject];
[self setNeedsDisplay];
}
调用画画板到控制器
@interface NJViewController ()
/**
* 清屏
*/
- (IBAction)clearBtnClick;
/**
* 回退
*/
- (IBAction)backBtnClick;
/**
* 保存
*/
- (IBAction)saveBtnClick; @property (weak, nonatomic) IBOutlet NJView *customView;
@end @implementation NJViewController
- (IBAction)clearBtnClick {
[self.customView clearView];
} - (IBAction)backBtnClick { [self.customView backView];
} - (IBAction)saveBtnClick { UIImage *newImage = [UIImage captureImageWithView:self.customView];
// 4.保存到相册
UIImageWriteToSavedPhotosAlbum(newImage, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
} - (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo
{
if (error) {
[MBProgressHUD showError:@"保存失败"];
}else
{
[MBProgressHUD showSuccess:@"保存成功"];
}
}
@end
IOS 绘制画画板(封装上下文)的更多相关文章
- iOS 使用UIBezierPath类实现随手画画板
在上一篇文章中我介绍了 UIBezierPath类 介绍 ,下面这篇文章介绍一下如何通过这个类实现一个简单的随手画画板的简单程序demo,功能包括:划线(可以调整线条粗细,颜色),撤销笔画,回撤笔画, ...
- iOS - Quartz 2D 画板绘制
1.绘制画板 1.1 绘制简单画板 PaintBoardView.h @interface PaintBoardView : UIView @end PaintBoardView.m @interfa ...
- IOS 绘制基本图形(画文字、图片水印)
- (void)drawRect:(CGRect)rect { // Drawing code // [self test]; // 1.加载图片到内存中 UIImage *image = [UIIm ...
- IOS 绘制基本图形( 画圆、画线、画圆弧、绘制三角形、绘制四边形)
// 当自定义view第一次显示出来的时候就会调用drawRect方法- (void)drawRect:(CGRect)rect { // 1.获取上下文 CGContextRef ctx = UIG ...
- iOS_24_画画板(含取色板)
终于效果例如以下: 一.简单说明 1.使用一个数组 strokesArr(笔画数组)记录全部笔画.数组中保存的是一个个的笔画字典,一个字典就是一个笔画.笔画字典中有三项:笔画的大小.颜色.points ...
- android96 内存创建图片副本,画画板
package com.itheima.copy; import android.os.Bundle; import android.app.Activity; import android.grap ...
- Android简单开发的画画板
Android开发画画板要考虑得几个问题如下: 1 屏幕画板.画笔如何绘制问题 2 用户手指触摸屏幕画板监听事件,以及对应的几种状态处理问题 3 保存图片到SD卡,以及在系统相册打开时自动加载刚才的 ...
- Android简易实战教程--第二十四话《画画板》
今天完成一个画画板. 首先来个布局: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android ...
- canvas画画板,canvas画五角星,canvas制作钟表、Konva写钟表
制作一个画画板,有清屏有橡皮擦有画笔可以换颜色 style样式 <head> <meta charset="UTF-8"> <title>画画板 ...
随机推荐
- Mybatis学习笔记之一——牛刀小试
1.Mybaits核心对象SqlSession的作用: (1)向SQL语句传入参数: (2)执行SQl语句: (3)获取执行SQL语句的结果: (4)事务的控制: 2.核心配置文件(Configrat ...
- 《OD玩阿里云》搭建环境
一.安装mysql 1. 解决乱码问题 http://www.ha97.com/5359.html http://blog.csdn.net/qiyuexuelang/article/details/ ...
- 洛谷P1054 等价表达式
P1054 等价表达式 题目描述 明明进了中学之后,学到了代数表达式.有一天,他碰到一个很麻烦的选择题.这个题目的题干中首先给出了一个代数表达式,然后列出了若干选项,每个选项也是一个代数表达式,题目的 ...
- Jmeter-线程时间
随手记录下自己在学习遇到的线程时间问题 1.线程数14个,要求每秒进入2个线程,这设置准备时长因为7秒 及准备时长 = 线程数/每秒需要进入的线程数量 如上列中:准备时间 = 1 ...
- jdk的卸载
问题描述: win10环境安装了jdk1.7&jdk1.8&jdk1.9 jdk1.9安装后,设置jdk1.9安装目录为JAVA_HOME.后来JAVA_HOME切换jdk1.8环境变 ...
- php微信公众号开发简单记录
开发前准备:1.服务器 2.微信公众号测试号(有真实的账号更好) 测试号申请地址:https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/lo ...
- Unittest组织用例的姿势
本文我们将会讲解Python Unittest 里组织用例的5种姿势. 环境准备: python 3.0以上 python requests库 小编的环境: python 3.6.4 一.TestLo ...
- js dairy
//留言js逻辑 $(document).ready( function() { $("#post_btn").click( function() { var comment = ...
- The bytes/str dichotomy in Python 3 [transport]
reference and transporting from: http://eli.thegreenplace.net/2012/01/30/the-bytesstr-dichotomy-in-p ...
- ThinkPHP- 3.1
基础: 1. 基础概念 LAMP LAMP是基于Linux,Apache,MySQL和PHP的开放资源网络开发平台.这个术语来自欧洲,在那里这些程序常用来作为一种标准开发环境.名字来源于每个程序的第一 ...