首页 > 解决方案 > 如何解决 Kivy CardPost 堆叠到底部的问题

问题描述

我正在学习用 KivyMd 创建一个应用程序。下面的代码是我的工作代码,但问题是,PostCard 有点堆叠到底部,第一个 Post 固定,其余部分垂直滚动(scroll-y)。请我需要帮助以使帖子正确显示,从而删除它们上方的大白色空间。

当我将导航菜单图标从“checkbox-blank-circle”更改为“facebook”或“book”时,我也会收到错误消息。

对不起,我在一个问题上问得太多了。

from kivy.app import App
from kivy.lang import Builder
from kivy.factory import Factory

from kivymd.navigationdrawer import NavigationDrawerIconButton
from kivymd.theming import ThemeManager
from kivymd.card import MDCardPost
from kivymd.toast import toast

main_kv = """
#:import Toolbar kivymd.toolbar.Toolbar
#:import MDNavigationDrawer kivymd.navigationdrawer.MDNavigationDrawer
#:import NavigationDrawerSubheader kivymd.navigationdrawer.NavigationDrawerSubheader
#:import MDLabel kivymd.label.MDLabel


<ContentNavigationDrawer@MDNavigationDrawer>:
    drawer_logo: 'business-1.jpg'

    NavigationDrawerSubheader:
        text: "Menu:"


NavigationLayout:
    id: nav_layout

    ContentNavigationDrawer:
        id: nav_drawer

    BoxLayout:
        orientation: 'vertical'

        Toolbar:
            id: toolbar
            title: 'My First App'
            md_bg_color: app.theme_cls.primary_color
            background_palette: 'Primary'
            background_hue: '500'
            elevation: 10
            left_action_items:
                [['dots-vertical', lambda x: app.root.toggle_nav_drawer()]]

        FloatLayout:
            MDCardPost:
                orientation: 'vertical'
                spacing: dp(5)

                ScrollView:
                    id: scroll
                    size_hint: 1, 1
                    do_scroll_x: False

                    GridLayout:
                        id: grid_card
                        cols: 1
                        spacing: dp(5)
                        padding: dp(5)
                        size_hint_y: None
                        height: self.minimum_height    
"""


class Example(App):
    theme_cls = ThemeManager()
    theme_cls.primary_palette = 'Blue'
    title = "My App"
    main_widget = None
    cards_created = False

    def build(self):
        self.main_widget = Builder.load_string(main_kv)
        return self.main_widget

    def callback(self, instance, value):
        if value==1:
            self.main_widget.ids.toolbar.title="Something 1"
        elif value==2:
            self.main_widget.ids.toolbar.title="Something 2"
        else:
            self.main_widget.ids.toolbar.title="Something 3"

        toast("Pressed Something %d" % value)

    def on_start(self):

        def callback_for_menu_items(text_item):
            toast(text_item)

        def callback(instance, value):
            if value and isinstance(value, int):
                toast('Set like in %d stars' % value)
            elif value and isinstance(value, str):
                toast('Repost with %s ' % value)
            elif value and isinstance(value, list):
                toast(value[1])
            else:
                toast('Delete post %s' % str(instance))

    self.main_widget.ids.nav_drawer.add_widget(
            NavigationDrawerIconButton(
                icon='checkbox-blank-circle', text="Something 1",
                on_release=lambda x, y=1: self.callback(x, y)))
        self.main_widget.ids.nav_drawer.add_widget(
            NavigationDrawerIconButton(
                icon='checkbox-blank-circle', text="Something 2",
                on_release=lambda x, y=2: self.callback(x, y)))
        self.main_widget.ids.nav_drawer.add_widget(
            NavigationDrawerIconButton(
                icon='checkbox-blank-circle', text="Something 3",
                on_release=lambda x, y=3: self.callback(x, y)))

        instance_grid_card = self.main_widget.ids.grid_card
        buttons = ['facebook', 'vk', 'twitter']
        menu_items = [
            {'viewclass': 'MDMenuItem',
             'text': 'Example item %d' % i,
             'callback': callback_for_menu_items}
            for i in range(2)
        ]

        if not self.cards_created:
            self.cards_created = True

            instance_grid_card.add_widget(
                MDCardPost(text_post='Card with text',
                           swipe=True, callback=callback))
            instance_grid_card.add_widget(
                MDCardPost(
                    right_menu=menu_items, swipe=True,
                    text_post='Card with a button to open the menu MDDropDown',
                    callback=callback))
            instance_grid_card.add_widget(
                MDCardPost(
                    likes_stars=True, callback=callback, swipe=True,
                    text_post='Card with asterisks for voting.'))

            instance_grid_card.add_widget(
                MDCardPost(
                    source="./assets/kitten-1049129_1280.jpg",
                    tile_text="Little Baby",
                    tile_font_style="Headline",
                    text_post="This is my favorite cat. He's only six months "
                              "old. He loves milk and steals sausages :) "
                              "And he likes to play in the garden.",
                    with_image=True, swipe=True, callback=callback,
                    buttons=buttons))

