zoukankan      html  css  js  c++  java
  • Kivy crash 中文教程 实例入门 1. 第1个应用 Kivy App (Making a simple App)

    1.  空白窗口

    在 PyCharm 中创建一个名为 TutorialApp 的项目,然后在该项目中新建了个名为 tutorial_app.py 的 Python 源文件,在 PyCharm 的代码编辑器中,输入下面的代码:

    1 from kivy.app import App
    2  
    3 class TutorialApp(App):
    4     pass
    5  
    6 if __name__ == "__main__":
    7     TutorialApp().run()

    虽然只有寥寥数行代码,但这已经是一个可以运行的 Kivy 应用了!

    运行这段代码,将显示出一个黑色的窗口。虽然简单,但已经是一个标准的窗口了。你可以移动窗口、改变窗口大小、最大化、最小化,以及关闭窗口。

    第 1 行 from kivy.app import App 导入 kivy 的 App 类,它是所有 kivy 应用的基类。

    我们继承 App 类,派生出TutorialApp 类(第 3, 4 行)。我们还没有给 TutorialApp 添加任何方法,但它从 App 类中继承了 kivy 应用最基本的方法,如创建窗口、设置窗口的大小和位置等。

    最后,要让 kivy 应用真正跑起来,我们需要创建 TutorialApp 对象,并调用它的 run 方法(第 7 行)。

    2. 添加控件 (widget)

    一个光秃秃的窗口是没啥用的,我们还得在窗口上放置一些控件(widget)。Kivy 内置了丰富的控件,如按钮 (button), 复选框 (checkbox), 标签 (label), 输入框 (textinput), 滚动容器 (scrollable container) 等。

    这里咱们不妨先试试比较简单的按钮控件 (button)。

    1 from kivy.app import App
    2 from kivy.uix.button import Button
    3  
    4 class TutorialApp(App):
    5     def build(self):
    6         return Button()
    7  
    8 if __name__ == "__main__":
    9     TutorialApp().run()

    运行修改后的程序,乍看上去,似乎是窗口的背景从黑色变成了灰色。实际上是整个窗口被一个巨大的按钮填满了,不信你用鼠标点击试试?看到背景颜色变化了吗?这表明,你点击的是一个巨大的按钮,而不是窗口本身。

    第 2 行 from kivy.uix.button import Button 导入 kivy 的按钮控件 Button。

    第 5, 6 行,我们实现了 TutorialApp 类的 build 方法(继承自 App 类)。build 方法返回一个按钮 (Button) 对象。build 方法返回的控件,在 Kivy 中,称之为“根控件” (root widget)。Kivy 将自动缩放根控件,让它填满整个窗口。这就是为什么我们会得到一个充满整个窗口的巨型按钮。

    我们还可以在创建按钮时传递参数,让它变得更生动一些。

    1 from kivy.app import App
    2 from kivy.uix.button import Button
    3  
    4 class TutorialApp(App):
    5     def build(self):
    6         return Button(text='iPaoMi', background_color=(0, 0, 1, 1), font_size=150)
    7  
    8 if __name__ == "__main__":
    9     TutorialApp().run()

    例如,我们可以将按钮的背景色设置为蓝色,并在按钮上以 150 的字号,显示文字 iPaoMi (第 6 行)。其中,参数 background_color 接受的 4 元组,分别表示 RGBA 颜色的 4 个分量。

    3. 多点触控

    现在,我们的应用还非常地简单,几乎没有什么交互。而且,其他许多 GUI 库,例如 QT, GTK 等也可以很容易地做出类似的效果,实在看不出 Kivy 究竟有何过人之处。接下来,咪博士将向大家展示如何快速实现多点触控的操作,你将看到为什么我们说 Kivy 是为移动应用而生。

    这一节中,我们将会用到 2 个 Kivy 控件:Scatter 和 Label。

    • Scatter 是实现多点触控的关键,它可以方便地实现移动、缩放,以及旋转的操作
    • Label 是用来显示文字的,我们将它放在 Scatter 上,从而实现对文字的移动、缩放和旋转的操作

    最终,我们修改后的代码如下:

     1 from kivy.app import App
     2 from kivy.uix.scatter import Scatter
     3 from kivy.uix.label import Label
     4  
     5 class TutorialApp(App):
     6     def build(self):
     7         s = Scatter()
     8         l = Label(text='iPaoMi', font_size=150)
     9         s.add_widget(l)
    10         return s
    11  
    12 if __name__ == "__main__":
    13     TutorialApp().run()

    运行程序,我们看到窗口左下角显示了一些字符串。

    我们可以用鼠标左键把左下角的字符串拖动到窗口中央。

    我们可以用鼠标右键来模拟手机屏幕上多点触控的操作。用鼠标右键在字符串上点击,会显示一个红色的小圆点,表示一个触控点的位置。我们在字符串的 2 个不同位置,用鼠标右键点击,形成 2 个触控点。然后,尝试用鼠标左键去拖动字符串,你会发现字符串发生了旋转和缩放!

    最后,让咪博士为大家讲解一下代码吧。

    第 2, 3, 4 行分别导入 Scatter 和 Label 控件

    第 7, 8 行分别创建了 Scatter 和 Label 控件实例

    第 9 行  s.add_widget(l)  将 Label 控件实例添加到 Scatter 控件实例中。这样用户的操作直接影响 Scatter 控件,再由 Scatter 自动将这些影响作用到它内部的子控件(即 Label 控件)上。

    第 10 行 return s 将 Scatter 实例作为根控件返回。Kivy 会自动用根控件(Scatter 实例)填充整个窗口。

    Kivy 的设计中充分考虑了移动应用的交互,这是 Kivy 与其他 GUI 库 (如 QT, GTK)  最重要的区别。当然,用鼠标来模拟多点触控的操作显得很不自然。后面的教程中,咪博士将教大家,如何将 Kivy 应用打包并运行在手机上。届时,大家将真正见识到 Kivy 在移动应用开发中的威力。

    原文链接:http://www.ipaomi.com/2017/11/23/kivy-crash-中文教程-实例入门-1-第1个应用-kivy-app-making-a-simple-app/

  • 相关阅读:
    如何通过jQuery获取一个没有定高度的元素---------的自适应高度(offsetHeight的正确使用方法)
    jQuery插件之----缓冲运动
    jQuery插件学习基础
    javascript随机一个1-9的数字
    jQuery事件之鼠标事件
    枚举类的应用
    ConvertUtils.register(new DateConverter(null), java.util.Date.class)使用
    逆向工程不使用驼峰命名而保持字段中下划线
    mongoDB 的介绍
    eclipse 的版本及下载地址
  • 原文地址:https://www.cnblogs.com/ipaomi/p/7977837.html
Copyright © 2011-2022 走看看