如何在MDBottomNavigation的底部导航项之间插入线条?

Question

我正在使用kivymd框架，并希望在底部导航的每个底部项目之间插入行。

代码来自 https://kivymd.readthedocs.io/en/latest/components/bottom-navigation/index.html。

谢谢！

from kivymd.app import MDApp
from kivy.lang import Builder

class Test(MDApp):
def build(self):
self.theme_cls.primary_palette = "Gray"
return Builder.load_string(
'''
BoxLayout:
orientation:'vertical'
MDToolbar:
title: 'Bottom navigation'
md_bg_color: .2, .2, .2, 1
specific_text_color: 1, 1, 1, 1
MDBottomNavigation:
panel_color: .2, .2, .2, 1
MDBottomNavigationItem:
name: 'screen 1'
text: 'Python'
icon: 'language-python'
MDLabel:
text: 'Python'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'C++'
icon: 'language-cpp'
MDLabel:
text: 'I programming of C++'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'JS'
icon: 'language-javascript'
MDLabel:
text: 'JS'
halign: 'center'
'''
)

Test().run()

Answer 1

您可以在 KV 文件中使用MDSeparator：

MDLabel:
text: "Chips with check:"
MDSeparator:  <-----------##
StackLayout:
size_hint_y: None
height: self.minimum_height
spacing: dp(5)
MDChip:
label: "Check"
icon: ""
check: True
callback: app.callback

Answer 2

我认为没有任何简单的方法可以做到这一点，但这里有一种方法可以在MDBottomNavigation中的项目之间添加SeparatorWidget：

from kivy.clock import Clock
from kivy.properties import ListProperty
from kivy.uix.widget import Widget
from kivymd.app import MDApp
from kivy.lang import Builder
class Separator(Widget):
sep_color = ListProperty([1,0,0,1])
class Test(MDApp):
def add_seps(self, dt):
tab_bar = self.root.ids.mdbn.ids.tab_bar
for i in range(len(tab_bar.children)-1, 0, -1):
tab_bar.add_widget(Separator(size_hint=(None, 1), width=4, sep_color=[0,1,0,1]), index=i)
def build(self):
self.theme_cls.primary_palette = "Gray"
Clock.schedule_once(self.add_seps)
return Builder.load_string(
'''
<Separator>:
canvas:
Color:
rgba: self.sep_color
Rectangle:
pos: self.pos
size: self.size
BoxLayout:
orientation:'vertical'
MDToolbar:
title: 'Bottom navigation'
md_bg_color: .2, .2, .2, 1
specific_text_color: 1, 1, 1, 1
MDBottomNavigation:
id: mdbn
panel_color: .2, .2, .2, 1
MDBottomNavigationItem:
name: 'screen 1'
text: 'Python'
icon: 'language-python'
MDLabel:
text: 'Python'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 2'
text: 'C++'
icon: 'language-cpp'
MDLabel:
text: 'I programming of C++'
halign: 'center'
MDBottomNavigationItem:
name: 'screen 3'
text: 'JS'
icon: 'language-javascript'
MDLabel:
text: 'JS'
halign: 'center'
'''
)

Test().run()

Separator只是sep_color的一个Rectangle，add_seps()方法将它们插入MDBottomNavigation中的项目之间。这些项目位于具有id"tab_bar"的BoxLayout中。

Clock.schedule_once()在App完成后调用add_seps()方法。

我已经在您的kv的MDBottomNavigation上添加了id"mdbn"，以便更轻松地访问该Widget。