Kivy：调整按钮以适应下拉菜单中的包装文本(Kivy: Sizing Buttons to fit wrapped text within dropdown)

我在构建启用文字换行功能的Kivy下拉菜单时遇到问题，因此按钮会根据小部件尺寸进行相应调整以适应全文。

我遵循了下面的堆栈溢出线程的指导以及也链接的类似博客文章。

包装Kivy标签的文字

https://blog.kivy.org/2014/07/wrapping-text-in-kivys-label/

文本按预期进行换行，但随着文本字符串变长，呈现按钮时，文本上下的“填充”数量不断增加。 我不确定是什么导致了这种情况，并希望消除这种影响。

更新:(编辑代码以更加简洁的问题。编辑图像匹配）

“额外填充”与文本的长度无关，而是添加到下拉列表中的循环索引和/或小部件计数。

进一步编辑这一行代码：

btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(1,None))

至：

btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(None,None),width=700)

（设置size_hint =（无，无）而不是（1，无）并且增加宽度= 700）

消除该问题。 我无法围绕导致这种行为的原因。 编辑后的代码会丢失按钮的自动宽度调整大小，我无法想象宽度size_hint是如何引起垂直“填充”的。

截图显示问题

这段代码演示了这个问题：

from kivy.uix.button import Button from kivy.uix.dropdown import DropDown from kivy.uix.boxlayout import BoxLayout from kivy.base import runTouchApp from kivy.lang import Builder Builder.load_string(''' <WrapButton>: halign: "center" valign: "center" font_size: 20 size_hint_y: None text_size : self.size height: self.texture_size[1] ''') class WrapButton(Button): pass dropdown2 = DropDown() layout = BoxLayout(padding=0,orientation='vertical') mainbutton2 = WrapButton(text='Select...', size_hint=(1, None),height=95,pos_hint={'center_x': .5, 'center_y': 0}) mainbutton2.bind(on_release=dropdown2.open) layout.add_widget(mainbutton2) for index in range(20): btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(1,None)) btn2.bind(on_release=lambda btn2: dropdown2.select(btn2.text)) dropdown2.add_widget(btn2) dropdown2.bind(on_select=lambda instance, x: setattr(mainbutton2, 'text', x)) runTouchApp(layout)

截图

更新：下面接受的答案会导致Android上的工件。 我正在测试其他设备以排除设备本身。 来自社区的任何意见将不胜感激！

Artifacts..broken Kivy安装？

I'm having issues building a Kivy dropdown with word wrapping enabled for the text, such that the button widgets size accordingly to accommodate the full text.

I have followed guidance from the stack overflow thread below and similar blog post that is also linked.

Wrapping the text of a Kivy Label

https://blog.kivy.org/2014/07/wrapping-text-in-kivys-label/

The text wraps as expected, however as the text string gets longer, there is an increasing amount of "padding" above and below the text when the button is rendered. I am unsure of what is causing this and would like to eliminate this effect.

Updated: (Edited code to be more concise to the issue. Edited image to match)

The "extra padding" is not related to the length of text, but rather the index of the loop and/or widget count added to the dropdown.

Further editing this line of code:

btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(1,None))

To:

btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(None,None),width=700)

(set size_hint=(none,none) rather than (1,none) and add width=700)

Eliminates the issue. I can not wrap my head around what is causing this behavior. The edited code loses the automatic width sizing for the button, and I can't imagine how a width size_hint is causing vertical "padding".

Screenshot showing issue

This code demonstrates the issue:

from kivy.uix.button import Button from kivy.uix.dropdown import DropDown from kivy.uix.boxlayout import BoxLayout from kivy.base import runTouchApp from kivy.lang import Builder Builder.load_string(''' <WrapButton>: halign: "center" valign: "center" font_size: 20 size_hint_y: None text_size : self.size height: self.texture_size[1] ''') class WrapButton(Button): pass dropdown2 = DropDown() layout = BoxLayout(padding=0,orientation='vertical') mainbutton2 = WrapButton(text='Select...', size_hint=(1, None),height=95,pos_hint={'center_x': .5, 'center_y': 0}) mainbutton2.bind(on_release=dropdown2.open) layout.add_widget(mainbutton2) for index in range(20): btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|') , size_hint=(1,None)) btn2.bind(on_release=lambda btn2: dropdown2.select(btn2.text)) dropdown2.add_widget(btn2) dropdown2.bind(on_select=lambda instance, x: setattr(mainbutton2, 'text', x)) runTouchApp(layout)

screenshot

Update: The answer accepted below is resulting in artifacts on Android. I am working to test on other devices to rule out the device itself. Any input from the community here would be appreciated!

Artifacts..broken Kivy install?

最满意答案

解决方案是将text_size : self.size替换为text_size : self.width, None 。 详情请参阅示例和输出。

例

main.py

from kivy.uix.button import Button from kivy.uix.dropdown import DropDown from kivy.uix.boxlayout import BoxLayout from kivy.base import runTouchApp from kivy.lang import Builder Builder.load_string(''' <WrapButton>: halign: "center" valign: "center" font_size: 20 size_hint_y: None text_size : self.width, None height: self.texture_size[1] ''') class WrapButton(Button): pass dropdown2 = DropDown() layout = BoxLayout(padding=0, orientation='vertical') mainbutton2 = WrapButton(text='Select...', size_hint=(1, None), height=95, pos_hint={'center_x': .5, 'center_y': 0}) mainbutton2.bind(on_release=dropdown2.open) layout.add_widget(mainbutton2) for index in range(20): btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|'), size_hint=(1, None)) btn2.bind(on_release=lambda btn2: dropdown2.select(btn2.text)) dropdown2.add_widget(btn2) dropdown2.bind(on_select=lambda instance, x: setattr(mainbutton2, 'text', x)) runTouchApp(layout)

产量

The solution is to replace text_size : self.size with text_size : self.width, None. Please refer to the example and output for details.

Example

main.py

from kivy.uix.button import Button from kivy.uix.dropdown import DropDown from kivy.uix.boxlayout import BoxLayout from kivy.base import runTouchApp from kivy.lang import Builder Builder.load_string(''' <WrapButton>: halign: "center" valign: "center" font_size: 20 size_hint_y: None text_size : self.width, None height: self.texture_size[1] ''') class WrapButton(Button): pass dropdown2 = DropDown() layout = BoxLayout(padding=0, orientation='vertical') mainbutton2 = WrapButton(text='Select...', size_hint=(1, None), height=95, pos_hint={'center_x': .5, 'center_y': 0}) mainbutton2.bind(on_release=dropdown2.open) layout.add_widget(mainbutton2) for index in range(20): btn2 = WrapButton(text=('|' + str('long text..is long...%d' % (21-index) * index) + '|'), size_hint=(1, None)) btn2.bind(on_release=lambda btn2: dropdown2.select(btn2.text)) dropdown2.add_widget(btn2) dropdown2.bind(on_select=lambda instance, x: setattr(mainbutton2, 'text', x)) runTouchApp(layout)

Output