用kivy学习制作简易调色画板app
制作一款简易的调色画板,要用到的知识:页面布局、ToggleButton、ToggleButtonBehavior、get_color_from_hex(兼容十六进制编码颜色);功能上要可以选择颜色,选择画笔线宽,可以清除画板。具体实现如下:
选建一个main.py文件,内容代码如下
from kivy.app import App
from kivy.graphics import Line,Color #引入绘图
from kivy.uix.widget import Widget #引入控件
from kivy.utils import get_color_from_hex #兼容十六进制颜色
from kivy.uix.behaviors import ToggleButtonBehavior #引入按钮开关行为
from kivy.uix.togglebutton import ToggleButton #引入开关按钮 class FrameToggleButton(ToggleButton):
#当前按钮添加边框
def do_press(self):
if self.state=='一般':
ToggleButtonBehavior.do_press(self) class DrawCanvasWidget(Widget): #布局类
def __init__(self,**kwargs):
super(DrawCanvasWidget, self).__init__(**kwargs)
#设置默认颜色
self.change_color(get_color_from_hex('#19caad'))
self.line_width=2 def on_touch_down(self, touch):
#触摸显示轨迹
if Widget.on_touch_down(self,touch):
return
with self.canvas:
touch.ud['current_line']=Line(points=(touch.x,touch.y),width=self.line_width) def on_touch_move(self, touch):
#连线画线
if 'current_line' in touch.ud:
touch.ud['current_line'].points+=(touch.x,touch.y) def change_color(self,new_color):
#调色选择画笔颜色
self.last_color=new_color
self.canvas.add(Color(*new_color)) def change_line_width(self,line_width='一般'):
#选择画笔线宽
self.line_width={'较细':1,'一般':2,'较粗':4}[line_width] def clear_canvas(self):
#清空画板
saved=self.children[:]
self.clear_widgets()
self.canvas.clear()
for widget in saved:
self.add_widget(widget)
self.change_color(self.last_color) class PaintApp(App): #继承App类
#实现App类的build()方法(继承自App类)
def build(self):
self.canvas_widget=DrawCanvasWidget()
return self.canvas_widget #返回根控件 if __name__=='__main__':
PaintApp().run()
再建一个paint.kv文件,内容代码如下:
#:import C kivy.utils.get_color_from_hex
#引入颜色转换16进制编码颜色的方法 <BottomColorButton@FrameToggleButton>:
group:'color'
background_normal:'images/radio_background_normal.png'
background_down:'images/radio_background_down.png'
border:(3,3,3,3)
on_release:app.canvas_widget.change_color(self.background_color) #触发事件 <BottomClearButton@FrameToggleButton>:
# group:'color'
background_normal:''
background_down:''
border:(3,3,3,3)
on_release:app.canvas_widget.clear_canvas() #触发事件 <LineWidthButton@FrameToggleButton>:
group:'line_width'
color:C('#2c3e50') #文字颜色
background_color:C('#ecf0f1') #背景颜色
background_normal:'images/radio_background_normal.png'
background_down:'images/radio_background_down.png'
border:(3,3,3,3)
on_release:app.canvas_widget.change_line_width(self.text) #触发事件 <DrawCanvasWidget>:
canvas.before:
Color:
rgba:[1,1,1,1]
Rectangle:
pos:self.pos
size:self.size BoxLayout:
orientation:'horizontal'
padding:2
spacing:2
x:0
top:root.top
size_hint:None,None
size:280,44 LineWidthButton:
text:'较细'
LineWidthButton:
text:'一般'
state:'down'
LineWidthButton:
text:'较粗' BottomClearButton:
font_size:15
bold:5
text:'清除画板'
background_color:1,0,0,1
# on_release:root.clear_canvas() #触发事件 BoxLayout: #添加一个布局
id:bottom_box #添加ID属性
orientation:'horizontal' #指定布局方向
padding:2 #设置间距
spacing:2 #设置间距
size:root.width,40 #设置大小
BottomColorButton:
background_color:C('#19caad')
state:'down'
BottomColorButton:
background_color:C('#8cc7b5')
BottomColorButton:
background_color:C('#a0ee1')
BottomColorButton:
background_color:C('#bee7e9')
BottomColorButton:
background_color:C('#beedc7')
BottomColorButton:
background_color:C('#d6d5b7')
BottomColorButton:
background_color:C('#d1ba74')
BottomColorButton:
background_color:C('#e6ceac')
BottomColorButton:
background_color:C('#ecad9e')
BottomColorButton:
background_color:C('#f4606c')
BottomColorButton:
background_color:C('#3498db')
BottomColorButton:
background_color:C('#1abc9c')
BottomColorButton:
background_color:C('#2ecc71')
BottomColorButton:
background_color:C('#f1c40f')
BottomColorButton:
background_color:C('#e67e22')
BottomColorButton:
background_color:C('#e74c3c')
BottomColorButton:
background_color:C('#9b59b6')
BottomColorButton:
background_color:C('#ecf0f1')
BottomColorButton:
background_color:C('#95a5a6')
BottomColorButton:
background_color:C('#000000')
BottomColorButton:
background_color:C('#f4606c')
源码内所用到的图片文件,可以点击下载源码,在源码内找到项目所需的图片文件。
用kivy学习制作简易调色画板app的更多相关文章
- Html学习_简易个人网页制作
应用学到的内容,制作简易个人网页 <!DOCTYPE html> <html> <head> <title>Jane.liu</title> ...
- kivy学习二:做一个查询所在地区身份证前6位的小软件
经过半个月的尝试,终于成功,记录下来备查! 做完之后发现有很多的问题没有解决,请大佬多批评指教! 强烈建议:学习KIVY的查看官方文档 需要用的知识: 1.字典的相关知识 2.kivy的下拉列表(Dr ...
- webAPP制作框架Ionic--构建APP侧边栏 底部选项卡 轮播图 加载动画
超好用的移动框架--Ionic Ionic是一个轻量的手机UI库,具有速度快,界面现代化.美观等特点. 为了解决其他一些UI库在手机上运行缓慢的问题,它直接放弃了IOS6和Android4.1以下的版 ...
- 免费IP代理池定时维护,封装通用爬虫工具类每次随机更新IP代理池跟UserAgent池,并制作简易流量爬虫
前言 我们之前的爬虫都是模拟成浏览器后直接爬取,并没有动态设置IP代理以及UserAgent标识,本文记录免费IP代理池定时维护,封装通用爬虫工具类每次随机更新IP代理池跟UserAgent池,并制作 ...
- 利用Unity3D制作简易2D计算器
利用Unity3D制作简易2D计算器 标签(空格分隔): uiniy3D 1. 操作流程 在unity3DD中创建一个新项目 注意选择是2D的(因为默认3D) 在Assets框右键新建C#脚本 在新建 ...
- 在iOS中实现一个简单的画板App
在这个随笔中,我们要为iPhone实现一个简单的画板App. 首先需要指出的是,这个demo中使用QuarzCore进行绘画,而不是OpenGL.这两个都可以实现类似的功能,区别是OpenGL更快,但 ...
- C#制作简易屏保(转)
C#制作简易屏保[原创] 原始网址: http://www.cnblogs.com/drizzlecrj/archive/2006/10/06/522182.html 2006-10-06 16:25 ...
- 【百度地图API】——如何用label制作简易的房产标签
原文:[百度地图API]--如何用label制作简易的房产标签 摘要: 最近,API爱好者们纷纷说,自定义marker太复杂了!不仅定义复杂,连所有的dom事件都要自己重新定义.有没有快速简易创建房产 ...
- Swift 中使用 SwiftyJSON 制作一个比特币价格 APP
Swift 中处理 JSON 数据有很多种方式,可以使用原生的 NSJSONSerialization,也可以使用很多第三方库.原生的 NSJSONSerialization 方式这篇文章中介绍过.这 ...
随机推荐
- centos Gitlab AD 集成
简述 Gitlab支持集成LDAP用户认证系统.兼容包括Microsoft Active Directory, Apple Open Directory, Open LDAP, 与389 Server ...
- jvm代码热替换过程中异常
BTrace java.lang.NoClassDefFoundError: javax/xml/bind/JAXBException 具体如下: 1. 信这个问题很多小伙伴已经遇到了,这是在你的jd ...
- mysql中的条件语句case when/if函数
主要知识点为case函数,if函数,ifnull函数,elt函数几部分,主要用于mysql语句中的逻辑判断 待操作的表如下: p.p1 { margin: 0; font: 16px Menlo; c ...
- ESP32使用SPIFFS文件系统笔记
基于ESP-IDF4.1 1 #include <stdio.h> 2 #include <string.h> 3 #include <sys/unistd.h> ...
- YAOI Round #7 题解
前言 比赛链接: Div.1 : http://47.110.12.131:9016/contest/16 Div.2 : http://47.110.12.131:9016/contest/15 D ...
- 【spring源码系列】之【Bean的循环依赖】
希望之光永远向着目标清晰的人敞开. 1. 循环依赖概述 循环依赖通俗讲就是循环引用,指两个或两个以上对象的bean相互引用对方,A依赖于B,B依赖于A,最终形成一个闭环. Spring循环依赖的场景有 ...
- Pytorch系列:(八)学习率调整方法
学习率的调整会对网络模型的训练造成巨大的影响,本文总结了pytorch自带的学习率调整函数,以及其使用方法. 设置网络固定学习率 设置固定学习率的方法有两种,第一种是直接设置一些学习率,网络从头到尾都 ...
- Markdown 样式美化大全
Markdown 样式大全 目录 Markdown 样式大全 1. 键盘 2. 路径 3. 彩色字体背景 4. 折叠 5. 锚点链接 原生锚点1 原生锚点2 Hello Hello 6. 待办列表 7 ...
- Centos 7 配置阿里云 yum 源
Centos 7 配置阿里云 yum 源 一. 禁用 yum 插件 fastestmirror 修改插件的配置文件 cp /etc/yum/pluginconf.d/fastestmirror.con ...
- 【Java基础上】一、简述Java
一.简述Java Java是一种高级的面向对象的程序语言,在此处,不需要了解什么叫做面向对象,因为后面的文章中自然会谈到这方面的论述.那么,Java就是一个计算机的编程语言. 1.1 Java的历 ...