Example().run()

这是它的照片。

这张照片代表了我现在所拥有的

标签: python-3.xkivykivy-language

解决方案


您可以尝试使用BoxLayout小部件而不是FloatLayout小部件。

BoxLayout:

    orientation: 'vertical'

    Toolbar:
        id: toolbar
        title: 'My First App'
        md_bg_color: app.theme_cls.primary_color
        background_palette: 'Primary'
        background_hue: '500'
        elevation: 10
        left_action_items:
            [['dots-vertical', lambda x: app.root.toggle_nav_drawer()]]

    # This one replaced the FloatLayout
    BoxLayout:
        orientation: 'vertical'

        MDCardPost:
            orientation: 'vertical'
            spacing: dp(5)


        ScrollView:
            id: scroll
            size_hint: 1, 1
            do_scroll_x: False

            GridLayout:
                id: grid_card
                cols: 1
                spacing: dp(5)
                padding: dp(5)
                size_hint_y: None
                height: self.minimum_height    

以下是一些输出:

在此处输入图像描述

在此处输入图像描述

在此处输入图像描述

在此处输入图像描述

关于给出错误的图标,您可以尝试先实例化NavigationDrawerIconButton小部件,然后给它一个图标。

    firstItem = NavigationDrawerIconButton(
        text="Something 1",
        on_release=lambda x, y=1: self.callback(x, y)
        )

    firstItem.icon = 'facebook'

    self.main_widget.ids.nav_drawer.add_widget(firstItem)

    secondItem = NavigationDrawerIconButton(
        text="Something 2",
        on_release=lambda x, y=2: self.callback(x, y)
        )

    secondItem.icon = 'book'

    self.main_widget.ids.nav_drawer.add_widget(secondItem)

    thirdItem = NavigationDrawerIconButton(
        text="Something 3",
        on_release=lambda x, y=3: self.callback(x, y)
        )

    thirdItem.icon = 'face'

    self.main_widget.ids.nav_drawer.add_widget(thirdItem)

这是输出:

在此处输入图像描述

要使第一张明信片可滚动,您可以从 kv 中删除这些行。

        #Remove these lines 
        MDCardPost:
            orientation: 'vertical'
            spacing: dp(5)

然后我们可以像这样在 ScrollView 中添加第一张明信片:

if not self.cards_created:
    self.cards_created = True

    # This is the first post card
    instance_grid_card.add_widget(
            MDCardPost()
    )

    instance_grid_card.add_widget(
            MDCardPost(text_post='Card with text',
                       swipe=True, callback=callback))
    instance_grid_card.add_widget(
            MDCardPost(
                right_menu=menu_items, swipe=True,
                text_post='Card with a button to open the menu MDDropDown',
                callback=callback))
    instance_grid_card.add_widget(
            MDCardPost(
                likes_stars=True, callback=callback, swipe=True,
                text_post='Card with asterisks for voting.'))

推荐阅读