分享一个iOS下实现基本绘画板功能的简单方法

代码部分
TouchView.h

复制代码 代码如下:

#import <UIKit/UIKit.h> 
 
@interface TouchView : UIView 

    NSMutableArray *points; 
    NSArray *points_all; 
    CGContextRef context; 
    UIColor *paint_clr; 

@property (strong,nonatomic) NSMutableArray *points; 
@property (strong,nonatomic) NSArray *points_all; 
@property (strong,nonatomic) UIColor *paint_clr; 
 
@end

TouchView.m

复制代码 代码如下:

#import "TouchView.h" 
 
@implementation TouchView 
@synthesize points, points_all, paint_clr; 
 
- (id)initWithFrame:(CGRect)frame 

    self = [super initWithFrame:frame]; 
    if (self) { 
        // Initialization code 
        paint_clr = [UIColor greenColor]; 
    } 
    return self; 

 
// Only override drawRect: if you perform custom drawing. 
// An empty implementation adversely affects performance during animation. 
- (void)drawRect:(CGRect)rect 

    // Drawing code 
    if ((!self.points) || (self.points.count < 2)) { 
        return; 
    } 
       
    context = UIGraphicsGetCurrentContext(); 
    //设置画笔粗细  
    CGContextSetLineWidth(context, 5.0f); 
    //设置画笔颜色 
    //[[UIColor blueColor]set ]; 
    // [paint_clr set]; 
    //CGContextSetStrokeColorWithColor(context, [[UIColor blueColor]CGColor]); 
    CGContextSetStrokeColorWithColor(context, [paint_clr CGColor]); 
     
    //画以前的轨迹 
    for (int j = 0 ; j < [self.points_all count]; j++) { 
        NSMutableArray *points_tmp = [points_all objectAtIndex:j]; 
             
            for (int i = 0;i < [points_tmp count]-1;i++) 
            { 
                CGPoint point1 = [[points_tmp objectAtIndex:i] CGPointValue]; 
                CGPoint point2 = [[points_tmp objectAtIndex:(i+1)] CGPointValue]; 
                CGContextMoveToPoint(context, point1.x, point1.y); 
                CGContextAddLineToPoint(context, point2.x, point2.y); 
                CGContextStrokePath(context); 
            } 
        } 
     
    //画这次 
    for (int i=0; i < [self.points count]-1; i++) { 
        CGPoint point1 = [[self.points objectAtIndex:i] CGPointValue]; 
        CGPoint point2 = [[self.points objectAtIndex:(i+1)] CGPointValue]; 
        CGContextMoveToPoint(context, point1.x, point1.y); 
        CGContextAddLineToPoint(context, point2.x, point2.y); 
        CGContextStrokePath(context); 
    }     

 
//不支持多点触摸 
- (BOOL) isMultipleTouchEnabled 

    return NO; 

 
//创建一个array,并且记录初始ponit 
- (void) touchesBegan:(NSSet *) touches withEvent:(UIEvent *) event 

    self.points = [NSMutableArray array]; 
    CGPoint pt = [[touches anyObject] locationInView:self]; 
    [self.points addObject:[NSValue valueWithCGPoint:pt]]; 

 
//移动过程中记录这些points 
//调用setNeedsDisplay,会触发drawRect方法的调用 
- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event 

    CGPoint pt = [[touches anyObject] locationInView:self]; 
    [self.points addObject:[NSValue valueWithCGPoint:pt]]; 
    [self setNeedsDisplay]; 

 
- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event 

    NSMutableArray *points_tmp = [[NSMutableArray alloc] initWithArray:self.points]; 
    if (self.points_all == nil) { 
        self.points_all = [[NSArray alloc] initWithObjects:points_tmp, nil]; 
    }else { 
        self.points_all = [self.points_all arrayByAddingObject:points_tmp]; 
    } 

@end

ViewController.h

复制代码 代码如下:

