如何在tkinter.ttk.Button中创建箭头并控制其大小？

Question

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

我发现'TButton'本质上包含StyleNames TButton.leftarrow ，而ttk.Style（）。layout（）没有公开。

问题： （1）如何激活这些样式名？ （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')

Answer 1

经过大量尝试并仔细研究了ttk文档，我发现了以下内容：

1. 要在按钮中创建箭头，我必须在用于ttk.Button()小部件的自定义样式的布局中，将arrow元素声明为focus元素的子元素。 为此，我需要使用ttk.Style().layout()方法。
2. 箭头的大小取决于标签元素的字体大小。 因此，必须在样式TButton布局中声明label元素。 arrowleft元素的arrowsize选项似乎不起作用。 我已注释掉这行代码，但行不通。 但是， leftarrow元素的arrowcolor选项确实起作用。 为了调整label元素的字体大小，使用了ttk.Style().configuration方法。

测试脚本中的方法2演示了我的问题的解决方案。

测试代码：

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')