代码之家  ›  专栏  ›  技术社区  ›  xralf

将搜索项目更多地移到顶部

  •  0
  • xralf  · 技术社区  · 5 年前

    下面的代码片段显示了 popup

    class SearchBar(TextInput):
        articles = ListProperty()
    
        def __init__(self, **kwargs):
            super().__init__(**kwargs)
            self.bind(text=self.on_text)
            self.bind(articles=self.on_articles)
    
        def on_text(self, *args):
            WikiSearcher().get_search_results(self.text, self)
    
        def on_articles(self, *args):
    
            self.parent.parent.children[0].update_recommendations(self.articles)
    
    class SearchItem(ButtonBehavior, Label):
    
        def __init__(self, **kwargs):
            super().__init__(**kwargs)
            self.url = ''
    
        def on_release(self):
            print (self.url)
    
    
    class Recommendations(BoxLayout):
    
        def update_recommendations(self, recommendations: list):
            for (search_item, recommendation) in zip(reversed(self.children), recommendations):
                search_item.text = recommendation
                try:
                    search_item.url = wikipedia.page(recommendation).url
                except:
                    search_item.url = 'https://en.wikipedia.org/wiki/' + recommendation.replace(" ", "_")
    
    Builder.load_string('''
    <SearchItem>:
        font_size: self.height * 0.4
        canvas.before:
            Color:
                rgba: [0.8, 0.8, 0.8, 1] if self.state == 'normal' else [30/255, 139/255, 195/255, 1]
            Rectangle:
                #pos: self.pos
                #size: self.size[0], self.size[1]
                size: root.size[0], root.size[1]
                pos: self.pos[0], self.pos[1]
            Color:
                rgba: 0, 0, 0, 1
            Line:
                rectangle: self.x, self.y, self.width, self.height
    
        color: 0, 0, 0, 1
    <Urlpup>:
        size_hint: 1, 1
        auto_dismiss: False
        title: 'Enter URL or keywords'
    
        BoxLayout:
            canvas.before:
                Color:
                    rgba: 1, 1, 1, 1
                Rectangle:
                    size: self.size
                    pos: self.pos
    
            orientation: 'vertical'
            padding: self.width * 0.1
            spacing: self.height * 0.1
    
            BoxLayout:
                orientation: 'horizontal'
                Spinner:
                    id: spinner
                    size_hint: 0.5, 0.4
                    pos_hint: { 'top' : 1 }
                    text: 'en'
                    values: 'en', 'fr', 'de', 'it'
    
                SearchBar:
                    id: url_input
                    size_hint: 1, 0.4
                    pos_hint: { 'center_x' : 0.5, 'top' : 1 }
                    multiline: False
                    font_size: self.height*0.8
    
                Button:
                    text: 'OK'
                    size_hint: 0.5, 0.4
                    pos_hint: { 'top' : 1 }
                    on_press: root.dismiss()
                    on_release: app.create_new_article(url_input.text)
    
            Recommendations:
                id: recommendations
                orientation: 'vertical'
                SearchItem
                SearchItem
                SearchItem
                SearchItem
    ''')
    
    class Urlpup(Popup):
        pass
    

    这是一张照片 弹出窗口 enter image description here

    你可以看到 SearchItems 没有紧紧地低于 SearchBar ,我正在努力定位它。你能修好吗?图片上有四个 搜索项目 但我计划有10个 Searchitems 所以它应该能工作10年 搜索项目 或者当我决定改变 搜索项目

    0 回复  |  直到 5 年前
        1
  •  1
  •   John Anderson    5 年前

    这个 BoxLayout 除非你另有指示,否则会尝试在孩子之间平均分配可用空间。那么,你的最高水平 盒子布局 Urlpup 类在 盒子布局 包含 TextInput 还有 Recommendations 小装置。通过限制水平方向的空间,可以减少这两个小部件之间的空间 盒子布局 .你可以通过指定高度来实现 盒子布局 ,就像这样:

        BoxLayout:
            size_hint_y: None
            height: 50
            orientation: 'horizontal'
            Spinner:
                id: spinner
                size_hint: 0.5, 1
                pos_hint: { 'top' : 1 }
                text: 'en'
                values: 'en', 'fr', 'de', 'it'
    
            SearchBar:
                id: url_input
                size_hint: 1, 1
                pos_hint: { 'center_x' : 0.5, 'top' : 1 }
                multiline: False
                font_size: self.height*0.8
    
            Button:
                text: 'OK'
                size_hint: 0.5, 1
                pos_hint: { 'top' : 1 }
                on_press: root.dismiss()
                on_release: app.create_new_article(url_input.text)
    

    请注意,这个 盒子布局 所有人都有一个 size_hint_y 属于 1.0 ,因此它们都将是为其容器指定的高度。

    这个 建议 小部件获取剩余的垂直空间(减去 spacing ).你可以移动 建议 通过减少 间距 .