在Python / Kivy中调整大小时，如何避免我的.png的颠簸

Posted 2021-04-12

我是Kivy的新手，我试图让自己成为后来即将推出的程序部分的一种模板。现在我被卡住，因为当我尝试调整它们时，我的精彩圆形.png按钮都会获得“边缘/颠簸”之王。

这就是Button的样子......

......这就是实际发生的事情（请忽略白色背景）

我尝试了多个其他的.png，所以我很确定问题不在.png本身。

这是我的代码（我缩短了它，以便于查找相关部分。如果您觉得需要更多代码，当然我可以添加它）：

test.kv

#:kivy 1.0.9

<MainWindow>:
BoxLayout:
    #[shortened for readability reasons]
    BoxLayout:
        #[shortened for readability reasons]
    BoxLayout:
        #[shortened for readability reasons]
        AnchorLayout:
            #[shortened for readability reasons]
        FloatLayout:
            canvas:
                Rectangle:
                    pos: self.pos
                    size: self.size
            Button:
                id: leftButton
                background_normal: 'assets/graphics/buttons/dummy.png'
                background_down: 'assets/graphics/buttons/.png'
                size_hint: .15, .15
                pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}

也许有人在这里有一个想法是什么问题以及如何解决它？请记住，我想在.kv文件中修复它（如果可能的话），以便我可以在以后更容易地重用它。

另一个小问题是一些其他按钮的定位。我想让它们与右侧对齐，但是我找不到如何访问按钮本身的宽度，所以我可以从self.width中减去它（如果我做对了，那应该是周围布局的宽度） ）

有什么建议？

---

我在此期间做了一些测试，以确保文件类型不是问题。我尝试使用.gif和.tif，据我所知，支持透明度的其他最常见的文件类型。结果与.png相同

---

为了澄清设计最终应该如何看，我将添加另一张图片：

所以我想我必须使用FloatLayout来做。我想像pyqt一样用网格来做，但是在kivy中，不可能定义应该放置小部件的单元格，也不能给它一个colspan或rowspan。至少那是我读过的。如果我错了，请纠正我。

---

好吧，ikolim的解决方案到目前为止工作，但又产生了另一个问题：我不能再使用background_normal和background_down，但我觉得我必须给用户一个视觉反馈 - 例如 - 单击按钮并按住它。我想因为我使用ButtonBehavier我也可以使用背景材料。但事实似乎并非如此。谁在那里谁可以给我一个如何解决这个问题的提示？

---

更新：我现在得到了视觉反馈。解决方案很简单，直到上周五我都忽略了它（我现在要回到带有互联网的电脑）。因此，对于有类似问题的感兴趣的读者，这是我的解决方案：我现在只使用on_press和on_release侦听器，并将图像的源从myPic.png更改为myPic_clicked.png，反之亦然。

所以问题解决了，我会在几天内写完一个完整的答案并关闭这个问题。但直到那时，我真的想知道是否有人有想法，为什么我有这个颠簸。一方面是为了全面了解kivy，另一方面是为了避免将来出现这个问题。

Thx提前！

答案

• 创建一个继承ButtonBehavior和Image的自定义按钮
• 使用GridLayout将自定义按钮放在一行中

Example

卖弄.朋友

from kivy.lang import Builder
from kivy.base import runTouchApp

runTouchApp(Builder.load_string('''
#:kivy 1.11.0

<CustomButton@ButtonBehavior+Image>:

GridLayout:
    rows: 1
    canvas:
        Rectangle:
            pos: self.pos
            size: self.size

    CustomButton:
        id: Button0
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button1
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button2
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button3
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')
'''))

Output

另一答案

好吧，在没有其他人似乎知道原始问题是什么之后，这里至少有一个非常好的解决方案。

ikolims答案几乎是完全正确的，我想尊重这一点。但它也错过了 - 至少对我来说 - 重要的一部分。这是他的代码。之后我会解释什么是遗失的：

from kivy.lang import Builder
from kivy.base import runTouchApp

runTouchApp(Builder.load_string('''
#:kivy 1.11.0

<CustomButton@ButtonBehavior+Image>:
GridLayout:
    rows: 1
    canvas:
        Rectangle:
            pos: self.pos
            size: self.size

    CustomButton:
        id: Button0
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button1
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button2
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')

    CustomButton:
        id: Button3
        source: './dummy.png'
        size_hint: .15, .15
        pos_hint: {'x':root.size_hint_x/2, 'y':root.size_hint_y/2}
        on_release:
            print('CustomButton clicked')
'''))

问题是，如果我们这样做，那个颠簸的错误就会消失。但也消失了background_normal和background_down不再起作用了。对此的解决方案是使用on_pressed和on_release来改变其中的源。