Kivy - SVGs

更新于 2024/6/13 10:47:56

Kivy 框架支持显示 SVG 文件，尽管目前它仍处于高度实验阶段。在计算机图形学中，SVG 代表可缩放矢量图形，这是 W3 联盟定义的一种用于编码图像数据的标准。

PNG 和 JPG 等图像格式基于光栅图形，其中图像数据以位图的形式存储，位图是颜色和像素位置的网格。这种格式的缺点是，如果放大图像，图像会在某个点之后开始模糊。

另一方面，矢量图形图像以数学形式存储为一系列 XML 指令，使用这些指令在屏幕上绘制图像。这些指令告诉查看程序如何在屏幕上"绘制"图像。由于 SVG 文件与分辨率无关，因此可以以任何尺寸进行绘制。它们可以放大或缩小，而不会降低质量或清晰度。

Kivy 库在"kivy.graphics.svg"模块中定义 Svg 类。要在任何小部件的画布上绘制 SVG 图像，我们可以使用以下语法 −

from kivy.graphics.svg import Svg
with widget.canvas:
	svg = Svg("test.svg")

Svg 类具有以下属性 −

anchor_x − 用于缩放和旋转的水平锚点位置。默认为 0。值 0、1 和 2 分别对应"左"、"中"和"右"。
anchor_y − 用于缩放和旋转的垂直锚点位置。默认为 0。值 0、1 和 2 分别对应"左"、"中"和"右"。
color − 指定"currentColor"的 SvgElements 使用的默认颜色
height − "double"
source − 要加载的 SVG 文件名/源。
width − 'double'

示例

以下程序使用"kv"脚本加载 Scatter 小部件。"svg"对象放置在 GridLayout 中。将文件的名称作为其源属性。以下是"kv"文件 −

<SvgWidget>:
   do_rotation: True
<FloatLayout>:
   canvas.before:
      Color:
         rgb: (1, 1, 1)
      Rectangle:
         pos: self.pos
         size: self.size

Kivy App 类的 Python 代码−

from kivy.uix.scatter import Scatter
from kivy.app import App
from kivy.graphics.svg import Svg
from kivy.uix.gridlayout import GridLayout
from kivy.lang import Builder
from kivy.core.window import Window

Window.size = (720,400)

class SvgWidget(Scatter):
   def __init__(self, filename):
      super(SvgWidget, self).__init__()
      with self.canvas:
         svg = Svg(source=filename)
      self.size = Window.width, Window.height
      
class SvgDemoApp(App):
   def build(self):
      self.root = GridLayout(cols=1)
      
      filename = "ship.svg"
      svg = SvgWidget(filename)

      self.root.add_widget(svg)
      svg.scale = 4

SvgDemoApp().run()