先前发布大那个所谓的"HTML5"扩展严格说来还算不是"HTML5"。曲曲几行JS代码就自诩为HTML5扩展多少有些标题党的嫌疑。
而相比之下,本篇的主题canvas可以说算是真正的HTML5扩展了。canvas作为HTML5标准体系下的JavaScript API, 不仅被苹果系统自带的Safari所支持,也被UIWebView类所支持。
下面直接贴上新增类目canvas部分的源代码。
完整代码下载地址:https://github.com/duzixi/UIWebView-HTML5 (下载按钮在页面右下方,“Download ZIP” . 欢迎fork)
本篇博文首发地址:http://blog.csdn.net/duzixi
<pre name="code" class="objc">@interface UIWebView (Canvas)
/// 创建一个指定大小的画布
- (void)createCanvas:(NSString *)canvasId
width:(NSInteger)width
height:(NSInteger)height;
/// 在指定位置创建一个指定大小的画布
- (void)createCanvas:(NSString *)canvasId
width:(NSInteger)width
height:(NSInteger)height
x:(NSInteger)x
y:(NSInteger)y;
/// 绘制矩形填充 context.fillRect(x,y,width,height)
- (void)fillRectOnCanvas:(NSString *)canvasId
x:(NSInteger)x
y:(NSInteger)y
width:(NSInteger)width
height:(NSInteger)height
uicolor:(UIColor *)color;
/// 绘制矩形边框 context.strokeRect(x,y,width,height)
- (void)strokeRectOnCanvas:(NSString *)canvasId
x:(NSInteger)x
y:(NSInteger)y
width:(NSInteger)width
height:(NSInteger)height
uicolor:(UIColor *)color
lineWidth:(NSInteger)lineWidth;
/// 清除矩形区域 context.clearRect(x,y,width,height)
- (void)clearRectOnCanvas:(NSString *)canvasId
x:(NSInteger)x
y:(NSInteger)y
width:(NSInteger)width
height:(NSInteger) height;
/// 绘制圆弧填充 context.arc(x, y, radius, starAngle,endAngle, anticlockwise)
- (void)arcOnCanvas:(NSString *)canvasId
centerX:(NSInteger)x
centerY:(NSInteger)y
radius:(NSInteger)r
startAngle:(float)startAngle
endAngle:(float)endAngle
anticlockwise:(BOOL)anticlockwise
uicolor:(UIColor *)color;
/// 绘制一条线段 context.moveTo(x,y) context.lineTo(x,y)
- (void)lineOnCanvas:(NSString *)canvasId
x1:(NSInteger)x1
y1:(NSInteger)y1
x2:(NSInteger)x2
y2:(NSInteger)y2
uicolor:(UIColor *)color
lineWidth:(NSInteger)lineWidth;
/// 绘制一条折线
- (void)linesOnCanvas:(NSString *)canvasId