首页 > 解决方案 > 在 Kivy 中定位选项卡式面板标题

问题描述

我正在尝试创建自定义 TabbedPanel 来控制其外观和其他内容。但我似乎无法定位面板。在我的示例中,我已将条带着色为绿色以说明此问题。我确实看过这个问题,但我似乎无法弄清楚。尝试将所有填充设置为零但没有成功。

面板略微偏移并且比条带略小(如绿色所示)。我如何更改它并删除/控制填充。

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout

Builder.load_string('''

<Screen>:
    canvas.before:
        Color:
            rgba: (0.8, 0.5, 1, 1)
        Rectangle:
            size: self.size
            pos: self.pos
    background_normal: ''
    orientation: 'vertical'
    padding: 50

    CustomPanel:
        CustomPanelItem:
            Label:
                text: 'Hello there'


<CustomPanel@TabbedPanel+CustomStrip>:
    do_default_tab: False
    tab_width: self.width 
    padding: 0, 0, 0, 0


<CustomPanelHeader@TabbedPanelHeader>:
    text: 'Long Text for a Tab'
    padding: 0, 0


<CustomPanelItem@TabbedPanelItem+CustomPanelHeader>:
    text: 'Hello World Hello World Hello World'
    padding: 0, 0


<CustomStrip@TabbedPanelStrip>:
    canvas:
        Color:
            rgba: (0, 1, 0, 1) # green
        Rectangle:
            size: self.size
            pos: self.pos

''')


class Screen(BoxLayout):
    pass


class TestApp(App):

    def build(self):
        return Screen()


if __name__ == '__main__':
    TestApp().run()

标签: pythonkivykivy-language

解决方案


问题 1 - 左侧 1 px

但左边似乎还有 1 px ...?

根本原因 - 向左 1 px

这是由于选项卡使用的图像实际上是一个按钮。

解决方案 - 向左 1 px

<TabbedPanelHeader>使用任何 rgba 颜色background_normal: ''覆盖类规则background_color:

问题 2 - 下面的腿部空间

...我该如何处理下面的腿部空间?

解释

我相信条带/分离器的存在可能是设计使然。

问题

面板略微偏移并且比条带略小(如绿色所示)。我如何更改它并删除/控制填充。

解决方案

覆盖paddingin 类规则,<StripLayout>并删除所有对padding.

片段

...

<CustomPanelItem@TabbedPanelItem+CustomPanelHeader>:
    text: 'Hello World Hello World Hello World'

<StripLayout>
    padding: 0, 0, 0, 0

<TabbedPanelHeader>:
    background_normal: ''
    background_color: 0, 0, 1, 1    # blue

<CustomStrip@TabbedPanelStrip>:
    canvas:
...

输出

TabbedPanelheader - 删除的图像 StripLayout - 填充


推荐阅读