Kivy 中文教程 实例入门 简易画板 (Simple Paint App):3. 随机颜色及清除按钮

1. 随机颜色

通过前面的教程,咪博士已经带大家实现了画板的绘图功能。但是,现在画板只能画出黄色的图案,还十分单调,接下来咪博士就教大家,如何使用随机颜色,让画板变得五彩斑斓。

改进后的代码如下:

from random import random
 
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.graphics import Color, Ellipse, Line
 
 
class MyPaintWidget(Widget):
    def on_touch_down(self, touch):
        color = (random(), random(), random())
        with self.canvas:
            Color(*color)
            d = 30.
            Ellipse(pos=(touch.x - d / 2, touch.y - d / 2), size=(d, d))
            touch.ud['line'] = Line(points=(touch.x, touch.y))
 
    def on_touch_move(self, touch):
        touch.ud['line'].points += [touch.x, touch.y]
 
 
class MyPaintApp(App):
    def build(self):
        return MyPaintWidget()
 
 
if __name__ == '__main__':
    MyPaintApp().run()

试试看。怎么样?是不是好看多了呢?

image

第 1 行 from random import random 我们导入了随机函数 random,它可以产生 [0, 1) 之间的随机数

第 10 行 color = ( random () , random () , random () ) 通过调用 random 函数,产生随机的 RGB 分量,存储在元组 color 中。后面(第 12 行),我们会用随机的 RGB 分量合成随机的颜色。注意,第 10 行的代码位于 on_touch_down 函数内。所以,用户每次点击鼠标的时候,都会生成新的随机 RGB 分量。

第12 行,用前面(第 10 行)产生的随机 RGB 分量生成随机颜色 color。函数 Color 需要授受 3 个参数(分别表示 RGB 的 3 个分量)。这里的 Color (* color) 表示将元组 color 解包,传递给函数 Color。由于元组 color 包含 3 个元素,所以它解包之后,就产生了 3 个随机数,而这 3 个随机数恰好可以做为 RGB 的 3 个分量传递给函数 Color。

不过,由于现在的颜色是完全随机的,程序有时候会产生一些比较暗的颜色,在黑色的画板背景上显示效果不是很好。我们可以进一步限制随机颜色的取值范围,让它只取一些比较鲜亮的颜色。

from random import random
 
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.graphics import Color, Ellipse, Line
 
 
class MyPaintWidget(Widget):
    def on_touch_down(self, touch):
        color = (random(), 1, 1)
        with self.canvas:
            Color(*color, mode='hsv')
            d = 30.
            Ellipse(pos=(touch.x - d / 2, touch.y - d / 2), size=(d, d))
            touch.ud['line'] = Line(points=(touch.x, touch.y))
 
    def on_touch_move(self, touch):
        touch.ud['line'].points += [touch.x, touch.y]
 
 
class MyPaintApp(App):
    def build(self):
        return MyPaintWidget()
 
 
if __name__ == '__main__':
    MyPaintApp().run()

试试调整后的代码。哇!顿时鲜艳多了。

image

第 10 行 color = ( random () , 1 , 1 ) 我们将随机颜色的后 2 个分量固定为 1,只让第 1 个分量随机变化。

第 12 行 Color (* color , mode='hsv') 我们用 mode=’hsv’,指定颜色采用 HSV 模式,而不是先前默认的 RGB 模式。HSV 色彩模式的 3 个参数,分别代表 色调(Hue)、饱和度(Saturation)、明度(Value)。色调(Hue) 表示不同的色调(色彩的种类和名称);饱和度(Saturation) 越高,则颜色越深、越艳;明度(Value)表示颜色的明度程度。由于采用了 HSV 色彩模式,第 10 行代码产生的随机元组 color 的含义也要相应发生变化了。color 中的第 1 参数是一个随机数,表示随机选择不同的色彩种类;第 2 个参数,固定为 1,表示取最大的饱和度,即将颜色调到最深、最艳;第 3 个参数,也固定取 1,表示将颜色调到最亮。这样改进之后,程序就只会生成明亮的随机颜色了。

