如何在Kivy（Python）中叠加2个布局？

Posted 2023-01-12

我正在尝试使用背景网格和顶层交互元素制作应用程序，我在通过python覆盖第二层时遇到问题，所以就像标题所说有没有办法在Kivy中覆盖2个或更多布局？

这就是我要找的东西

答案

Solution

将第一层/布局的opacity设置为0.5

Widget class » opacity

不透明度

小部件及其所有子节点的不透明度。

不透明度属性控制窗口小部件及其子窗口的不透明度。请注意，它是一个累积属性：该值乘以当前的全局不透明度，结果将应用于当前上下文颜色。

...

不透明度是NumericProperty，默认为1.0。

Kivy Graphics Line » points

要点：清单

格式中的点列表（x1，y1，x2，y2 ......）

获取/设置线的属性

警告

这将始终从新点列表重建整个图形。它可能非常昂贵的CPU。

Kivy Graphics Line » circle

圈

使用此属性可以构建圆，而无需计算点。您只能设置此属性，而不是获取它。

参数必须是（center_x，center_y，radius，angle_start，angle_end，segments）的元组：

• center_x和center_y代表圆的中心
• radius表示圆的半径
• （可选）angle_start和angle_end以度为单位。默认值为0和360。
• （可选）段是椭圆的精度。默认值是根据角度之间的范围计算的。

请注意，您可以自行关闭圆圈。

Example

main.py - 没有kv

from kivy.base import runTouchApp
from kivy.core.window import Window
from kivy.uix.screenmanager import Screen
from kivy.uix.boxlayout import BoxLayout
from kivy.graphics import Color, Line
from kivy.metrics import dp

Window.clearcolor = (1, 1, 1, 1)


class Overlay2Layouts(Screen):

    def __init__(self, **kwargs):
        super(Overlay2Layouts, self).__init__(**kwargs)
        self.size = Window.size

        layout1 = BoxLayout(opacity=0.5)
        with layout1.canvas:
            Color(1, 0, 0, 1)   # red colour
            Line(points=[self.center_x, self.height / 4, self.center_x, self.height * 3/4], width=dp(2))
            Line(points=[self.width * 3/ 4, self.center_y, self.width /4, self.center_y], width=dp(2))

        layout2 = BoxLayout()
        with layout2.canvas:
            Color(0, 0, 0, 1)   # black colour
            Line(circle=[self.center_x, self.center_y, 190], width=dp(2))

        self.add_widget(layout1)
        self.add_widget(layout2)


if __name__ == "__main__":
    runTouchApp(Overlay2Layouts())

main.py - 使用kv和Python

from kivy.lang import Builder
from kivy.base import runTouchApp
from kivy.core.window import Window

Window.clearcolor = (1, 1, 1, 1)

runTouchApp(Builder.load_string('''
#:kivy 1.11.0

Screen:
    BoxLayout:
        opacity: 0.5
        canvas.before:
            Color:
                rgba: 1, 0, 0, 1
            Line:
                width: dp(2.)
                points: [self.center_x, self.height / 4, self.center_x, self.height * 3/4]
            Line:
                width: dp(2.)
                points: [root.width * 3/ 4, self.center_y, root.width /4, self.center_y]
    BoxLayout:
        canvas.before:
            Color:
                rgba: 1, 0, 0, 1
            Line:
                width: dp(2.)
                circle: (root.center_x, root.center_y, 190)

'''))

Output

另一答案

为了补充python中的答案，当窗口改变大小时，叠加层没有调整大小，所以这是我的解决方案：

import kivy
from kivy.app import App
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.gridlayout import GridLayout
from kivy.graphics import Color, Line, Ellipse, Rectangle
from kivy.metrics import dp


class RootWidget(BoxLayout):

    def __init__(self, *args, **kwargs):
        BoxLayout.__init__(self, *args, **kwargs)
        self.bind(pos=self.draw)
        self.bind(size=self.draw)
        self.layout1 = BoxLayout(opacity=0.3)
        self.layout2 = BoxLayout()
        self.add_widget(self.layout1)
        self.add_widget(self.layout2)

    def draw(self, *args):
        with self.canvas.before:
            Color(1,1,.5,1)
            self.bg = Rectangle(pos=self.pos, size=self.size)
        self.layout1.canvas.clear()
        with self.layout1.canvas:
            Color(1, 0, 0, 1)   # red colour
            Line(points=[self.center_x, self.height / 4, self.center_x, self.height * 3/4], width=dp(2))
            Line(points=[self.width * 3/ 4, self.center_y, self.width /4, self.center_y], width=dp(2))
        self.layout2.canvas.clear()
        with self.layout2.canvas:
            Color(0, 0, 0, 1)   # black colour
            Line(circle=[self.center_x, self.center_y, 190], width=dp(2))


class Overlays_3(App):
    title = "Overlays_3"

    def build(self):
        return RootWidget()


if __name__ == "__main__":
    Overlays_3().run()