Search Student

Above UI we are going to create by Tkinter for searching Student in our Hostel Management System desktop application. For that first we create a window and configure its title, size and color. Here we are creating a window at Top Level so we can add this window at the top of any other window.

    
        root = tk.Toplevel(self)
        root.title("Search Students")

        root.configure(bg="#585858")
        root.resizable(width=0, height=0)
        win_width = 1280

        win_height = int(1280 * 56.25 / 100)
        root.geometry(str(win_width) + "x" + str(win_height))

        # Get screen size
        screen_width = root.winfo_screenwidth()
        screen_height = root.winfo_screenheight()
        Util.set_font_size(screen_width, screen_height, win_width, win_height)

        self.width = win_width * 96 / 100
        self.height = win_height * 94 / 100
       

After creation of window, we will add a canvas background.

    
bg_canvas = RoundBackgroundFrame(root, self.width, self.height, padding, cornerradius, self.color, "#585858")
bg_canvas.place(width=self.width, height=self.height, x=win_width / 2 - self.width / 2,
                        y=win_height / 2 - self.height / 2)

class RoundBackgroundFrame(tk.Canvas):

    def __init__(self, parent, width, height, padding, cornerradius, color, bg):
        tk.Canvas.__init__(self, parent, borderwidth=0, relief="flat", highlightthickness=0, bg=bg)
        self.width = width
        self.height = height
        self.padding = padding
        self.cornerradius = cornerradius
        self.color = color

        original = Image.open( "images/corner.png")
        resized = original.resize((int(40), int(40)), Image.ANTIALIAS)
        self.image_r_t = ImageTk.PhotoImage(resized)

        original = original.rotate(90, expand=0)
        resized = original.resize((int(40), int(40)), Image.ANTIALIAS)
        self.image_l_t = ImageTk.PhotoImage(resized)

        original = original.rotate(90, expand=0)
        resized = original.resize((int(40), int(40)), Image.ANTIALIAS)
        self.image_l_b = ImageTk.PhotoImage(resized)

        original = original.rotate(90, expand=0)
        resized = original.resize((int(40), int(40)), Image.ANTIALIAS)
        self.image_r_b = ImageTk.PhotoImage(resized)

        self.shape(width, height, padding, cornerradius, color)
        (x0, y0, x1, y1) = self.bbox("all")
        width = (x1 - x0)
        height = (y1 - y0)
        self.configure(width=width, height=height)

    def shape(self, width, height, padding, cornerradius, color):
        self.create_polygon((padding, height - cornerradius - padding, padding, cornerradius + padding,
                                padding + cornerradius, padding, width - padding - cornerradius, padding,
                                width - padding, cornerradius + padding, width - padding,
                                height - cornerradius - padding, width - padding - cornerradius, height - padding,
                                padding + cornerradius, height - padding), fill=color, outline=color)

        self.create_image(width - self.image_r_t.width(), 0, image=self.image_r_t, anchor=NW)
        self.create_image(0, 0, image=self.image_l_t, anchor=NW)
        self.create_image(0, height - self.image_l_b.width(), image=self.image_l_b, anchor=NW)
        self.create_image(width - self.image_r_b.width(), height - self.image_r_b.width(), image=self.image_r_b, anchor=NW)


    

Once your window is created with custom background, we will create a frame with some reduced dimensions.

    
    self.width = self.width * 98 / 100
    self.height = self.height * 96 / 100
    self.base_frame = Frame(root, width=self.width, height=self.height, bg=self.color)
    bg_canvas.create_window(self.width / 100, self.height * 2 / 100, anchor=NW, window=self.base_frame)


    # Add Heading Name
    add_heading_label(self.base_frame, self.color, AppConstant.FONT_SIZE, self.height, self.width)

    def add_heading_label(base_frame, color, font_size, height, width):
        label_heading = Label(base_frame, text="Search Students", anchor=CENTER, bg=color,
                          font=("Lucida Grande", font_size + 6))
        label_heading.place(width=width * 90 / 100, height=height * 7 / 100, x=width * 5 / 100, y=height * 0.5 / 100)

    # Add line
    add_line_border(self.base_frame, self.color, self.height, self.width)

    def add_line_border(base_frame, color, height, width):
        line_canvas = Canvas(base_frame, bg=color, borderwidth=0, relief="flat", highlightthickness=0)
        line_canvas.place(width=width - 4, height=5, x=2, y=height * 10 / 100)
        line_canvas.create_line(0, 0, width, 0, fill="#787878")


    add_search_frame(self.base_frame, ("Lucida Grande", AppConstant.FONT_SIZE - 6), self.color, self.height,
                         self.width)
    def add_search_frame(base_frame, button_font, color, height, width):
        sfw = width * 0.95
        sfh = height * 0.87
        label_frame_search = LabelFrame(base_frame, text="Search", font=button_font, pady=sfw * 2 / 100,
                                        padx=sfw * 2 / 100, bg=color)
        label_frame_search.place(width=sfw, height=sfh, x=sfw * 0.02, y=height * 0.12)

        
    

