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

如何在Kivy或KivyMD中创建类似快照的按钮?

  •  0
  • fishfin  · 技术社区  · 4 年前

    附件是来自Magento管理页面的图像。我想在(Kivy或KivyMD)和Python中创建一个这样的按钮系统——一个下面有文本的大图标。我努力寻找样本,或者使用厨房水槽演示,在附近找不到任何东西,我也不知道要搜索的关键字。我是否需要创建一个自定义按钮,或者Kivy或KivyMD中是否已经有了一些东西?如果有,它叫什么?

    以及其他相关问题-使用字体(如fontawesome)作为图标是否有益,或者使用PNG图像是否可以?

    Snapshot from Magento Admin

    0 回复  |  直到 4 年前
        1
  •  1
  •   user13676212 user13676212    4 年前

    使用:

    from kivy.core.window import Window
    from kivy.lang.builder import Builder
    from kivy.uix.boxlayout import BoxLayout
    from kivy.uix.floatlayout import FloatLayout
    from kivymd.app import MDApp
    from kivymd.uix.list import OneLineIconListItem
    from kivy.uix.floatlayout import FloatLayout
    from kivy.uix.boxlayout import BoxLayout
    from kivy.uix.screenmanager import Screen, ScreenManager
    import kivy.core.clipboard
    import requests 
    
    
    
    import os
    if os.path.exists("_python_bundle/")==False:
        try:
            Window.size=(350,600)
        except:
            pass
    
    kv = '''
    #:import MDTextField kivymd.uix.textfield.MDTextField
    #:import Clipboard kivy.core.clipboard.Clipboard
    
    Screen:
        name: "jbsidis"
        MDBottomNavigationBar:
            id: jbsidis_bar_23
            canvas.before:
                Color:
                    rgba: [0,0,0,.4]
                Line:
                    width: dp(0.5)
                    rectangle:
                        (self.x, self.height, self.width, dp(1))
            size_hint: .2,1
            height: dp(10) #56
            elevation: 0
            md_bg_color: [0.1,0,0.1,1] #[1,1,1,1]
     
    
    
            FloatLayout:
                MDIconButton:
                    id: b1_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .96}
                    markup: True
                    icon: "cube-scan"
                    theme_text_color: "Custom"
                    text_color: [1,0,0,.9]
                    on_release: print(12, "jbsidis")
                MDSeparator:
                    pos_hint: {'center_x': .5, 'center_y': .93}
                    color: [1,1,1,.5]
                    size_hint_y: None
                    size_hint_x: .7
                    height: "1dp"
                    
                MDIconButton:
                    id: b2_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .9}
                    markup: True
                    icon: "speedometer"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(12, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .87}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]DASHBOARD" #for pc size is 6, for cellphone [size=15]
            
                    
                MDIconButton:
                    id: b3_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .82}
                    markup: True
                    icon: "currency-usd"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release:
                        print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .79}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]SALES" #for pc size is 6, for cellphone [size=15]
            
                    
                MDIconButton:
                    id: b4_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .74}
                    markup: True
                    icon: "cube-outline"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .71}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]CATALOG" #for pc size is 6, for cellphone [size=15]
            
                    
                MDIconButton:
                    id: b5_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .66}
                    markup: True
                    icon: "clipboard-account"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .62}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]CUSTOMER" #for pc size is 6, for cellphone [size=15]
            
                    
                MDIconButton:
                    id: b6_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .57}
                    markup: True
                    icon: "speaker-wireless"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .53}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]MARKETING" #for pc size is 6, for cellphone [size=15]
               #
                MDIconButton:
                    id: b7_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .48}
                    markup: True
                    icon: "solar-panel"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .45}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]CONTENT" #for pc size is 6, for cellphone [size=15]
               
                MDIconButton:
                    id: b7_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .38}
                    markup: True
                    icon: "chart-bar"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .35}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]REPORTS" #for pc size is 6, for cellphone [size=15]
               
                MDIconButton:
                    id: b7_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .30}
                    markup: True
                    icon: "store-outline"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .28}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]STORES" #for pc size is 6, for cellphone [size=15]
               
                MDIconButton:
                    id: b7_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .21}
                    markup: True
                    icon: "file-settings-variant-outline"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release: print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .17}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=9]SYSTEM" #for pc size is 6, for cellphone [size=15]
               
                MDSeparator:
                    pos_hint: {'center_x': .5, 'center_y': .14}
                    color: [1,1,1,.5]
                    size_hint_y: None
                    size_hint_x: .7
                    height: "1dp"
                    
                MDIconButton:
                    id: b7_jbsidis
                    pos_hint: {'center_x': .5, 'center_y': .11}
                    markup: True
                    icon: "puzzle"
                    theme_text_color: "Custom"
                    text_color: [1,1,1,.9]
                    on_release:
                        print(23, "jbsidis")
                MDTextButton:
                    pos_hint: {'center_x': .5, 'center_y': .07}
                    markup: True
                    font_style: "Caption"
                    text: "[color=ffffff][b][size=8]FIND PARTNERS\\n&  EXTENSIONS" #for pc size is 6, for cellphone [size=15]
    
    
    '''
    x = "jbsidis: kivy or kivymd, python can do everything java kotlin react etc can, Python and Kivy are amazing"
    from kivy.properties import ObjectProperty
    
    
    class ContentNavigationDrawer(BoxLayout):
        screen_manager = ObjectProperty()
        nav_drawer = ObjectProperty()
    
    class JBSIDIS(OneLineIconListItem):
        pass
    class blanks1(BoxLayout):
        pass
    class S(FloatLayout):
        pass
    
    
    Web_links = "jbsidis"
    books = """
    jbsidis
    """
    class Main_jbsidis(MDApp):
        def __init__(self, **kwargs):
            super().__init__(**kwargs)
    
        def build(self):
            global app
            global jbsidis
            jbsidis="jbsidis"
            app=MDApp.get_running_app()
            return Builder.load_string(kv)
    
    
    Main_jbsidis().run()
    

    图片:

    enter image description here