无法使我的剑形布局正确定位

Question

我有以下.kv代码：

<MainWindow>:

    id: main
    name: "main"

    canvas.before:
        Color:
            rgba: 0.2078, 0.23529, 0.3137, 1
        Rectangle:
            pos: self.pos
            size: self.size

    FloatLayout:
        id:float

        Label:
            canvas.before:
                Color:
                    rgba: 0.164, 0.2, 0.2666, 1
                Rectangle:
                    pos: self.pos
                    size: self.size
            text: "Main Header"
            halign: 'center'
            font_name: 'Roboto'
            font_size: 45
            text_size: self.width, None
            size_hint: 0.6, 0.1
            pos_hint: {"x":0.005, "top":0.985}

        Label:
            canvas.before:
                Color:
                    rgba: 0.164, 0.2, 0.2666, 1
                Rectangle:
                    pos: self.pos
                    size: self.size
            text: "Main Page"
            halign: 'center'
            font_name: 'Roboto'
            font_size: 40
            text_size: self.width, None
            size_hint: 0.25, 0.1
            pos_hint: {"x":0.61, "top":0.985}

        Label:
            canvas.before:
                Color:
                    rgba: 0.164, 0.2, 0.2666, 1
                Rectangle:
                    pos: self.pos
                    size: self.size
            text: ""
            halign: 'center'
            font_name: 'Roboto'
            font_size: 25
            text_size: self.width, None
            size_hint: 0.13, 0.1
            pos_hint: {"x":0.865, "top":0.985}

    RelativeLayout:
        id: relative

        canvas.before:
            Color:
                rgba: 0.164, 0.2, 0.2666, 1
            Rectangle:
                size: relative.size
                pos: 0, 0


        size_hint: 0.99, 0.7
        pos_hint: {"x": 0.005, "top": 0.845}



        KivyCamera:
            id: cam1
            stream: "rtsp://my-stream-address"

            pos_hint: {"x":-0.415, "y":0.34}
            size: 320, 240

            canvas:

                Color:
                    rgba: 1, 1, 1, 1
                Line:
                    points: cam1.x, cam1.y, cam1.x+320, cam1.y+240
                Line:
                    points: cam1.x, cam1.y+240, cam1.x+320, cam1.y

            Label:
                id: Overlay
                color: 1, 1, 1, 1
                text: "This is an overlay"
                pos_hint:{"x":0, "y":0}
                size_hint: 1,1

和.py：

from threading import Thread

import cv2
import time
from kivy.app import App
from kivy.clock import Clock
from kivy.config import Config
from kivy.core.text import LabelBase
from kivy.graphics.texture import Texture
from kivy.lang import Builder
from kivy.properties import ObjectProperty, NumericProperty
from kivy.uix.image import Image
from kivy.uix.screenmanager import ScreenManager, Screen

Config.set('input', 'mouse', 'mouse,multitouch_on_demand')
Config.set('graphics', 'fullscreen', 'fake')
Config.set('graphics', 'height', '1080')
Config.set('graphics', 'width', '1920')
Config.set('graphics', 'resizeable', '0')
Config.set('graphics', 'borderless', '1')
Config.set('graphics', 'minimum_width', '1920')
Config.set('graphics', 'minimum_height', '1080')
Config.set('graphics', 'position', 'auto')


LabelBase.register('Roboto',
                   'Roboto/Roboto-Medium.ttf',
                   'Roboto/Roboto-Black.ttf',
                   'Roboto/Roboto-Bold.ttf',
                   'Roboto/Roboto-Regular.ttf')


class MainWindow(Screen):
    pass


class KivyCamera(Image):

    status = 0
    frame = 0
    stream = ObjectProperty()
    fps = NumericProperty(25)

    def __init__(self, **kwargs):
        super(KivyCamera, self).__init__(**kwargs)
        self._capture = None

    def on_stream(self, *args):
        if self._capture is not None:
            self._capture.release()
        self._capture = cv2.VideoCapture(self.stream)
        self.thread = Thread(target=self.update, args=())
        self.thread.daemon = True
        self.thread.start()
        Clock.schedule_interval(self.show_frame, 1.0 / self.fps)

    @property
    def capture(self):
        return self._capture

    def update(self):
        while True:
            if self.capture.isOpened():
                (self.status, self.frame) = self.capture.read()
            time.sleep(.01)

    def show_frame(self, dt):
        if self.status:
            buf1 = cv2.flip(self.frame, 0)
            buf = buf1.tostring()
            image_texture = Texture.create(
                size=(self.frame.shape[1], self.frame.shape[0]), colorfmt="bgr"
            )
            image_texture.blit_buffer(buf, colorfmt="bgr", bufferfmt="ubyte")
            self.texture = image_texture


class WindowManager(ScreenManager):
    pass


kv = Builder.load_file("my.kv")

sm = WindowManager()

screens = [MainWindow(name="main")]
for screen in screens:
    sm.add_widget(screen)

sm.current = "main"


class MyMainApp(App):
    def build(self):
        return sm


if __name__ == "__main__":

    MyMainApp().run()

我想用两条对角线形成一个十字线和一个标签覆盖层来显示我的相机小部件，以证明其概念。但是我的定位全错了。谁能帮助我理解足够的布局以帮助我实现这一目标？

出于将来的考虑，我希望在此面板中至少显示12台摄像机，所以3行4列或4行3列。屏幕管理器目前是多余的，但我将其包括在内，因为该应用程序将来将具有多个屏幕。

编辑

这是我的结果的图片

编辑2

我已经按照自己想要的方式工作了，但是我仍然不理解数学，这是通过纯粹的尝试和错误。这是我在相机小部件中更改.kv的方法：

canvas:

                Color:
                    rgba: 1, 1, 1, 1
                Line:
                    points: cam1.x+790, cam1.y+495, cam1.x+1110, cam1.y+255
                Line:
                    points: cam1.x+790, cam1.y+255, cam1.x+1110, cam1.y+495

            Label:
                id: Overlay
                color: 1, 1, 1, 1
                text: "This is an overlay"
                pos: cam1.x+ 900, cam1.y + 335
                size_hint: 1,1

和结果：

Answer 1

您的原始kv代码是正确的，除了您需要添加：

size_hint: None, None

到KivyCamera:部分。没有该行，您的size:设置将被忽略。
我还需要将您的pos_hint更改为：
pos_hint: {"x":0, "top":1.0}