如何在tkinter.ttk.Button中创建箭头并控制它的大小?

时间:2018-02-13 16:04:01

标签: python button tkinter ttk

我想创建一个带箭头的ttk.button并且箭头大小可以改变。

我发现了' TButton'本质上包含StyleNames TButton.leftarrow,它不会被ttk.Style()。layout()公开。

问题: (1)如何激活这些StyleNames? (2)如何控制.leftarrow的大小?我注意到它有一个arrowsize选项。我该如何使用它?

import tkinter as tk
import tkinter.ttk as ttk

class App(ttk.Frame):

        def __init__(self, parent):
            ttk.Frame.__init__(self, parent)
            self.parent = parent
            self.setStyle()
            self.setWidget()

        def setStyle(self):
            style = ttk.Style()
            print('Left.TButton layout are:', style.layout('Left.TButton'))
            print("Left.TButton.leftarrow style.element_options: ",
                  style.element_options('Left.TButton.leftarrow'))

            style.configure('Left.TButton', background='yellow')
            style.configure('Left.TButton.leftarrow', background='white',
                            arrowsize=20)

        def setWidget(self):
            self.lbutton = ttk.Button(self.parent, style='Left.TButton')
            self.lbutton2 = ttk.Button(self.parent, style='Left.TButton.leftarrow')
            self.lbutton.pack()
            self.lbutton2.pack()


    if __name__ == '__main__':
        root = tk.Tk()
        root.title('Test')
        root.geometry('200x50')
        app = App(root)
        app.pack(expand=1, fill='both')

1 个答案:

答案 0 :(得分:0)

经过大量尝试和对ttk文档的更深入研究后,我发现了以下内容:

  1. 要在按钮中创建箭头,我必须声明arrow元素 作为自定义样式布局中focus元素的子元素 这将用于ttk.Button()小部件。要做到这一点,我需要 使用ttk.Style().layout()方法。
  2. 箭头的大小取决于标签的字体大小 元件。因此,必须在布局中声明label元素 风格TButtonarrowsize元素的arrowleft选项似乎不起作用。我已经注释掉了这行不起作用的代码。但是,arrowcolor元素的leftarrow选项确实有效。要调整label元素的字体大小,请使用ttk.Style().configuration方法。
  3. 测试脚本中的方法2演示了我的问题的解决方案。

    Arrow Button

    测试代码:

    import tkinter as tk
    import tkinter.ttk as ttk
    
    
    class App(ttk.Frame):
    
        def __init__(self, parent):
            ttk.Frame.__init__(self, parent)
            self.parent = parent
            self.setStyle()
            self.setWidget()
    
        def setStyle(self):
            style = ttk.Style()
            print('\nDefault TButton layout:')
            print(style.layout('TButton'))
    
            print ('\nTButton Elements and their options:')
            print("border options: ", style.element_options('Button.border'))
            print("focus options: ",  style.element_options('Button.focus'))
            print("padding options: ",style.element_options('Button.padding'))
            print("label options: ",  style.element_options('Button.label'))
            print("arrow options: ",  style.element_options('Button.arrow'))
    
            print ('\nElement TButton.label and its options:')
            print("compound: ",  style.lookup('Button.label', 'compound'))
            print("space: ",     style.lookup('Button.label', 'space'))
            print("text: ",      style.lookup('Button.label', 'text'))
            print("font: ",      style.lookup('Button.label', 'font'))
            print("foreground: ",style.lookup('Button.label', 'foreground'))
            print("underline: ", style.lookup('Button.label', 'underline'))
            print("width: ",     style.lookup('Button.label', 'width'))
            print("anchor: ",    style.lookup('Button.label', 'anchor'))
            print("justify: ",   style.lookup('Button.label', 'justify'))
            print("wraplength: ",style.lookup('Button.label', 'wraplength'))
            print("embossed: ",  style.lookup('Button.label', 'embossed'))
            print("image: ",     style.lookup('Button.label', 'image'))
            print("stipple: ",   style.lookup('Button.label', 'stipple'))
            print("background: ",style.lookup('Button.label', 'background'))
    
            print ('\nElement TButton.arrow and its options:')
            print("background: ", style.lookup('Button.arrow', 'background'))
            print("relief: ",     style.lookup('Button.arrow', 'relief'))
            print("borderwidth: ",style.lookup('Button.arrow', 'borderwidth'))
            print("arrowcolor: ", style.lookup('Button.arrow', 'arrowcolor'))
            print("arrowsize: ",  style.lookup('Button.arrow', 'arrowsize'))
    
            #Define style Default.TButton with yellow background
            style.configure('Default.TButton', background='yellow')
            #Change the 2 options of the "label" element in its style's layout  
            style.configure('Default.TButton.label', foreground='red')
            style.configure('Default.TButton.label', borderwidth=20)
            print ('\nElement Default.TButton.label and its options (after configuration):')
            print("background: ",  style.lookup('Default.TButton.border', 'background'))
            print("borderwidth: ", style.lookup('Default.TButton.border', 'borderwidth'))
    
            #Approach 1
            #==========
            # Define style Left.TButton to show the following elements: leftarrow,
            #  padding, label 
            style.layout(
                'Left1.TButton',[
                    ('Button.focus', {'children': [
                        ('Button.leftarrow', None),
                        ('Button.padding', {'sticky': 'nswe', 'children': [
                            ('Button.label', {'sticky': 'nswe'}
                             )]}
                         )]}
                     )]
                )
            #Change 3 options of the "arrow" element in style "Left.TButton"
            style.configure('Left1.TButton.leftarrow',
                            background='white',
                            borderwidth=10,
                            arrowsize=20)
            print('\nElement TButton.arrow and its options (after changing):')
            print("background: ",  style.lookup('Left1.TButton.arrow','background'))
            print("borderwidth: ", style.lookup('Left1.TButton.arrow','borderwidth'))
            print("arrowsize: ",   style.lookup('Left1.TButton.arrow','arrowsize'))
    
            #Approach 2
            #==========
            style.layout(
                'Left2.TButton',[
                    ('Button.focus', {'children': [
                        ('Button.leftarrow', None),
                        ('Button.padding', {'sticky': 'nswe', 'children': [
                            ('Button.label', {'sticky': 'nswe'}
                             )]}
                         )]}
                     )]
                )
    
            style.configure('Left2.TButton',font=('','20','bold'), width=1, arrowcolor='white')
            #style.configure('Left2.TButton', width=1, arrowcolor='white', arrowsize='20')
            #option arrowsize does not work
    
    
        def setWidget(self):
            self.lbutton = ttk.Button(self.parent, style='Default.TButton',
                                      text='Default.TButton')
            self.lbutton1 = ttk.Button(self.parent, style='Left1.TButton',
                                       text='Left1.Button')
            self.lbutton2 = ttk.Button(self.parent, style='Left2.TButton',
                                       text='')
            self.lbutton.pack()
            self.lbutton1.pack()
            self.lbutton2.pack()
    
    
    if __name__ == '__main__':
        root = tk.Tk()
        root.title('Test')
        root.geometry('200x100')
        app = App(root)
        app.pack(expand=1, fill='both')