{"id":1283,"date":"2020-11-26T09:35:39","date_gmt":"2020-11-26T09:35:39","guid":{"rendered":"https:\/\/www.pythontutorial.net\/?page_id=1283"},"modified":"2022-08-05T12:24:12","modified_gmt":"2022-08-05T12:24:12","slug":"tkinter-combobox","status":"publish","type":"page","link":"https:\/\/www.pythontutorial.net\/tkinter\/tkinter-combobox\/","title":{"rendered":"Tkinter Combobox"},"content":{"rendered":"\n

Summary<\/strong>: in this tutorial, you’ll learn to create a Tkinter combobox widget that allows users to select one value from a set of values.<\/p>\n\n\n\n

Introduction to the Tkinter Combobox widget #<\/a><\/h2>\n\n\n\n

A combobox is a combination of an Entry<\/a> widget and a Listbox<\/a> widget. A combobox widget allows you to select one value in a set of values. In addition, it allows you to enter a custom value.<\/p>\n\n\n\n

Create a combobox #<\/a><\/h3>\n\n\n\n

To create a combobox widget, you’ll use the ttk.Combobox()<\/code> constructor. The following example creates a combobox widget and links it to a string variable<\/a>:<\/p>\n\n\n

current_var = tk.StringVar()\ncombobox = ttk.Combobox(container, textvariable=current_var)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
The textvariable<\/code> argument links a variable current_var<\/code> to the current value of the combobox. <\/p>\n\n\n\n
To get the currently selected value, you can use the current_var variable: <\/p>\n\n\n
current_value = current_var.get()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Alternatively, you can use the get()<\/code> method of the combobox object:<\/p>\n\n\n
current_value = combobox.get()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
To set the current value, you use the current_var variable or  the set()<\/code> method of the combobox object:<\/p>\n\n\n
current_value.set(new_value)\ncombobox.set(new_value)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Define value list #<\/a><\/h3>\n\n\n\n
The combobox has the values<\/code> property that you can assign a list of values to it like this:<\/p>\n\n\n
combobox['values'<\/span>] = ('value1'<\/span>, 'value2'<\/span>, 'value3'<\/span>)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
By default, you can enter a custom value in the combobox. If you don’t want this, you can set the state<\/code> option to 'readonly'<\/code>:<\/p>\n\n\n
combobox['state'<\/span>] = 'readonly'<\/span><\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
To re-enable editing the combobox, you use the 'normal'<\/code> state like this:<\/p>\n\n\n
combobox['state'<\/span>] = 'normal'<\/span><\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Bind events #<\/a><\/h3>\n\n\n\n
When a select value changes, the combobox widget generates a '<<ComboboxSelected>>'<\/code> virtual event. To handle the event, you can use the bind() method like this:<\/p>\n\n\n
combobox.bind('<<ComboboxSelected>>'<\/span>, callback)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
In this example, the callback function will execute when the selected value of the combobox changes.<\/p>\n\n\n\n
Set the current value #<\/a><\/h3>\n\n\n\n
To set the current value, you use the set()<\/code> method:<\/p>\n\n\n
combobox.set(self, value)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Also, you can use the current()<\/code> method:<\/p>\n\n\n
current(self, newindex=None<\/span>)<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
The newindex<\/code> specifies the index of values from the list that you want to select as the current value.<\/p>\n\n\n\n
If you don’t specify the newindex<\/code>, the current()<\/code> method will return the index of the current value in the list of values or -1<\/code> if the current value doesn’t appear in the list.<\/p>\n\n\n\n
Python Tkinter combobox example #<\/a><\/h2>\n\n\n\n
The following program illustrates how to create a combobox widget:<\/p>\n\n\n
import<\/span> tkinter as<\/span> tk\nfrom<\/span> tkinter import<\/span> ttk\nfrom<\/span> tkinter.messagebox import<\/span> showinfo\nfrom<\/span> calendar import<\/span> month_name\n\nroot = tk.Tk()\n\n# config the root window<\/span>\nroot.geometry('300x200'<\/span>)\nroot.resizable(False<\/span>, False<\/span>)\nroot.title('Combobox Widget'<\/span>)\n\n# label<\/span>\nlabel = ttk.Label(text=\"Please select a month:\"<\/span>)\nlabel.pack(fill=tk.X, padx=5<\/span>, pady=5<\/span>)\n\n# create a combobox<\/span>\nselected_month = tk.StringVar()\nmonth_cb = ttk.Combobox(root, textvariable=selected_month)\n\n# get first 3 letters of every month name<\/span>\nmonth_cb['values'<\/span>] = [month_name[m][0<\/span>:3<\/span>] for<\/span> m in<\/span> range(1<\/span>, 13<\/span>)]\n\n# prevent typing a value<\/span>\nmonth_cb['state'<\/span>] = 'readonly'<\/span>\n\n# place the widget<\/span>\nmonth_cb.pack(fill=tk.X, padx=5<\/span>, pady=5<\/span>)\n\n\n# bind the selected value changes<\/span>\ndef<\/span> month_changed<\/span>(event)<\/span>:<\/span>\n    \"\"\" handle the month changed event \"\"\"<\/span>\n    showinfo(\n        title='Result'<\/span>,\n        message=f'You selected {selected_month.get()}<\/span>!'<\/span>\n    )\n\nmonth_cb.bind('<<ComboboxSelected>>'<\/span>, month_changed)\n\nroot.mainloop()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Output:<\/p>\n\n\n
\n
\"\"<\/figure>\n<\/div>\n\n\n
The following program shows the same month combobox widget and uses the set() method to set the current value to the current month:<\/p>\n\n\n
import<\/span> tkinter as<\/span> tk\nfrom<\/span> tkinter import<\/span> ttk\nfrom<\/span> tkinter.messagebox import<\/span> showinfo\nfrom<\/span> calendar import<\/span> month_name\nfrom<\/span> datetime import<\/span> datetime\n\nroot = tk.Tk()\n\n# config the root window<\/span>\nroot.geometry('300x200'<\/span>)\nroot.resizable(False<\/span>, False<\/span>)\nroot.title('Combobox Widget'<\/span>)\n\n# label<\/span>\nlabel = ttk.Label(text=\"Please select a month:\"<\/span>)\nlabel.pack(fill=tk.X, padx=5<\/span>, pady=5<\/span>)\n\n# create a combobox<\/span>\nselected_month = tk.StringVar()\nmonth_cb = ttk.Combobox(root, textvariable=selected_month)\n\n# get first 3 letters of every month name<\/span>\nmonth_cb['values'<\/span>] = [month_name[m][0<\/span>:3<\/span>] for<\/span> m in<\/span> range(1<\/span>, 13<\/span>)]\n\n# prevent typing a value<\/span>\nmonth_cb['state'<\/span>] = 'readonly'<\/span>\n\n# place the widget<\/span>\nmonth_cb.pack(fill=tk.X, padx=5<\/span>, pady=5<\/span>)\n\n\n# bind the selected value changes<\/span>\ndef<\/span> month_changed<\/span>(event)<\/span>:<\/span>\n    \"\"\" handle the month changed event \"\"\"<\/span>\n    showinfo(\n        title='Result'<\/span>,\n        message=f'You selected {selected_month.get()}<\/span>!'<\/span>\n    )\n\n\nmonth_cb.bind('<<ComboboxSelected>>'<\/span>, month_changed)\n\n# set the current month<\/span>\ncurrent_month = datetime.now().strftime('%b'<\/span>)\nmonth_cb.set(current_month)\n\nroot.mainloop()<\/code><\/span>Code language:<\/span> Python<\/span> (<\/span>python<\/span>)<\/span><\/small><\/pre>\n\n\n
Summary #<\/a><\/h2>\n\n\n\n
  • Use ttk.Combobox(root, textvariable)<\/code> to create a combobox.<\/li>
  • Set the state<\/code> property to readonly<\/code> to prevent users from entering custom values.<\/li>
  • A combobox widget emits the '<<ComboboxSelected>>'<\/code> event when the selected value changes.<\/li><\/ul>\n
    \n\t
    \n\t\t
    Was this tutorial helpful ?<\/div>\n\t\t
    \n\t\t\t\n\t\t\t\t\n\t\t\t\t\t<\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t Yes <\/span>\n\t\t\t<\/button>\n\n\t\t\t\n\t\t\t\t\n\t\t\t\t\t<\/path>\n\t\t\t\t<\/svg>\n\t\t\t\t No <\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t<\/header>\n\n\t
    \n\t\t
    \n\t\t\t
    <\/div>\n\t\t\t
The container<\/code> is the window<\/a> or frame<\/a> on which you want to place the combobox widget.<\/p>\n\n\n\n