KivyMD圆角图标按钮Elevation效果无效及图标尺寸无法修改求助

你当前实现的CircularElevationButton存在两个核心问题：调整elevation无阴影效果，内部MDIcon的font_size不生效。以下是针对性的修复方案：

问题1：阴影不显示的修复 #

原因 #

• 组件继承顺序错误，导致CommonElevationBehavior的阴影绘制逻辑未正确触发
• 默认shadow_offset为(0,0)，阴影与按钮重叠，肉眼无法分辨

修改步骤 #

1. 修正Python类的继承顺序
   将CircularElevationButton的继承顺序调整为行为在前、布局在后，确保Elevation逻辑正常工作：

   class CircularElevationButton(CircularRippleBehavior, CommonElevationBehavior, ButtonBehavior, MDFloatLayout):
       pass
   

2. 在KV文件中添加阴影参数
   给CircularElevationButton配置阴影偏移和颜色，让阴影从按钮下方显现：

   <CircularElevationButton>
       # ... 原有配置保留
       shadow_offset: 0, -3  # 让阴影向下偏移
       shadow_color: 0, 0, 0, 0.4  # 设置阴影透明度和颜色
   

问题2：MDIcon字体大小不生效的修复 #

原因 #

强制设置MDIcon的size和pos为根组件的尺寸，覆盖了font_size的作用，导致图标被拉伸而非按字体大小缩放。

修改步骤 #

移除MDIcon的size和pos设置，仅保留居中定位：

<CircularElevationButton>
    # ... 原有配置保留
    MDIcon:
        icon: "hand-heart"
        halign: "center"
        valign: "center"
        pos_hint: {"center_x": .5, "center_y": .5}
        # 移除以下两行
        # size: root.size
        # pos: root.pos
        font_size: root.size[0] * .6
        theme_text_color: "Custom"
        text_color: "white"

完整修改后的代码 #

Python代码 #

from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.uix.behaviors import ButtonBehavior

from kivy.uix.screenmanager import ScreenManager, Screen
from kivymd.uix.screen import MDScreen
from kivy.core.window import Window

from kivymd.uix.behaviors import CommonElevationBehavior, CircularRippleBehavior
from kivymd.uix.floatlayout import MDFloatLayout
Window.size = (375, 812)

class LoginWindow(MDScreen):
    pass

class MainWindow(MDScreen):
    pass

class PlayerWindow(MDScreen):
    pass

class WindowManager(ScreenManager):
    pass

# 修正继承顺序
class CircularElevationButton(CircularRippleBehavior, CommonElevationBehavior, ButtonBehavior, MDFloatLayout):
    pass

class myMusicApp(MDApp):
    def build(self):
        kv = Builder.load_file('myMusicApp.kv')
        return kv
    
if __name__ == '__main__':
    myMusicApp().run()

KV文件 #

WindowManager:
    LoginWindow:
    MainWindow:
    PlayerWindow:

<LoginWindow>:
    name: 'login'
    Button:
        text: 'Log in'
        on_release: app.root.current = 'player'

<MainWindow>:
    name: 'main'

<CircularElevationButton>
    size_hint: None, None
    size: "100dp", "100dp"
    radius: self.size[0] / 2
    shadow_radius: self.radius[0]
    shadow_offset: 0, -3
    shadow_color: 0, 0, 0, 0.4
    md_bg_color: "red"

    MDIcon:
        icon: "hand-heart"
        halign: "center"
        valign: "center"
        pos_hint: {"center_x": .5, "center_y": .5}
        font_size: root.size[0] * .6
        theme_text_color: "Custom"
        text_color: "white"

<PlayerWindow>:
    name: 'player'
    canvas.before:
        Color:
            rgba: 1, 1, 1, 1
        Rectangle:
            pos: self.pos
            size: self.size
    BoxLayout:
        orientation: 'vertical'
        BoxLayout:
            size_hint: 1, .06
            orientation: 'horizontal'
            MDIconButton:
                anchor_x: 'left'
                anchor_y: 'middle'
                icon: 'arrow-left'
                style: 'standard'
            MDLabel:
                text: 'Now Playing'
                halign: 'center'
                font_name: 'Roboto'
            MDIconButton:
                icon: 'menu'
        Image:
            id: playerImage
            source: '/Users/name/Desktop/codingProjects/kivy/myNewApp3/ab67616d0000b273715973050587fe3c93033aad.jpeg'
        BoxLayout:
            size_hint: 1, .15
            orientation: 'vertical'
            spacing: '10dp'
            padding: '10dp'
            BoxLayout:
                orientation: 'vertical'
                CircularElevationButton:
                    pos_hint: {"center_x": .5, "center_y": .6}
                    elevation: 8
                    shadow_softness: 6

内容的提问来源于stack exchange，提问作者coderlark