#import <UIKit/UIKit.h> 
 
@class TouchView; 
@interface ViewController : UIViewController 

    TouchView *tv; 

@end

ViewController.m

复制代码 代码如下:

#import "ViewController.h" 
#import "TouchView.h" 
 
@interface ViewController () 
 
@end 
 
@implementation ViewController 
 
- (void)viewDidLoad 

    [super viewDidLoad]; 
    // Do any additional setup after loading the view, typically from a nib. 
    self.view.userInteractionEnabled = YES; 
     
  // TouchView *tv = [[TouchView alloc]initWithFrame:CGRectMake(0.0f, 0.0f, 260.0f, 260.0f)]; 
    tv = [[TouchView alloc]initWithFrame:self.view.frame]; 
    tv.backgroundColor = [UIColor blackColor]; 
     
    [self.view addSubview:tv]; 
     
    UISegmentedControl *seg = [[UISegmentedControl alloc] initWithItems:[@"White Red Blue Green Yellow" componentsSeparatedByString:@" "]]; 
    seg.segmentedControlStyle = UISegmentedControlSegmentCenter; 
    seg.tintColor = [UIColor blackColor];  
    seg.center = CGPointMake(self.view.center.x, (self.view.bounds.size.height - seg.bounds.size.height));  
    [self.view addSubview:seg]; 
     
    [seg addTarget:self action:@selector(colorChange:) forControlEvents:UIControlEventValueChanged]; 

 
- (void)viewDidUnload 

    [super viewDidUnload]; 
    // Release any retained subviews of the main view. 

 
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation 

    return (interfaceOrientation != UIInterfaceOrientationPortraitUpsideDown); 

 
- (void) colorChange: (UISegmentedControl *) seg 

    switch ([seg selectedSegmentIndex]) 
    { 
        case 0:  
            tv.paint_clr = [UIColor whiteColor]; 
            break; 
        case 1: 
            tv.paint_clr = [UIColor redColor]; 
            break; 
        case 2: 
            tv.paint_clr = [UIColor blueColor]; 
            break; 
        case 3: 
            tv.paint_clr = [UIColor greenColor]; 
            break; 
        case 4: 
            tv.paint_clr = [UIColor yellowColor]; 
            break; 
        default: 
             
            break; 
    } 

 
@end

效果图

时间: 2015-10-29

iOS简单画板开发案例分享

最近在学习Quartz2D,学习了一个简单画板的实现,现在把实现过程记录一下. 主要用到的点就是画线,截屏,绘制图片,选择图片,以及保存所有绘制的线. 首先在storyboard上布局好控件,设置约束等等,最后的效果是这样: 自定义画板DrawView,使用时可能是从xib中加载,也可能是手动创建,所以创建对象的方法需要实现两个: #import <UIKit/UIKit.h> @interface DrawView : UIView /** 线宽 */ @property (nonatomi

IOS实现的简单画板功能

效果图 设计要求 1.画笔能设置大小.颜色 2.有清屏.撤销.橡皮擦.导入照片功能 3.能将绘好的画面保存到相册 实现思路 1.画笔的实现,我们可以通过监听用户的 平移手势 中创建 UIBezierPath 来实现线条的绘制 2.撤销功能,我们先来看下撤销功能,我们会想到用一个数组队列将用户的每一次的笔画都加入到数组中,然后撤销的时候只需要将最后添加进去的笔画pop掉,重新绘制就可以了 3.清屏功能就简单了,只需要将上面说到的那个数组清空重新绘制下就可以了 4.导入照片功能,可以用系统的 UII

Python基于opencv实现的简单画板功能示例

本文实例讲述了Python基于opencv实现的简单画板功能.分享给大家供大家参考,具体如下: import cv2 import numpy as np drawing = False # true if mouse is pressed ix,iy = -1,-1 def nothing(x): pass # mouse callback function def draw_circle(event,x,y,flags,param): global ix,iy,drawing g = par

