# 图形

### 画布简介[¶](https://kivy.org/doc/stable/guide/graphics.html#introduction-to-canvas)

Widgets 图形表示是使用画布呈现的，您可以将其视为无限的绘图板或一组绘图指令。您可以将许多说明应用（添加）到您的画布上，但主要有两个变体：

* [`context instructions`](https://kivy.org/doc/stable/api-kivy.graphics.context_instructions.html#module-kivy.graphics.context_instructions)
* [`vertex instructions`](https://kivy.org/doc/stable/api-kivy.graphics.vertex_instructions.html#module-kivy.graphics.vertex_instructions)

上下文指令不绘制任何内容，但它们会更改顶点指令的结果。

画布可以包含两个指令子集。他们是 [`canvas.before`](https://kivy.org/doc/stable/api-kivy.graphics.html#kivy.graphics.Canvas.before)和[`canvas.after`](https://kivy.org/doc/stable/api-kivy.graphics.html#kivy.graphics.Canvas.after)指令组。这些组中的指令将`canvas`分别在该组之前和之后执行。这意味着它们将出现在它们的下方（之前执行）和上方（之后执行）。在用户访问它们之前，不会创建这些组。

要向小部件添加画布指令，您可以使用画布上下文：

```
class MyWidget(Widget):
    def __init__(self, **kwargs):
        super(MyWidget, self).__init__(**kwargs)
        with self.canvas:
            # add your instruction for main canvas here

        with self.canvas.before:
            # you can use this to add instructions rendered before

        with self.canvas.after:
            # you can use this to add instructions rendered after
```

### 上下文说明[¶](https://kivy.org/doc/stable/guide/graphics.html#context-instructions)

上下文指令操作 opengl 上下文。您可以旋转、平移和缩放画布。您还可以附加纹理或更改绘图颜色。这个是最常用的，但其他的也很有用：

```
with self.canvas.before:
    Color(1, 0, .4, mode='rgb')
```

### 绘图说明[¶](https://kivy.org/doc/stable/guide/graphics.html#drawing-instructions)

绘图指令范围从非常简单的指令，如绘制直线或多边形，到更复杂的指令，如网格或贝塞尔曲线：

```
with self.canvas:
   # draw a line using the default color
   Line(points=(x1, y1, x2, y2, x3, y3))

   # lets draw a semi-transparent red square
   Color(1, 0, 0, .5, mode='rgba')
   Rectangle(pos=self.pos, size=self.size)
```

### 操作指令[¶](https://kivy.org/doc/stable/guide/graphics.html#manipulating-instructions)

有时您想要更新或删除已添加到画布的说明。这可以根据您的需要以多种方式完成：

您可以参考您的说明并更新它们：

```
class MyWidget(Widget):
    def __init__(self, **kwargs):
        super(MyWidget, self).__init__(**kwargs)
        with self.canvas:
            self.rect = Rectangle(pos=self.pos, size=self.size)

        self.bind(pos=self.update_rect)
        self.bind(size=self.update_rect)

    def update_rect(self, *args):
        self.rect.pos = self.pos
        self.rect.size = self.size
```

或者您可以清理画布并重新开始：

```
class MyWidget(Widget):
    def __init__(self, **kwargs):
        super(MyWidget, self).__init__(**kwargs)
        self.draw_my_stuff()

        self.bind(pos=self.draw_my_stuff)
        self.bind(size=self.draw_my_stuff)

    def draw_my_stuff(self, *args):
        self.canvas.clear()

        with self.canvas:
            self.rect = Rectangle(pos=self.pos, size=self.size)
```

请注意，更新指令被认为是最佳实践，因为它涉及更少的开销并避免创建新指令。

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://kivy-tutorial-translation-chines.gitbook.io/kivy-jiao-cheng-fan-yi/bian-cheng-zhi-nan/tu-xing.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.