Kivy - 绘图应用程序

在本节中，我们将学习开发一个简单的 Kivy 应用程序，该应用程序允许用户通过拖动鼠标按钮来绘制不同尺寸和颜色的填充矩形和圆形（椭圆）。

用户从目标矩形/椭圆的左上角拖动鼠标指针到右下角。以下代码开发中使用的方法是在 touch_down 事件和 touch_up 事件中捕获鼠标坐标。因此，我们从 App 类 build() 方法中的这段代码开始：

def build(self):
   self.w= Widget()
   self.w.bind(on_touch_down=self.on_touch_down)
   self.w.bind(on_touch_up=self.on_touch_up)
   return(self.w)

我们希望允许用户选择绘制矩形或圆形。需要添加三个切换按钮来选择绘制哪种形状或清除画布。因此，我们将 App 窗口的布局更改为箱式布局，在顶部添加 Widget 对象，并在其下方放置三个按钮。

lo = BoxLayout(orientation='vertical')

self.w = Widget()
self.w.bind(on_touch_down=self.on_touch_down)
self.w.bind(on_touch_up=self.on_touch_up)
lo.add_widget(self.w)

hlo = BoxLayout(orientation='horizontal', size_hint=(1, .1))

self.b2 = ToggleButton(text='Circle', group='mode')
self.b1 = ToggleButton(text='Rectangle', state='down', group='mode')
self.b3 = ToggleButton(text='Clear', group='mode')

hlo.add_widget(self.b1)
hlo.add_widget(self.b2)
hlo.add_widget(self.b3)
lo.add_widget(hlo)

return lo

要绘制所需的形状，我们需要在触摸按下和触摸抬起时捕获鼠标位置。

on_touch_down() 方法很简单：

def on_touch_down(self, *args):
   self.td = args[1].pos

所有处理都在 on_touch_up() 方法中进行。捕获的按下事件和抬起事件的坐标用于计算矩形或圆形的尺寸。

对于圆形，x 半径、y 半径和中心计算如下：

self.tu=args[1].pos
   xr = (self.tu[0]-self.td[0])/2
   yr = (self.td[1]-self.tu[1])/2
   c=(self.td[0]+xr, self.td[1]-yr)

我们需要宽度和高度以及绘制矩形的左上角坐标。self.td 元组给出左上角点，xr*2 给出宽度，yr*2 给出高度。

形状绘制在小部件画布上。我们选择随机颜色进行绘制。按下按钮的 text 属性告诉我们要绘制的形状：

color = (random(), random(), random())
with self.w.canvas:
   Color(*color)
   if self.btn=='Rectangle':
      Rectangle(pos=self.td, size=(xr*2,yr*2))
   if self.btn=='Circle':
      Ellipse(pos=(c), size=(xr,yr))

三个切换按钮绑定到一个方法。如果标题是“清除”，则清除小部件画布。

def clear_canvas(self, instance, value):
   self.btn = instance.text
   self.press = True
   if value == 'down' and self.btn == 'Clear':
      self.w.canvas.clear()
   return True

示例

应用程序的完整代码如下所示：

from random import random
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.graphics import Color, Ellipse, Line, Rectangle
from kivy.uix.togglebutton import ToggleButton
from kivy.uix.boxlayout import BoxLayout
from kivy.core.window import Window

Window.size = (720, 400)

class MyPaintApp(App):
   def clear_canvas(self, instance, value):
      self.btn = instance.text
      self.press = True
      if value == 'down' and self.btn == 'Clear':
         self.w.canvas.clear()
      return True

   def on_touch_down(self, *args):
      self.td = args[1].pos

   def on_touch_up(self, *args):
      if self.press == True:
         self.press = False
         return True
      self.tu = args[1].pos
      xr = (self.tu[0] - self.td[0]) / 2
      yr = (self.td[1] - self.tu[1]) / 2
      c = (self.td[0] + xr, self.td[1] - yr)
      color = (random(), random(), random())
      with self.w.canvas:
         Color(*color)
         if self.btn == 'Rectangle':
            Rectangle(pos=self.td, size=(xr * 2, yr * 2))
         if self.btn == 'Circle':
            Ellipse(pos=(c), size=(xr, yr))

   def build(self):
      self.press = False
      self.btn = 'Rectangle'
      
      lo = BoxLayout(orientation='vertical')
      
      self.w = Widget()
      self.w.bind(on_touch_down=self.on_touch_down)
      self.w.bind(on_touch_up=self.on_touch_up)
      lo.add_widget(self.w)
      
      hlo = BoxLayout(orientation='horizontal', size_hint=(1, .1))
      
      self.b2 = ToggleButton(text='Circle', group='mode')
      self.b1 = ToggleButton(text='Rectangle', state='down', group='mode')
      self.b3 = ToggleButton(text='Clear', group='mode')
      self.b1.bind(state=self.clear_canvas)
      self.b2.bind(state=self.clear_canvas)
      self.b3.bind(state=self.clear_canvas)
      
      hlo.add_widget(self.b1)
      hlo.add_widget(self.b2)
      hlo.add_widget(self.b3)
      lo.add_widget(hlo)
      
      return lo
      
MyPaintApp().run()

输出

运行以上代码。选择您要绘制的形状。从左上角拖动鼠标到右下角。矩形/圆形以随机颜色绘制在不同位置。

点击“清除”按钮清除画布上的图形。

打印页面