Now Create a Search UI for Search Student in database. First we create a entry box to search Students with Student Id and Student Name.

    
    self.ce_student_var = CustomEntry(self.base_frame, 300, 55, 10, 2, self.color, "Search Student",
                                          "images/ic_search.png")
    self.ce_student_var.place(x=55, y=self.height * 0.20)
    self.student_var = tk.StringVar
    self.ce_student_var.entry.bind('', self.search_student)
     

Here's the logic to search data in table

    
    def search_student(self, *arg):

        # self.hide_edit_button()
        if self.ce_student_var.entry.get() != "":
            self.tree.delete(*self.tree.get_children())

            db = Util.connect_db()
            cursor = db.cursor()

            cursor.execute("SELECT `student_id`, `student_name`, `contact_no`, `email_id` FROM `student` WHERE `student_name` LIKE ? OR `student_id` LIKE ?",
                           ('%' + str(self.ce_student_var.entry.get()) + '%',
                            '%' + str(self.ce_student_var.entry.get()) + '%'))
            # cursor.execute('SELECT student_id, student_name, contact_no, email_id, address FROM student')
            self.sql_output = cursor.fetchall()

            count = 0
            room_no_list = []
            for data in self.sql_output:
                cursor.execute("SELECT room_number FROM room_alloted WHERE alloted_to = ?", (data[0],))
                sql_outputTwo = cursor.fetchall()
                numbers_tuple = (sql_outputTwo)

                cursor.execute("SELECT allotment_date FROM room_alloted WHERE alloted_to = ?", (data[0],))
                sql_outputThree = cursor.fetchall()
                numbers_tuple_two = (sql_outputThree)
                room_no_list.append((numbers_tuple, numbers_tuple_two, ""))
                self.tree.insert('', 'end', values=data + room_no_list[count])
                count += 1


            cursor.close()
            db.close()
        else:
            self.reset_search_student()

    def reset_search_student(self):
        self.tree.delete(*self.tree.get_children())
        self.get_student_data()

We have created a Database named "hostelmanagement.db", lets connect that database and put that code in seperate class "Util" because we are going to use it multiple time in our project.

    
class Util:

    @staticmethod
    def connect_db():
        db = None
        try:
            db = sql.connect("hostelmanagement.db")
            return db
        except sql.Error as error:
            print("Failed to insert data into sqlite table", error)


                

