Kivy按钮文本对齐问题

Question

我正在尝试在Kivy中开发一个电子邮件应用程序，基本上只是为了学习这个框架的内部细节... 我正在尝试创建初始窗口，并遇到了一些问题！想法是它将简单地显示收件箱中的电子邮件列表，就像移动设备上的任何基本电子邮件应用程序一样。

我的问题是，我无法弄清楚如何使每个列表项（即按钮）的文本正确对齐。在我的按钮中使用"halign='left'"会使文本向左对齐，但仅相对于每个按钮；它仍然在每个按钮中心对齐。

我的实际应用程序有点大，无法发布，因此这是我从库存Kivy示例制作的快速而简单的示例。（我知道这段代码不完美...就像我说的那样，只是为了举例说明...它确实可以工作！）所以，正如您所看到的，每个按钮上的两行文本是对齐的，但它们并没有整体对齐。有人能建议我该怎么做才能让所有文本都在每个按钮的左侧10像素处对齐吗？我在StackOverflow上找到了一个相关的项目，但它并没有真正回答这个问题，例如，它似乎更多地处理在按钮上使用图像的问题。我是Kivy的新手，但我已经阅读了教程和文档，并进行了广泛的谷歌搜索 - 因此，任何帮助都将不胜感激！

import kivy
kivy.require('1.0.8')

from kivy.app import App
from kivy.core.window import Window
from kivy.uix.button import Button
from kivy.uix.scrollview import ScrollView
from kivy.uix.gridlayout import GridLayout

import random


class ScrollViewApp(App):

    def build(self):
        # create a default grid layout with custom width/height
        layout = GridLayout(cols=1, spacing=10, size_hint=(None, None),
                            width=Window.width)

        # when we add children to the grid layout, its size doesn't change at
        # all. we need to ensure that the height will be the minimum required to
        # contain all the childs. (otherwise, we'll child outside the bounding
        # box of the childs)
        layout.bind(minimum_height=layout.setter('height'))

        # add button into that grid
        for i in range(30):
            btn = Button(text=str(i * random.random()) + '\n' + str(i * random.random()),
                         size=(300, 40),
                         size_hint=(None, None),
                         halign='left')
            layout.add_widget(btn)

        # create a scroll view, with a size < size of the grid
        root = ScrollView(size_hint=(None, None))
        root.size = (Window.width, Window.height)
        root.center = Window.center
        root.add_widget(layout)

        return root

if __name__ == '__main__':

    ScrollViewApp().run()

- Adam Gaskins

Answer 1

这篇文档介绍了Button部件，开头说“一个 Button 是一个 Label”。即使对于没有明确说明其血统的 部件 ，你也应该注意在相关API 文档中的第二行。在本例中，是“Bases: kivy.uix.label.Label”。

这表明按钮是从标签(label)继承而来。(我特别提到这一点，因为查看基类继承属性有时对每个人都不直观)。

如果您查看 Label 的文档，特别是halign属性，它要求您使用text_size来实现正确的文本对齐。这意味着文本对齐在一个由text_size属性设定的边界框内。该属性可以设置为:

a) 部件大小。 text_size: self.size

b) 小于部件大小(您要找的内容)。text_size: self.width - dp(10), self.height - dp(10)

c) 在一侧不受约束。text_size: self.width, None

d) 或两者皆无 text_size: None, None

e) 或约束到不同的小部件中 text_size: other_button.size

使用text_size的原因是为了给予用户更多控制权。您还应该查看textalign示例

- qua-non

Answer 2

您需要设置“text_size”属性，类似于以下内容： text_size。

btn.text_size = (290, 40)

- HYRY

---

此外，查看text_align示例也会有所帮助。 - Tshirtman

Answer 3

正如qua-non所解释的那样，按钮就是标签，因此您可以查看标签属性以了解如何实现它。由于我没有看到太多相关内容，我想添加一小段代码以帮助其他程序员。
我将展示如何创建具有标签和调整文本的按钮。

#disable multi-touch emulation
from kivy.config import Config
Config.set('input', 'mouse', 'mouse,multitouch_on_demand')
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.button import Button
from kivy.uix.image import Image   
#--------------------------------------------------------------------
Builder.load_string("""
<RootWidget>:
  BoxLayout:
    orientation: 'vertical'
    padding: "10dp"

    BoxLayout:
      size_hint_y: 3
      Widget: # to fill the line from left

      Button:
        text: "Button"
        font_size: 40
        text_size: self.size     
        halign: 'center'
        valign: 'bottom'
        padding_y: 10

        #Adding Image you can comment this part    
        Image:
          source: 'img/calender1.png'
          center_x: self.parent.center_x
          center_y: self.parent.center_y +10

      Widget:# to fill the line from right

    BoxLayout:
      size_hint_y: 10    

""")
#-----------------------------------------------------------------------
class RootWidget(BoxLayout):
  pass

#-----------------------------------------------------------------------    
class MyApp(App):
    def build(self):
      return RootWidget()


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

主要的部分放在按钮中。您可以调整字体、对齐方式和填充以获得任何所需的结果。

Button:
    text: "Button"
    font_size: 40
    text_size: self.size     
    halign: 'center'
    valign: 'bottom'
    padding_y: 10

- Avi ba

Answer 4

如果你想避免在text.size中出现数字，可以尝试这个方法： text_size: self.size

- Abhipso Ghosh