In this article, we are going to learn how to create a time picker using kivyMD in Python programming language.
Create time Picker Using KivyMD
In addition to the Kivy framework is KivyMD. A set of Material Design widgets for use with the Kivy GUI framework which is used to create mobile applications. The Kivy framework is comparable, however, it offers a more appealing GUI. To install the kivymd package execute the below command in the command prompt or terminal.
pip install kivymd
Method 1
In this method, we are going to create a time picker using Python’s kivymd package without using Kv language. Let’s see the stepwise implementation of the code.
Step 1: Importing packages
Python3
# Importing Required Packagesfrom datetime import datetimefrom kivymd.app import MDAppfrom kivymd.uix.screen import Screenfrom kivymd.uix.picker import MDTimePicker |
Step 2: First, we will define our main app class. In which we will be using Screen() to call our layout. Before we show the time picker we need to set a default value in our time picker so to do that we will be using strptime() to convert string to time format. Now we will be calling time picker using MDTimePicker() and to set default time we will use set_time() and pass default time in it. To display the time picker we will be using open() and return the screen.
Python3
# app classclass MainApp(MDApp): # defining app def build(self): # calling screen screen = Screen() # converting string to time format previous_time = datetime.strptime("12:00:00", '%H:%M:%S').time() # calling MDTimePicker t = MDTimePicker() # setting up default time t.set_time(previous_time) # opens Time picker t.open() # returning screen return screen# running appMainApp().run() |
Complete code:
Python3
# importing packagesfrom datetime import datetimefrom kivymd.app import MDAppfrom kivymd.uix.screen import Screenfrom kivymd.uix.pickers import MDTimePicker# app classclass MainApp(MDApp): # defining app def build(self): # calling screen screen = Screen() # converting string to time format previous_time = datetime.strptime("12:00:00", '%H:%M:%S').time() # calling MDTimePicker t = MDTimePicker() # setting up default time t.set_time(previous_time) # opens Time picker t.open() # returning screen return screen# running appMainApp().run() |
Output:
Method 2
In this method, we are going to use Kv language along with the python code to create the time picker. Let’s see the stepwise implementation of the code.
Step 1. Firstly, we will need Builder, MDTimePicker, MDApp from kivymd, and the datetime package. so, let’s import them.
Note: We will not be importing MDFloatLayout and MDRaisedButton because we are designing our screen using the Kv language.
Python3
# importing packagesfrom kivy.lang import Builderfrom datetime import datetimefrom kivymd.app import MDAppfrom kivymd.uix.picker import MDTimePicker |
Step 2. We will be designing our layout using the Kv language. To do so, we will declare the Layout widget class called MDFloatLayout and then the child widget class called MDRaisedButton. We won’t pass any parameters to MDFloatLayout and keep it default.
For MDRaisedButton we will pass its location in x,y coordinate form. center_x is used for the x coordinate whereas center_y is used for the y coordinate. Now we will be creating a trigger event to show the time picker which can be done using on_release and we will pass our time picker function in it which we will be defining in our main function.
Python3
# writing kv langKV = '''# declaring layoutMDFloatLayout: # creating a button MDFillRoundFlatButton: text: "Set Time" pos_hint: {'center_x': .5, 'center_y': .5} # creating button event # this will trigger time_picker on_release: app.show_time_picker()''' |
Step 3. To run the Kv file we will be using load_string() and pass our Kv language in it. So we will define a function for this named build() and on-call it will load Kv and return the screen. run() is used to run the class and it does not require any parameters.
We will be defining another function to show the time picker. First, we will get time to set as the default value for our time picker, to do so we will be using strptime() to convert string into time format using datetime package and store it in a variable for future use. Now we will be using MDTimePicker() to get a time picker. To set the default time in the time picker we use set_time() and pass the default time variable we defined a few couples of lines before and at last we will use open() function to display the time picker.
Python3
# main app classclass Main(MDApp): def build(self): return Builder.load_string(KV) # creating a function for time_picker def show_time_picker(self): # converting string to time format default_time = datetime.strptime("12:00:00", '%H:%M:%S').time() # gets time picker t = MDTimePicker() # Setting the default time for time picker t.set_time(default_time) # opens time picker t.open()# running appMain().run() |
Complete Code:
Python3
# importing packagesfrom kivy.lang import Builderfrom datetime import datetimefrom kivymd.app import MDAppfrom kivymd.uix.pickers import MDTimePicker# writing kv langKV = '''# declaring layoutMDFloatLayout: # creating a button MDFillRoundFlatButton: text: "Set Time" pos_hint: {'center_x': .5, 'center_y': .5} # creating button event # this will trigger time_picker on_release: app.time_picker()'''# main app classclass Main(MDApp): def build(self): return Builder.load_string(KV) # creating a function for time_picker def time_picker(self): # converting string to time format default_time = datetime.strptime("12:00:00", '%H:%M:%S').time() # gets time picker t = MDTimePicker() # Setting the default time for time picker t.set_time(default_time) # opens time picker t.open()# running appMain().run() |
Output:
