美文网首页阅读理解码农的世界程序员
从实现画画板的功能说设计模式

从实现画画板的功能说设计模式

作者: 蓝色小石头 | 来源:发表于2017-06-17 15:37 被阅读184次

GitHub demo

怎么才能记录用户在屏幕上操作的所有痕迹呢?

他山之石

先推荐几本设计模式的好书
我看过许多遍的三本有关设计模式的书,《设计模式》定义并介绍23种设计模式,是设计模式的奠基者,书中以C++作为编程语言。《大化设计模式》深入浅出,幽默风趣,以C#为编程语言,笔者极力推荐。《OC编程之道》是结合iOS讲解设计模式的,以OC为编程语言。

设计模式三部曲 作者 出版社
《设计模式:可复用面向对象软件的基础》 GoF 1994 机械工业出版社
**《大话设计模式》 ** 程杰 清华大学出版社
《Objective-C编程之道:iOS设计模式解析》 [美]Carlo Chung 人民邮电出版社

3本书各有侧重点,都值得反复看。建议先粗看《设计模式》了解各模式定义,然后精看《大话》深入了解各设计模式的运用场景及方法,再看《OC编程之道》结合iOS对设计模式的具体运用,对设计模式进一步理解。

画画板功能

  • 用手指涂鸦画板
  • 清空画板,删除涂鸦
  • 允许撤销恢复涂鸦
  • 记录并回放涂鸦过程

此次命令模式解决的就是核心的撤销恢复和涂鸦记录回放功能。
GitHub demo

文件结构

文件结构图.png

第一部分是操作命令的数据模型,第二部分是管理类,第三部分是视图类

类(文件)名 作用
命令格式.html 涂鸦操作命令格式说明文档
CommandInfo(INIT\ADD\RMV\POP\CLEAR\END) 操作命令数据模型
CommandManager 操作命令的管理类
ReplayManager 命令队列的回放管理类
DrawPath 涂鸦笔画的数据模型
DrawView 涂鸦画板视图类
ZoomView\DrawingboardScoll 画板缩放
DrawDebugVC 画板功能展示页

设计模式的运用

  • 组合模式

画画板涂鸦以手指按下至抬起所滑动轨迹为一个笔划,DrawPath用组合模式记录了一个笔划的轨迹,同时也承担着记录一个点的功能。DrawPath除了颜色、线宽等基本信息外,不仅包含一个笔划的贝塞尔路径,还包括笔划中每个记录点的位置信息和标识符。(不是本文重点以后另做文章讲解)

组合模式:将对象组合成树形结构以表示“部分-整体”的层次结构。组合使得用户对单个对象。(《设计模式》GoF,1994)

  • 命令模式

应用场景:

  • 程序支持撤销与恢复。
  • 用对象参数化一个动作来执行操作,并用不同命令对象来代替回调函数
  • 想要在不同时刻对请求进行指定、排列和执行。
  • 想让系统支持事务,事务封装了对数据的一系列修改。事务可以建模为命令对象。

命令模式(Command):将请求封装为一个对象,从而可用不同的请求对客户端进行参数化,对请求排队或记录请求日志,以及支持可撤销的操作。(《设计模式》GoF,1994)

  1. 操作命令格式化
    对操作命令格式化,每一个操作命令被具体化成一个命令对象,命令对象装载着操作命令的标识符、名称、据开始的相对时间、涂鸦信息等。

  2. 记录操作命令的队列
    开始记录后,用户在画板上的每一个操作(开始、添加笔划、撤销、恢复、删除、结束)都会被命令管理类CommandManager按时间顺序计入到命令队列,还提供了将命令队列转换成json串的功能,以便于上传服务器保存。

** 3. 对操作命令队列进行回放(命令模式精髓) **
当需要回放涂鸦记录时,把以上保存的命令队列找出来,开启循环对视图重绘,循环结束的条件就是命令队列最后一条结束命令执行的相对时间已到。

先创建2个数组,redoStackundoStack。在循环重绘时按顺序逐条取出已经到相对时间点的命令。

其中redoStack只用来装载要添加笔划的命令,用这些笔划命令解析出笔划信息进行重绘;undoStack只用来装载被撤销的添加笔划命令。

添加笔划命令即往redoStack添加一条笔划信息,撤销命令即把相应笔划信息从redoStack取出放入undoStack,恢复则反之,删除即清空redoStackundoStack

若是添加上录音功能,俨然就能达到整个录制视频的效果,同学们可以自己尝试一下。

相关文章

  • 从实现画画板的功能说设计模式

    GitHub demo 怎么才能记录用户在屏幕上操作的所有痕迹呢? 他山之石 先推荐几本设计模式的好书我看过许多遍...

  • 设计模式学习笔记|单例模式 Singleton

    单例模式是设计模式中比较经常听说的设计模式,也是比较容易掌握的设计模式。基本上接触过设计模式的人别的模式不一定能说...

  • ios开发实现画板功能

    ios开发实现画板功能 ios开发实现画板功能

  • 设计模式问答(一)

    设计模式问答(一) 什么是设计模式?您能说出工厂模式、抽象工厂模式、创建者模式、原型模式、原型模式的潜复制及深复制...

  • 设计模式第二篇、单例设计模式

    目录1、什么是单例设计模式2、单例设计模式的简单实现3、单例设计模式面临的两个问题及其完整实现4、单例设计模式的应...

  • GCD与非GCD实现单粒设计模式

    GCD实现设计模式 在某个类里面实现GCD单粒设计模式 类的.h文件 类的.m文件 宏定义封装GCD单粒设计模式(...

  • 总结3

    设计模式 设计模式 就是使用 多态,即继承和实现来实现的,只不过使用在不同场景下的时候,就会体现出不同的设计模式。...

  • Java基础(3)——抽象类和单例设计模式

    本节内容1.单例设计模式2.抽象类实现模板设计模式3.抽象类实现造房子 一、单例设计模式1.设计模式:对经常出现的...

  • 【Java】 建造者模式——Java绘图

    前言 选修了《软件设计模式》,下面是建造者模式的作业,设计模式参考的是《软件设计模式》(刘伟 著)。画UML类图的...

  • 反射与代理设计模式

      代理设计模式是在程序开发中使用最多的设计模式,代理设计模式的核心是有真实业务实现类和代理业务实现类,并且代理类...

网友评论

  • 蓝色小石头:设计模式说白了就是程序员们总结的解决常见问题的套路,是一种程序设计思想的经验总结,不分什么大项目能用小项目不能用之说,只要能用就能用。有时候你绞尽脑汁解决了一个问题,殊不知你用的可能其实就是一种经典的设计模式,自用而不自知那就尴尬了,多学学设计模式的套路早日成为编程老司机

本文标题:从实现画画板的功能说设计模式

本文链接:https://www.haomeiwen.com/subject/bldmqxtx.html