154 lines
4.2 KiB
Markdown
154 lines
4.2 KiB
Markdown
# Canvas
|
|
|
|
Canvas 是一个用 Go 语言实现的 2D 绘图库，提供类似于 HTML5 Canvas API 的功能。它允许你在 Go 程序中创建和操作图像，支持基本的绘图操作、变换、渐变和文本渲染。
|
|
|
|
## 功能特性
|
|
|
|
- 基本图形绘制：线条、矩形、圆形、路径
|
|
- 填充和描边操作
|
|
- 线性和径向渐变
|
|
- 文本渲染
|
|
- 变换操作：平移、旋转、缩放
|
|
- 状态保存和恢复
|
|
- 阴影效果
|
|
|
|
## 安装
|
|
|
|
```bash
|
|
go get github.com/yourusername/canvas
|
|
```
|
|
|
|
## 快速开始
|
|
|
|
以下是一个简单的示例，展示如何使用 Canvas 库创建一个包含矩形、圆形和文本的图像：
|
|
|
|
```go
|
|
package main
|
|
|
|
import (
|
|
"image/color"
|
|
"image/png"
|
|
"os"
|
|
|
|
"github.com/golang/freetype/truetype"
|
|
"golang.org/x/image/font/gofont/goregular"
|
|
"github.com/yourusername/canvas"
|
|
)
|
|
|
|
func main() {
|
|
// 创建一个300x200的画布
|
|
ctx := canvas.NewContext(300, 200)
|
|
|
|
// 设置背景色
|
|
ctx.SetFillColor(color.RGBA{240, 240, 240, 255})
|
|
ctx.FillRect(0, 0, 300, 200)
|
|
|
|
// 绘制矩形
|
|
ctx.SetFillColor(color.RGBA{200, 0, 0, 200})
|
|
ctx.FillRect(20, 20, 100, 80)
|
|
|
|
// 绘制圆形
|
|
ctx.BeginPath()
|
|
ctx.SetFillColor(color.RGBA{0, 0, 200, 200})
|
|
ctx.Arc(200, 60, 40, 0, 2*3.14159)
|
|
ctx.Fill()
|
|
|
|
// 创建线性渐变
|
|
gradient := canvas.NewLinearGradient(20, 120, 280, 180)
|
|
gradient.AddColorStop(0, color.RGBA{255, 0, 0, 255})
|
|
gradient.AddColorStop(0.5, color.RGBA{0, 255, 0, 255})
|
|
gradient.AddColorStop(1, color.RGBA{0, 0, 255, 255})
|
|
|
|
// 使用渐变填充矩形
|
|
ctx.SetFillStyle(gradient)
|
|
ctx.FillRect(20, 120, 260, 60)
|
|
|
|
// 加载字体
|
|
font, _ := truetype.Parse(goregular.TTF)
|
|
face := truetype.NewFace(font, &truetype.Options{Size: 20})
|
|
|
|
// 设置字体和文本属性
|
|
ctx.SetFont(face)
|
|
ctx.SetTextAlign("center")
|
|
ctx.SetTextBaseline("middle")
|
|
ctx.SetFillColor(color.RGBA{0, 0, 0, 255})
|
|
ctx.FillText("Canvas 示例", 150, 30)
|
|
|
|
// 保存为PNG图片
|
|
img := ctx.Image()
|
|
f, _ := os.Create("example.png")
|
|
defer f.Close()
|
|
png.Encode(f, img)
|
|
}
|
|
```
|
|
|
|
## API 参考
|
|
|
|
### 上下文创建
|
|
|
|
- `NewContext(width, height int) *Context` - 创建新的绘图上下文
|
|
|
|
### 路径操作
|
|
|
|
- `BeginPath()` - 开始新路径
|
|
- `MoveTo(x, y float64)` - 移动到指定位置
|
|
- `LineTo(x, y float64)` - 绘制线段到指定位置
|
|
- `Arc(x, y, radius, startAngle, endAngle float64)` - 绘制圆弧
|
|
- `Rect(x, y, width, height float64)` - 绘制矩形路径
|
|
- `ClosePath()` - 闭合路径
|
|
|
|
### 绘制操作
|
|
|
|
- `Fill()` - 填充当前路径
|
|
- `Stroke()` - 描边当前路径
|
|
- `FillRect(x, y, width, height float64)` - 填充矩形
|
|
- `StrokeRect(x, y, width, height float64)` - 描边矩形
|
|
- `ClearRect(x, y, width, height float64)` - 清除矩形区域
|
|
|
|
### 样式设置
|
|
|
|
- `SetFillStyle(style interface{})` - 设置填充样式
|
|
- `SetStrokeStyle(style interface{})` - 设置描边样式
|
|
- `SetFillColor(color color.Color)` - 设置填充颜色
|
|
- `SetStrokeColor(color color.Color)` - 设置描边颜色
|
|
- `SetLineWidth(width float64)` - 设置线宽
|
|
- `SetGlobalAlpha(alpha float64)` - 设置全局透明度
|
|
- `SetShadow(offsetX, offsetY, blur float64, color color.Color)` - 设置阴影
|
|
|
|
### 渐变
|
|
|
|
- `NewLinearGradient(x0, y0, x1, y1 float64) *LinearGradient` - 创建线性渐变
|
|
- `NewRadialGradient(x0, y0, r0, x1, y1, r1 float64) *RadialGradient` - 创建径向渐变
|
|
- `AddColorStop(offset float64, color color.Color)` - 添加渐变色标
|
|
|
|
### 文本操作
|
|
|
|
- `SetFont(face font.Face)` - 设置字体
|
|
- `SetTextAlign(align string)` - 设置文本对齐方式
|
|
- `SetTextBaseline(baseline string)` - 设置文本基线
|
|
- `FillText(text string, x, y float64)` - 绘制填充文本
|
|
- `StrokeText(text string, x, y float64)` - 绘制描边文本
|
|
- `MeasureText(text string) float64` - 测量文本宽度
|
|
|
|
### 变换操作
|
|
|
|
- `Save()` - 保存当前状态
|
|
- `Restore()` - 恢复上一个状态
|
|
- `Translate(x, y float64)` - 平移变换
|
|
- `Rotate(angle float64)` - 旋转变换
|
|
- `Scale(sx, sy float64)` - 缩放变换
|
|
- `Transform(a, b, c, d, e, f float64)` - 应用变换矩阵
|
|
- `SetTransform(a, b, c, d, e, f float64)` - 设置变换矩阵
|
|
|
|
### 图像操作
|
|
|
|
- `Image() *image.RGBA` - 获取底层图像
|
|
|
|
## 依赖
|
|
|
|
- `golang.org/x/image/font` - 用于文本渲染
|
|
- `github.com/golang/freetype/truetype` - 用于字体处理（示例中使用）
|
|
|
|
## 许可证
|
|
|
|
MIT |