Fetch data from database and show it in table form with the use of "Treeview" of Tkinter.

    


    db = Util.connect_db()
    cursor = db.cursor()

    cursor.execute("SELECT `student_id`, `student_name`, `contact_no`, `email_id` FROM `student` WHERE `student_name` LIKE ? OR `student_id` LIKE ?",
                    ('%' + str(self.ce_student_var.entry.get()) + '%',
                    '%' + str(self.ce_student_var.entry.get()) + '%'))
    # cursor.execute('SELECT student_id, student_name, contact_no, email_id, address FROM student')
    self.sql_output = cursor.fetchall()

        style = ttk.Style()
        # style.element_create("Custom.Treeheading.border", "from", "default")
        style.layout("Custom.Treeview.Heading", [
            ("Custom.Treeheading.cell", {'sticky': 'nswe'}),
            ("Custom.Treeheading.border", {'sticky': 'nswe', 'children': [
                ("Custom.Treeheading.padding", {'sticky': 'nswe', 'children': [
                    ("Custom.Treeheading.image", {'side': 'right', 'sticky': ''}),
                    ("Custom.Treeheading.text", {'sticky': 'we'})
                ]})
            ]}),
        ])
        #   style.configure("Custom.Treeview.Heading", background="blue", foreground="red", relief="flat")
        style.map("Custom.Treeview.Heading", relief=[('active', 'groove'), ('pressed', 'sunken')])
        style.configure("Custom.Treeview", highlightthickness=0, bd=0, font=('Calibri', 11), rowheight=30)

        self.table_heading()

        self.tree = ttk.Treeview(self.base_frame, height=13, show='tree', style="Custom.Treeview")
        self.tree.tag_configure('odd', background='#DFEBF6', foreground="#000000", )
        self.tree.tag_configure('even', background='#FFFFFF', foreground="#000000", )
        self.tree.place(x=50, y=230)
        self.tree["columns"] = "1", "2", "3", "4", "5", "6", "7"
        self.tree.column("#0", width=0)
        self.tree.column("#1", width=150)
        self.tree.column("#2", width=150)
        self.tree.column("#3", width=150)
        self.tree.column("#4", width=150)
        self.tree.column("#5", width=180)
        self.tree.column("#6", width=130)
        self.tree.column("#7", width=170)


        vsb = ttk.Scrollbar(self.base_frame, orient="vertical", command=self.tree.yview)
        vsb.place(x=self.width - 70, y=230, height=395)

        self.tree.configure(yscrollcommand=vsb.set)

        self.get_student_data()

        self.tree.column("#1", anchor=tk.CENTER)
        self.tree.column("#2", anchor=tk.CENTER)
        self.tree.column("#3", anchor=tk.CENTER)
        self.tree.column("#4", anchor=tk.CENTER)
        self.tree.column("#5", anchor=tk.CENTER)
        self.tree.column("#6", anchor=tk.CENTER)
        self.tree.column("#7", anchor=tk.CENTER)


        root.attributes('-alpha', 0.0)
        Util.center(root)
        root.attributes('-alpha', 1.0)

                

We have created our own heading for table, lets configure it.

    
    def table_heading(self):

        heading_y = 203
        bg_color = "#2929ff"
        text_color = "#ffffff"

        canvas = Canvas(self.base_frame, width=1080, height=30)
        canvas.create_rectangle(0, 0, 1080, 30, fill=bg_color)
        canvas.place(x=50, y=heading_y - 3)

        student_id_label = Label(self.base_frame, text="Student Id",
                                 font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                 foreground=text_color)
        student_id_label.place(x=90, y=heading_y, width=110)
        student_id_label.configure(anchor="center")

        student_name_label = Label(self.base_frame, text="Name",
                                   font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                   foreground=text_color)
        student_name_label.place(x=250, y=heading_y, width=100)
        student_name_label.configure(anchor="center")

        student_contact_label = Label(self.base_frame, text="Contact No",
                                      font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                      foreground=text_color)
        student_contact_label.place(x=385, y=heading_y, width=120)
        student_contact_label.configure(anchor="center")

        student_email_label = Label(self.base_frame, text="Email Id",
                                    font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                    foreground=text_color)
        student_email_label.place(x=520, y=heading_y, width=120)
        student_email_label.configure(anchor="center")

        student_adds_label = Label(self.base_frame, text="Address",
                                   font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                   foreground="white")
        student_adds_label.place(x=710, y=heading_y, width=110)
        student_adds_label.configure(anchor="center")

        student_room_no_label = Label(self.base_frame, text="Room No",
                                   font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                   foreground="white")
        student_room_no_label.place(x=865, y=heading_y, width=110)
        student_room_no_label.configure(anchor="center")

        date_label = Label(self.base_frame, text="Alloted Date",
                                      font=('Calibri', AppConstant.FONT_SIZE - 3, 'bold'), background=bg_color,
                                      foreground="white")
        date_label.place(x=990, y=heading_y, width=130)
        date_label.configure(anchor="center")
        

At last we will manage closing of window

    
    def on_closing():
            root.destroy()
            args[0].deiconify()

    root.protocol("WM_DELETE_WINDOW", on_closing)