Skip to content

WebNinjaDeveloper.com

Programming Tutorials




Menu
  • Home
  • Youtube Channel
  • Sitemap
Menu

Python 3 tkTimePicker Example to Display TimePicker Widget in Tkinter GUI Desktop App Full Project

Posted on October 26, 2022

Welcome folks today in this blog post we will be displaying the timepicker widget in tkinter using the tktimepicker library. All the full source code of the application is shown below.

 

 

Get Started

 

 

In order to get started you need to install the below library using the pip command as shown below

 

 

pip install tktimepicker

 

 

After installing this library you need to make an app.py file and copy paste the following code

 

 

app.py

 

 

Python
1
2
3
4
5
6
7
8
9
10
11
12
import tkinter as tk
from tktimepicker import AnalogPicker, AnalogThemes
# note: you can also make use of mouse wheel or keyboard to scroll or enter the spin timepicker
root = tk.Tk()
 
time_picker = AnalogPicker(root)
time_picker.pack(expand=True, fill="both")
 
# theme = AnalogThemes(time_picker)
# theme.setDracula()
 
root.mainloop()

 

 

As you can see we are importing the tktimepicker library at the very top and then we are importing the AnalogPicker and Analog Themes. Various themes are supported by this library which are shown below

 

  1. clock timepicker
  2. old-spin timepicker
  3. modern-spin timepicker

 

 

As you can see we are setting the analogPicker class and then we are setting the dracula as the theme of the timepicker. Now if you execute the python file as shown below

 

 

python app.py

 

 

 

 

As you can see we can change the time of the hours and minutes and we can manually enter the time as well and also we can select the am and pm also.

 

 

Timepicker Themes

 

 

There are various themes available for this time picker which is shown below.

 

 

NavyBlue

NavyBlue

Dracula

Dracula

purple

Purple

Old-spin timepicker

old-spin timepicker

 

 

AnalogTime Picker Full Example

 

 

Now we will be seeing the analog clock timepicker example with the user having the capability to change the time as shown below

 

 

Python
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
import tkinter as tk
 
from tktimepicker import AnalogPicker, AnalogThemes, constants
 
 
def updateTime(time):
    time_lbl.configure(text="{}:{} {}".format(*time)) # remove 3rd flower bracket in case of 24 hrs time
 
 
def get_time():
 
    top = tk.Toplevel(root)
 
    time_picker = AnalogPicker(top, type=constants.HOURS12)
    time_picker.pack(expand=True, fill="both")
 
    theme = AnalogThemes(time_picker)
    # theme.setDracula()
    # theme.setNavyBlue()
    theme.setPurple()
    ok_btn = tk.Button(top, text="ok", command=lambda: updateTime(time_picker.time()))
    ok_btn.pack()
 
 
root = tk.Tk()
 
time = ()
 
time_lbl = tk.Label(root, text="Time:")
time_lbl.pack()
 
time_btn = tk.Button(root, text="Get Time", command=get_time)
time_btn.pack()
 
root.mainloop()

 

 

 

 

 

As you can see we have the simple button to get the current time and when we click the button a new popup window appears and we see here we will set the hours and minutes and also select am or pm.

 

 

Adding the Spin Time Picker Widget in Tkinter

 

 

Now for the second example we have the spin time picker widget to pick the time. This widget is also part of the library as shown below

 

 

app.py

 

 

Python
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
import tkinter as tk
from tktimepicker import SpinTimePickerModern, SpinTimePickerOld
from tktimepicker import constants
 
 
def updateTime(time):
    time_lbl.configure(text="{}:{}:{}".format(*time)) # if you are using 24 hours, remove the 3rd flower bracket its for period
 
 
def get_time():
 
    top = tk.Toplevel(root)
 
    time_picker = SpinTimePickerModern(top)
    # time_picker = SpinTimePickerOld(top)
    time_picker.addAll(constants.HOURS24)  # adds hours clock, minutes and period
    time_picker.configureAll(bg="#404040", height=1, fg="#ffffff", font=("Times", 16), hoverbg="#404040",
                            hovercolor="#d73333", clickedbg="#2e2d2d", clickedcolor="#d73333")
    time_picker.configure_separator(bg="#404040", fg="#ffffff")
    # time_picker.addHours12()
    # time_picker.addHours24()
    # time_picker.addMinutes()
 
    time_picker.pack(expand=True, fill="both")
 
    ok_btn = tk.Button(top, text="ok", command=lambda: updateTime(time_picker.time()))
    ok_btn.pack()
 
 
root = tk.Tk()
 
time = ()
 
time_lbl = tk.Label(root, text="Time:")
time_lbl.pack()
 
time_btn = tk.Button(root, text="Get Time", command=get_time)
time_btn.pack()
 
root.mainloop()

 

 

 

Recent Posts

  • Build a Fixed Deposit Interest Calculator Using Amount and Time in Browser Using HTML5 & Javascript
  • How to Download Files From URL in Node.js Using Node-Downloader-Helper Library
  • Angular 10 Image Carousel and Video Gallery Lightbox Modal Slider Using ng-image-slider Library
  • React Unsplash Api Photo Search App
  • React Form Validation Using Formik and Yup
  • Angular
  • Bunjs
  • C#
  • Deno
  • django
  • Electronjs
  • javascript
  • Koajs
  • Laravel
  • meteorjs
  • Nestjs
  • Nextjs
  • Nodejs
  • PHP
  • Python
  • React
  • Svelte
  • Tutorials
  • Vuejs




©2023 WebNinjaDeveloper.com | Design: Newspaperly WordPress Theme