doc: update to lastest
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Index | Auto.js 3.0.0 文档</title>
|
||||
<title>Canvas | Auto.js 3.0.0 文档</title>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic">
|
||||
<link rel="stylesheet" href="assets/style.css">
|
||||
<link rel="stylesheet" href="assets/sh.css">
|
||||
@@ -73,11 +73,34 @@
|
||||
|
||||
<div id="toc">
|
||||
<h2>目录</h2>
|
||||
|
||||
<ul>
|
||||
<li><span class="stability_undefined"><a href="#canvas_canvas">Canvas</a></span></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="apicontent">
|
||||
|
||||
<h1>Canvas<span><a class="mark" href="#canvas_canvas" id="canvas_canvas">#</a></span></h1>
|
||||
<p>canvas提供了使用画布进行2D画图的支持,可用于简单的小游戏开发或者图片编辑。使用canvas可以轻松地在一张图片或一个界面上绘制各种线与图形。</p>
|
||||
<p>canvas的坐标系为平面直角坐标系,以屏幕左上角为原点,屏幕上边为x轴正方向,屏幕左边为y轴正方向。例如分辨率为1920*1080的屏幕上,画一条从屏幕左上角到屏幕右下角的线段为:</p>
|
||||
<pre><code>canvas.drawLine(0, 0, 1080, 1920, paint);
|
||||
</code></pre><p>canvas的绘制依赖于画笔Paint, 通过设置画笔的粗细、颜色、填充等可以改变绘制出来的图形。例如绘制一个红色实心正方形为:</p>
|
||||
<pre><code>var paint = new Paint();
|
||||
//设置画笔为填充,则绘制出来的图形都是实心的
|
||||
paint.setStyle(Paint.STYLE.FILL);
|
||||
//设置画笔颜色为红色
|
||||
paint.setColor(colors.RED);
|
||||
//绘制一个从坐标(0, 0)到坐标(100, 100)的正方形
|
||||
canvas.drawRect(0, 0, 100, 100, paint);
|
||||
</code></pre><p>如果要绘制正方形的边框,则通过设置画笔的Style来实现:</p>
|
||||
<pre><code>var paint = new Paint();
|
||||
//设置画笔为描边,则绘制出来的图形都是轮廓
|
||||
paint.setStyle(Paint.STYLE.STROKE);
|
||||
//设置画笔颜色为红色
|
||||
paint.setColor(colors.RED);
|
||||
//绘制一个从坐标(0, 0)到坐标(100, 100)的正方形
|
||||
canvas.drawRect(0, 0, 100, 100, paint);
|
||||
</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user