阅读更多

8顶
1踩

Web前端

转载新闻 基于 HTML5 的 Windows 画图程序

2010-04-06 10:29 by 资深编辑 wutao0603 评论(4) 有6578人浏览

Windows 画图程序一直伴随着 Windows 各个版本,这个很简单,几乎没有什么用处的程序拥有最基本的绘图功能,很适合用来涂鸦。HTML5 的 Canvas 对象使在线绘图成为可能,虽然 HTML5 还远未成熟,但很多人已经迫不及待地用它设计一些让人惊叹的应用。

CanvasPaint 是一个基于 HTML5 的标准 Windows 画图程序,它拥有和 Windows 画图程序一模一样的界面和操作,功能也几乎完全一样,在特定浏览器的支持下,你甚至可以将最后的作品保存到本机。这并不是最近的项目,2006年就有了, 因此,目前绝大多数支持标准的浏览器(Firefox,Safari,Chrome,Opera)都可以正常使用这个程序。以下是作者对这个项目的一些解 释。

为什么要开发这个程序?

目的不是为了开发一个 Windows 画图程序,而是体验 HTML5 的 Canvas 功能。

如何使用

和标准 Windows 绘图程序一样。

能保存吗?

是的,但只支持 Firefox 2 和 Opera 9 (译者注:这是作者2006年就实现的一个程序)。在本机保存,选择 File 菜单中的 Download,在线保存,选择 Save online,会自动生成一个 URL 在线显示你的作品。

浏览器本身的右键菜单影响使用

可以在浏览器的设置中禁用右键菜单。

为什么有些功能不能用?

一些功能支持特定版本的浏览器(译者注:这是就2006年而言):

Color picker
Firefox 2.0
Opera 9
Flood fill
Opera 9
Save image
Firefox 2.0
Opera 9
Open URL
Firefox 1.5
Opera 9
Latest WebKit

Canvas 对象好用吗?

对那些不需要跨浏览器支持的应用很好用。但在绘画中,最大的问题是,受限于 mousemove 事件的刷新率,你不太容易发现光标的位置,使用喷笔的时候尤其明显。另外,当尺寸变得很大时,速度变得很慢,没有 getPixel() 功能。

技术细节

程序中使用了 5 个 Canvas 对象。

一个主画板,一个是透明画板层浮动在上方显示预览绘画内容,一个隐藏的 Canvas 用来缓存选择的内容,另一个用来缓存反悔状态,一个用在程序标题栏,用来显示渐变色。

其他人的 HTML5 Canvas 实验

Canvascape 3D (用 HTML5 实现简单的第一人称射击游戏)
CanvasGraph (一个 HTML5 Canvas 绘图 JavaScript  类库 )
Image reflections (用 HTML5 Canvas 实现图像倒影)
Canvas Painter (一个更为简单的 Canvas 画图程序)

真正令人赞叹的 HTML 画图程序

如果上面的程序已经让你对 HTML5 的 Canvas 功能感到鼓舞,下面这个画图程序会让你赞叹。拥有不输桌面的界面体验和流畅感,在多屏幕电脑上,我甚至有将那些浮动工具面板拖到第二个屏幕的冲动。

演示地址:http://mugtug.com/sketchpad/

本文素材来源:http://canvaspaint.org/#
http://mugtug.com/sketchpad/

 

中文编译来源:锐商企业CMS 网站内容管理系统 官方网站

来自: comsharp
8
1
评论 共 4 条 请登录后发表评论
4 楼 conmind 2010-04-07 09:43
同上,处理一个截屏,简单的插图,就用的windows画图程序
3 楼 Godee 2010-04-07 09:17
  很不错!
2 楼 zhoushu126 2010-04-06 11:01
我也经常用,其他的功能太多反而不常用。简单致用就好。
1 楼 JE帐号 2010-04-06 10:49
这个很简单,几乎没有什么用处的程序拥有最基本的绘图功能,很适合用来涂鸦。