基于opencv实现简单画板功能

OpenCV提供了很多简单的语句,实现复杂的功能,根据颜色和鼠标交互的基础语句,我们可以建立一个简单的画板.尽管它简单,但是制作的框架步骤不能少. 如果您感兴趣,可以按照我的步骤写一下,或者直接复制总程序中的代码运行. 一.功能 明确画板功能,便于后续编写程序. 目标功能:可调节颜色,有画图区域,可以进行鼠标输入. 二.框架搭建 主要有两步: 第一步:建立颜色选区,可以用OpenCV的滑动条语句cv.createTrackbar设置.cv.createTrackbar一共拥有五个参数设置,它们是

iOS tableview实现简单搜索功能

本文实例为大家分享了tableview实现搜索功能的具体代码,供大家参考,具体内容如下 一.先用xcode创建好工程 通过xib文件来初始化视图控制器 二.编写代码 1.先为NSDictionary创建一个分类 实现字典的深拷贝 .h文件 #import <Foundation/Foundation.h> @interface NSDictionary (MutableDeepCopy) - (NSMutableDictionary *)mutableDeepCopy; @end .m文件 #

iOS如何开发简单的手绘应用实例详解

开发一款简单的 iOS 手绘应用, 收集点,绘制形状,给形状着色,呈现给用户,好像就完了 框架是 Quartz2D 1, 收集点 首先需要有一个界面 UIView, 用这个界面监听用户的手势,收集点 用户按下手指 location(in, 从触摸事件中,获得在画板中的坐标 var lastPoint = CGPoint.zero override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) { guard l

Android仿iOS侧滑退出当前界面功能

我们都知道在ios手机上面,有一个侧滑退出当前界面的功能,但是在安卓手机上系统没有给我们提供这样的功能,但是这依然阻挡不了强大的安卓的定制功能,我们完全可以自己定制一套这样的功能. 首先看下效果图: 分析: (1)要想模仿ios的这种效果,因为我们通过手指的滑动,所以这里肯定跟我们的滑动事件有关系(onInterceptTouchEvent,onTouchEvent这两个方法的关系,如果不清楚,请直接查阅事件传递机制原理) (2)我们要想直接拦截我们的所有触摸事件,我们可以在上层父级布局中进行拦

Android编程实现画板功能的方法总结【附源码下载】

本文实例讲述了Android编程实现画板功能的方法.分享给大家供大家参考,具体如下: Android实现画板主要有2种方式,一种是用自定义View实现,另一种是通过Canvas类实现.当然自定义View内部也是用的Canvas.第一种方式的思路是,创建一个自定义View(推荐SurfaceView),在自定义View里通过Path对象记录手指滑动的路径调用lineTo()绘制:第二种方式的思路是,先用Canvas绘制一张空的Bitmap,通过ImageView的setImageBitmap()方

python+pygame简单画板实现代码实例

疑问:pygame已经过时了吗? 过没过时不知道,反正这玩意官方已经快四年没有更新了.用的人还是蛮多的(相对于其他同类项目),不过大家都是用来写写小东西玩一玩,没有人用这个做商业项目.pygame其实就是SDL的python绑定,SDL又是基于OpenGL,所以也有人用pygame+pyOpenGL做3D演示什么的.真的要写游戏的话pygame的封装比较底层,不太够用,很多东西都要自己实现(当然自由度也高).文档也不太好,好在前人留下了很多文章.拿来练手倒是很不错的选择,可以用来实践很多2D游戏

JS实现简单路由器功能的方法

本文实例讲述了JS实现简单路由器功能的方法.分享给大家供大家参考.具体实现方法如下: var wawa = {}; wawa.Router = function(){ function Router(){ } Router.prototype.setup = function(routemap, defaultFunc){ var that = this, rule, func; this.routemap = []; this.defaultFunc = defaultFunc; for (v