2. 清除按钮

最后,我们要在画板上添加一个清除按钮,这样用户不必重启程序,就能将画板清空,并绘制新的图形。

完整代码如下:

from random import random
 
from kivy.app import App
from kivy.uix.widget import Widget
from kivy.uix.button import Button
from kivy.graphics import Color, Ellipse, Line
 
 
class MyPaintWidget(Widget):
    def on_touch_down(self, touch):
        color = (random(), 1, 1)
        with self.canvas:
            Color(*color, mode='hsv')
            d = 30.
            Ellipse(pos=(touch.x - d / 2, touch.y - d / 2), size=(d, d))
            touch.ud['line'] = Line(points=(touch.x, touch.y))
 
    def on_touch_move(self, touch):
        touch.ud['line'].points += [touch.x, touch.y]
 
 
class MyPaintApp(App):
    def build(self):
        parent = Widget()
        self.painter = MyPaintWidget()
        clearbtn = Button(text='Clear')
        clearbtn.bind(on_release=self.clear_canvas)
        parent.add_widget(self.painter)
        parent.add_widget(clearbtn)
        return parent
 
    def clear_canvas(self, obj):
        self.painter.canvas.clear()
 
 
if __name__ == '__main__':
    MyPaintApp().run()

点击左下角的清除(Clear)按钮,可以将画板的内容清空。

image

第 5 行 from kivy.uix.button import Button 导入 Button 类。窗体左下角的清除 (Clear) 按钮,便是 Button 类的实例。

第 24 行 parent = Widget () 创建一个空的窗口部件 (Widget)。后面我们会将自定义窗口部件(画板 MyPaintWidget)以及清除按钮(Button)添加到 parent 上。注意:Kivy 中进行窗口部件编排的标准做法是使用布局( layout)。咪博士这里用的是比较便捷(但不规范)的方法,为的是让大家快速完成简易画板这个项目。关于 Kivy 中布局(layout)的使用,咪博士将在其他的教程中专门讲解。

第25 行 self.painter = MyPaintWidget() 创建自定义窗口部件对象,并赋值给变量 self.painter。因为,后面我们还要在别的函数中引用它。

第 26 行 clearbtn = Button (text='Clear') 创建清除按钮对象,将按钮的文字设置为 Clear,并赋值给变量 clearbtn。

第 27 行 clearbtn.bind (on_release=self.clear_canvas) 将清除按钮的 on_release 事件绑定 (bind) 到 self.clear_canvas 方法(第 32, 33 行)。这样,当用户按下并释放清除按钮时,将触发按钮的 on_release 事件,然后调用该事件所绑定的 self.clear_canvas 方法,执行清除画板的动作。

第 28, 29 行,将自定义窗口部件对象(self.painter)和清除按钮对象(clearbtn)添加到 parent 窗口部件中。

第 30 行 return parent 返回 parent 窗口部件。注意,此时的 parent 已经包含了自定义窗口部件对象(self.painter)和清除按钮对象(clearbtn)。

第 32, 33 行,是用户按下并释放清除按钮时触发的回调函数。清除画板的功能正是通过第 33 行 self.painter.canvas.clear() 实现的。

好啦,到此为止 Kivy 简易画板的项目就全部完成啦。请关注咪博士后续更加精彩的 Kivy 教程。

原文链接:http://www.ipaomi.com/2017/11/20/kivy-中文教程-实例入门-简易画板-simple-paint-app:3-随机颜色及清/

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,298评论 4 360
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,701评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 107,078评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,687评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,018评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,410评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,729评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,412评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,124评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,379评论 2 242
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,903评论 1 257
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,268评论 2 251
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,894评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,014评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,770评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,435评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,312评论 2 260

推荐阅读更多精彩内容