--------
说句老实话,我感觉还是经常会用的. 

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • Object-Oriented Programming Summary Ⅲ

    目录 JML单元作业博客 1.1 梳理JML语言的理论基础 0. 前言 1. 形式 2. 作用域 3. 前置条件 (requires) 4. 后置条件 (ensures) 5. 模型域 (model) 6. ...

  • 什么是JML

    它是一种行为接口规格语言(BISL),基于Larch方法构建,特别为Java定制。JML的基本用途是描述Java模块方法的形式规范,它以注释的形式出现在Java源文件中,但并没有与代码分离。这些形式规范在Java文件编译时不会影响代码的编译执行。JML的主要用途包括开展规格化设计,使得交给代码实现人员的不是可能带有内在模糊性的自然语言描述,而是逻辑严格的规格;以及针对已有的代码实现,书写其对应的规格,从而提高代码的可维护性。这在遗留代码的维护方面具有特别重要的意义。

  • java jml_OO_JAVA_JML_单元总结

    1.JML语言介绍1.1 JML概念与理论基础The Java Modeling Language (JML) is a specification language for Java programs, usingHoare style pre- and postconditions and invariants, that follows the design by contractparad...

  • java jml_JML 入门

    【IT168 技术文章】面向对象分析和设计的原则之一就是应当尽可能地把过程设想往后推。我们大多数人只在实现方法之前遵守这一规则。一旦确定了类及其接口并该开始实现方法时,我们就转向了过程设想。那么到底有没有别的选择?和大多数语言一样,编写 Java 代码时,我们需要为计算每个方法的结果一步一步地提供过程。就其本身而言,过程化表示法只是说 如何做某事,却不曾说过我们正在设法做 什么。在动手之前了解我们...

  • java jml_面向对象第三单元总结 - JML(Java Modeling Language) - 简体版本

    面向对象第三单元总结 - JML(Java Modeling Language) - 简体版本一、JML 理论基础 与 应用工具链1.1 JML 理论基础JML(Java Modeling Language)是用于对Java程序进行规格化设计的一种表示语言。JML是一种行为接口规格语言(Behavior Interface Specification Language, BISL),基于Larch...

  • 面向对象第三单元(JML)总结体会

    一.JML语言 定义 Java建模语言(JML)是一种行为接口规范语言,可用于指定Java模块的行为 。它结合了Eiffel的契约方法设计 和Larch 系列接口规范语言的基于模型的规范方法 。 理论基础 JML是契约式语言的一种具体表现形式。 契约(Contact):声明一个函数/方法的时候,对函数的输入和输出所具备的性质是有所期望和规定的。有时候这种性质会被我们明确的写出来,有时候会...

  • OO第三次博客

    目录 一.JML基础 二.部署JMLUnitNG/JMLUnit并应用 三.梳理架构及Bug分析 四.心得体会 一.JML基础 1.JML是什么? ​ JML(Java Modeling Language)是用于对Java程序进行规格化设计的一种表示语言 2.JML用法 ​ (1)开展规格化设计。这样交给代码实现人员的将不是可能带有内在模糊性的自然语言描述,而是逻辑严格的规格。 ​ (2...

  • java jml_OO_JAVA_JML系列作业_单元总结

    OO_JAVA_JML系列作业_单元总结(1)梳理JML语言的理论基础、应用工具链情况简单梳理以下三者是jml规格里的核心,对一个方法功能和属性的限制:requires子句:规定方法的前置条件(precondition);assignable子句:方法的副作用范围限定;ensures子句:规定方法的后置条件(post condition)。简单运用采用OpenJML工具check第一次JML官方开...

  • java契约式编程_第三单元总结——JML契约式编程

    OO第三单元博客作业——JML与契约式编程OO第三单元的三次作业都是在课程组的JML规格下完成。完成作业的过程是契约式编程的过程:设计者完成规格设计,实现者按照规格具体实现。作业正确性的检查同样围绕规格进行:主要验证作业是否严格按照规格实现。课程组承诺如果作业严格实现规格,作业的正确性就没有问题。此即是契约式编程的意义之一:工程的每一个环节都有人负责,兼顾高效性和正确性。JML基础JML(Java...

  • JML语法整理

    1.(/*@ pure @ */)表示纯粹查询方法,即方法的执行不会有任何副作用。 public abstract /*@ pure @*/ int largest(); 二、JML表达式 (一)原子表达式 2.\result:表示一个非 void 类型的方法执行所获得的结果,即方法执行后的返回值。 3.\old(expr):表示一个表达式expr在相应方法执行前的取值,该表达式涉及到评估exp...

  • JML起步---使用JML 改进你的Java程序(2) (转)

    JML起步---使用JML 改进你的Java程序(2) (转)[@more@]量词(Quantification)(译者注:这里量词的意思与逻辑学上的量词意思相近,而不是普通意义上理解的量词。)XML:namespace pre...

  • OpenJML入门

    目录 OpenJML 获取 下载 使用 Linux Windows Parsing and Type-checking Extended Static Checking Runtime Assert...

  • JML

     上周太忙碌了, 和Rosemary一起去了UCD参加了JML的座谈会,有幸结识了Gary Leavens, JML幕后的科学家. 座谈会一共大概来了13个人左右,里面我的Level最低,基本都是Dr.或Professor,只有我刚刚开始PhD. 上午作了一些关于Applied Formal Methods的演讲,以及各自在这块的研究方向.下午就是几个科学家凑在一起写Specification,针

  • 利用JML开发的一个小例子,附详细注释

    利用JML开发的一个小例子,附详细注释。有问题的地方希望大家能帮我提出来,呵呵 /**//**msntest.java**Createdon2007年4月11日,下午1:40**Tochangethistemplate,chooseTools|TemplateManager*andopenthetemplateintheeditor.*/packagejavamsn;importjav...

  • JML入门

    面向对象的分析和设计的原则之一是,应将程序思考尽可能地推迟。 我们大多数人仅在执行方法之前一直遵守该规则。 一旦确定了类及其接口,就该开始实现方法了,我们将切换到过程性思维。 毕竟,还有什么选择? 与大多数语言一样,编写Java代码时,我们需要提供逐步的过程来计算每种方法的结果。 就其本身而言,程序的符号只是说该怎么办而没有说的是什么 ,我们正在努力做一些事情。 在开始做之前了解我们要实现...

  • JML 规格设计分析

    JML 规格设计分析 一、设计分析 1. 路径容器的规格设计 第一次作业需要实现一个路径管理系统,可以通过输入各种指令来进行数据的增删改查等操作。同时这一单元的三次作业中,都没有性能分的要求,有的只是受限制的 CPU 时间,这一次作业的 CPU 时间是 10 秒以内,又因为第一次作业设计的部分很少,所以只要不玩的太脱,几乎不会超时,换句话说,第一次作业几乎是人人满分。 我的程序架构中,使用了 A...

  • JML 模式学习 (oo-编程)

    面向对象学习的第三个单元是让我们熟悉JML这一种格式注释/设计层面伪代码,然后并进行实战使用。 第一次作业是根据接口中的JML注释自己完成一个类调用接口,内容还是相对简单的,但是要考虑时间复杂度。 闲聊一下需求和数据结构:一共有两个类path和pathcontainer。(方便大家回想,我大致重新将需求罗列了一下,严格定义可以看指导书) 1 基础函数补充 2 /...

  • 面向对象设计与构造:JML规格单元作业总结

    面向对象设计与构造:JML规格单元作业总结 第一部分:JML语言理论基础 JML语言是什么:对Java程序进行规格化设计的一种表示语言 使用JML语言有什么好处: 用逻辑严格的规格取代自然语言,照顾马龙的语文水平。一切挑战规则的行为必将受到严厉惩罚 代码维护性高,让大牛的代码不再晦涩,让轮子制造机无机可乘 JML(Level 0)语法 单行注释 //@ public model non...

Global site tag (gtag.js) - Google Analytics