![CHANGING PROPERTIES OF WIDGETS
• COLOR AND FONT
• TO SPECIFY A COLOR, YOU CAN EITHER USE A COLOR NAME SUCH AS RED, YELLOW, GREEN, BLUE, WHITE, BLACK, PURPLE, ETC, OR EXPLICITLY SPECIFY THE RED, GREEN, AND BLUE
(RGB) COLOR COMPONENTS USING A STRING #RRGGBB, WHERE RR, GG, BB ARE HEXADECIMAL REPRESENTATIONS OF THE RED, GREEN AND BLUE VALUES, RESPECTIVELY.
• "TIMES 10 BOLD"
• "HELVETICA 10 BOLD ITALIC"
• "COURIER NEW 20 BOLD ITALIC"
• "COURIER NEW 20 BOLD ITALIC OVER STRIKE UNDERLINE"
• TEXT PROPERTIES
• THE TEXT IN A LABEL AND A BUTTON IS CENTERED
BY DEFAULT. YOU CAN CHANGE IT BY USING THE JUSTIFY
OPTION WITH VALUES LEFT, CENTER, OR RIGHT. YOU
CAN ALSO DISPLAY THE TEXT IN MULTIPLE LINES BY
INSERTING THE NEWLINE CHARACTER N TO SEPARATE TEXTS.
• MOUSE CURSOR
• YOU CAN SET A MOUSE CURSOR BY USING THE CURSOR OPTION WITH VALUES SUCH AS "ARROW" (DEFAULT), "CIRCLE", "CROSS" "PLUS", ETC.
• CODE: WIDGETNAME["PROPERTYNAME] = NEWPROPERTYVALUE](https://image.slidesharecdn.com/introductiontographics-160404115421/85/Introduction-to-Graphics-9-320.jpg)
![EXAMPLE
import tkinter
def btnNameProcess(name):
lblName["text"]= "Hey " + name
wind = tkinter.Tk()
wind.title("GUI Test Program")
wind.minsize(200,200)
lblName = tkinter.Label(wind, text ="Hey You", fg ="blue", bg = "#fff")
enterName = tkinter.StringVar() entName = tkinter.Entry(wind,text = "Me")
btnName = tkinter.Button(wind, text = "Press Me", command = lambda: btnNameProcess(entName.get()))
lblName.pack()
entName.pack()
btnName.pack()
wind.mainloop()](https://image.slidesharecdn.com/introductiontographics-160404115421/85/Introduction-to-Graphics-10-320.jpg)
Introduction to Graphics
- 2. INTRODUCTION TO TKINTER • UP TO THIS POINT WE HAVE BEEN CREATING CONSOLE BASED APPLICATIONS. • NOW WE ARE GOING TO COMBINE THAT KNOWLEDGE WITH THE OBJECTS WE STUDIED IN APPINVENTOR. • WE WILL BE USING THE MODULE TKINTER • THE TKINTER MODULE IS COMPRISED OF NUMEROUS CLASSES TO CREATE GUI WIDGETS. • CODE: FROM TKINTER IMPORT *
- 3. CREATING A GRAPHICAL ENVIRONMENT • THERE ARE 2 MAIN COMPONENTS TO A GUI. • 1. THE WINDOW/CONTAINER • 2. THE WIDGETS • LABELS, BUTTONS, TEXT BOXES, RADIO BUTTONS, IMAGES, ETC.
- 4. CREATING A WINDOW AND LABEL • LET’S BEGIN BY CREATING THE WINDOW, WHICH IS NOTHING MORE THAN A CONTAINER FOR OUR WIDGETS. • THE EQUIVALENT TO A SCREEN IN APPINVENTOR • CODE: WINDOWNAME = TK() • HOWEVER, THIS WINDOW WILL NOT DO MUCH FOR US UNLESS WE PACK IT WITH SOME CONTENT.
- 5. CREATING A LABEL • A LABEL IS A WIDGET THAT DISPLAYS INFORMATION. JUST LIKE IN APPINVENTOR. • CODE: LABELNAME = LABEL(WINDOWNAME, OPTIONS,…) • OPTIONS INCLUDE: • TEXT, IMAGES, COLORS, FONT, JUSTIFY, ETC… • EX. LBLPROMPT = LABEL(WIND, TEXT =“ HEY”, BG = “RED”) • AFTER YOU CREATE THE LABEL YOU HAVE TO PUT/PACK IT IN THE WINDOW. • CODE: LABELNAME.PACK() • NOTE: THERE ARE NUMEROUS OPTIONS TO EXPLORE
- 6. THE EVENT LOOP AND PROCESSING EVENTS • GUI’S ARE EVENT DRIVEN, MEANING THEY RUN WHEN SOME INTERACTION FROM THE USER OCCURS. • TO DETERMINE WHEN AN INTERACTION OCCURS YOU HAVE TO CREATE A LISTENER FOR EVERY PROGRAMMABLE ACTION THERE IS. • PYTHON MAKES THIS A BIT EASIER BY USING AN EVENT LOOP TO LISTEN FOR ANY INTERACTION. • CODE: WINDOWNAME.MAINLOOP()
- 7. EXAMPLE • QUESTION: HOW CAN WE MODIFY THE BELOW PROGRAM TO PROMPT THE USER TO ENTER A NAME AND THEN DISPLAY A WELCOME MESSAGE. IMPORT TKINTER WIND = TK() LBLNAME = LABEL(WIND, TEXT = “HEY YOU!”, FG = “BLUE”, FONT =(“HELVETICA, 16)) LBLNAME.PACK() WIND.MAINLOOP()
- 8. THE WIDGET CLASSES • WHEN CREATING A WIDGET THERE ARE SPECIFIC PARAMETERS FOR EACH TO SPECIFY. • WHERE TO PLACE IT • PROPERTIES • VARIABLES TO SET, ETC. Widget Class Description Button A simple button, used to execute a command. Checkbutton Clicking a check button toggles between the values. Radiobutton Clicking a radio button sets the variable to that value, and clears all other radio buttons associated with the same variable. Entry A text entry field, a.k.a a text field or a text box. Frame A container widget for containing other widgets. Menu A menu pane, used to implement pull down and popup menus. Menubutton A menu button, used to implement pull down menus. Label Displays a text or an image. Message Displays a text. Similar to the label widget, but can automatically wrap text to a given width or aspect ratio. Text Formatted text display. Allows you to display and edit text with various styles and attributes. Also supports embedded images and windows. Scale Allows you to set a numerical value by dragging a "slider". Canvas Structured graphics, used to draw graphs and plots, create graphics editors, and to implement custom widgets. Toplevel A container widget displayed as a separate, top-level window.
- 9. CHANGING PROPERTIES OF WIDGETS • COLOR AND FONT • TO SPECIFY A COLOR, YOU CAN EITHER USE A COLOR NAME SUCH AS RED, YELLOW, GREEN, BLUE, WHITE, BLACK, PURPLE, ETC, OR EXPLICITLY SPECIFY THE RED, GREEN, AND BLUE (RGB) COLOR COMPONENTS USING A STRING #RRGGBB, WHERE RR, GG, BB ARE HEXADECIMAL REPRESENTATIONS OF THE RED, GREEN AND BLUE VALUES, RESPECTIVELY. • "TIMES 10 BOLD" • "HELVETICA 10 BOLD ITALIC" • "COURIER NEW 20 BOLD ITALIC" • "COURIER NEW 20 BOLD ITALIC OVER STRIKE UNDERLINE" • TEXT PROPERTIES • THE TEXT IN A LABEL AND A BUTTON IS CENTERED BY DEFAULT. YOU CAN CHANGE IT BY USING THE JUSTIFY OPTION WITH VALUES LEFT, CENTER, OR RIGHT. YOU CAN ALSO DISPLAY THE TEXT IN MULTIPLE LINES BY INSERTING THE NEWLINE CHARACTER N TO SEPARATE TEXTS. • MOUSE CURSOR • YOU CAN SET A MOUSE CURSOR BY USING THE CURSOR OPTION WITH VALUES SUCH AS "ARROW" (DEFAULT), "CIRCLE", "CROSS" "PLUS", ETC. • CODE: WIDGETNAME["PROPERTYNAME] = NEWPROPERTYVALUE
- 10. EXAMPLE import tkinter def btnNameProcess(name): lblName["text"]= "Hey " + name wind = tkinter.Tk() wind.title("GUI Test Program") wind.minsize(200,200) lblName = tkinter.Label(wind, text ="Hey You", fg ="blue", bg = "#fff") enterName = tkinter.StringVar() entName = tkinter.Entry(wind,text = "Me") btnName = tkinter.Button(wind, text = "Press Me", command = lambda: btnNameProcess(entName.get())) lblName.pack() entName.pack() btnName.pack() wind.mainloop()