如何在ttk.OptionMenu周围设置边框 [英] How to make border around ttk.OptionMenu

问题描述

在尝试制作输入框时，我遇到了一个问题，即我无法在ttk.OptionMenu周围加边框，以使其看起来与ttk.Entry类似. (彼此相邻的两个在图像中)

While trying to make an entry frame I ran into a problem where I can't make border around ttk.OptionMenu in order to make it look similiar to ttk.Entry. (The two next to each other are in image)

制作OptionMenu

Making OptionMenu

option = ttk.OptionMenu(bottom_container, self.have, 'ANY', 'ANY', '0', '1', style='vista.TMenubutton')
option.grid(column=1, row=2, sticky='we')

我尝试使用样式(希望仍然使用vista/winnative外观)，并且能够将optionmenu背景设置为白色，但是找不到适合其边框的方法

I tried using styles (want to still use vista/winnative look) and was able to make the optionmenu background white, but I couldn't find a way to fit in a border around it

推荐答案

这是我用于检查ttk小部件以便确定如何为其主题化的代码:

this is the code i use for inspecting ttk widgets with a view to working out how to theme them:

import tkinter as tk
from tkinter import ttk

root = tk.Tk()
var = tk.StringVar()
widget = ttk.OptionMenu(root, var, 'ANY', 'ANY', '0', '1')
widget.grid(column=2, row=1, sticky='nesw')


style = widget.winfo_class()

s = ttk.Style()
#s.theme_use('clam')
elements = s.layout(style)

def get_element_details(elem, _dict, depth=1):
    print('%selement: %s' % (''.join(['\t' for s in range(depth)]), elem))
    for key in _dict:
        if key != 'children':
            print('%s%s: %s' % (''.join(['\t' for s in range(depth+1)]), key, _dict[key]))
    print('%soption: %s' % (''.join(['\t' for s in range(depth+1)]), s.element_options(elem)))
    if 'children' in _dict:
        for child, child_dict in _dict['children']:
            get_element_details(child, child_dict, depth+1)

print('element: %s' % style)
print('option: %s' % str(s.element_options(style)))
for elem, elem_dict in elements:
    get_element_details(elem, elem_dict)
root.mainloop()

简单地说，无需将主题切换为蛤主题，便无需在窗口小部件中添加任何边框(我知道这很愚蠢)

and to put it simply without switching the theme to something like the clam theme there isn't any options in the widget to add a border (stupid I know)

我没有可测试的Vista主题，但是有了XP主题，我得到了:

i don't have the vista theme to test with, but with the XP theme i get:

element: TMenubutton
option: ()
    element: Menubutton.dropdown
        side: right
        sticky: ns
        option: ()
    element: Menubutton.button
        expand: 1
        sticky: nswe
        option: ()
        element: Menubutton.padding
            expand: 1
            sticky: we
            option: ('-padding', '-relief', '-shiftrelief')
            element: Menubutton.label
                sticky: 
                option: ('-compound', '-space', '-text', '-font', '-foreground', '-underline', '-width', '-anchor', '-justify', '-wraplength', '-embossed', '-image', '-stipple', '-background')

并带有蛤c主题:

element: TMenubutton
option: ()
    element: Menubutton.border
        sticky: nswe
        option: ('-bordercolor', '-lightcolor', '-darkcolor', '-relief', '-borderwidth')
        element: Menubutton.focus
            sticky: nswe
            option: ('-focuscolor', '-focusthickness')
            element: Menubutton.indicator
                sticky: 
                side: right
                option: ('-arrowsize', '-arrowcolor', '-arrowpadding')
            element: Menubutton.padding
                expand: 1
                sticky: we
                option: ('-padding', '-relief', '-shiftrelief')
                element: Menubutton.label
                    sticky: 
                    side: left
                    option: ('-compound', '-space', '-text', '-font', '-foreground', '-underline', '-width', '-anchor', '-justify', '-wraplength', '-embossed', '-image', '-stipple', '-background')

是否注意到边框元素的添加?

notice the addition of the border element?

，如果您尝试使用以下方法将蛤主题选项菜单的布局复制到另一个主题:

and if you try to copy the layout of the clam theme optionmenu to another theme using:

newlayout = [('Menubutton.border', {'children': [('Menubutton.focus', {'children': [('Menubutton.indicator', {'sticky': '', 'side': 'right'}), ('Menubutton.padding', {'sticky': 'we', 'expand': '1', 'children': [('Menubutton.label', {'sticky': '', 'side': 'left'})]})], 'sticky': 'nswe'})], 'sticky': 'nswe'})]
s.layout(style, newlayout)

结果是:

element: TMenubutton
option: ()
    element: Menubutton.border
        sticky: nswe
        option: ('-relief',)
        element: Menubutton.focus
            sticky: nswe
            option: ()
            element: Menubutton.indicator
                sticky: 
                side: right
                option: ('-direction', '-arrowsize', '-arrowcolor')
            element: Menubutton.padding
                sticky: we
                expand: 1
                option: ('-padding', '-relief', '-shiftrelief')
                element: Menubutton.label
                    sticky: 
                    side: left
                    option: ('-compound', '-space', '-text', '-font', '-foreground', '-underline', '-width', '-anchor', '-justify', '-wraplength', '-embossed', '-image', '-stipple', '-background')

，它不再具有用于实际设置边框的选项.本质上，主题引擎无法正确处理具有其期望的不同元素的布局.因此您需要选择一个主题，该主题的小部件包含您要设置样式的所有元素.

which no longer has options for actually setting the border. essentially the theme engine cannot properly handle layouts which have different elements to which it is expecting. so you will need to chose a theme which has widgets with all the elements you want to style.

这篇关于如何在ttk.OptionMenu周围设置边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！