Doposud jsme pracovali pouze v textovém režimu (IDLE). Do shellu (konzole) jsme z programu zapisovali výsledky pomocí funkce print().
Nyní zkusíme práci s modulem tkinter, který umožňuje tvorbu grafických aplikací. Využijeme jej na kreslení na tzv. plátno, ale modul umožňuje využití i jiných typů grafických prvků. Příkladem grafické aplikace, kompletně napsané v Pythonu a používající tkinter je vývojové prostředí IDLE
Základní grafická aplikace

Význam příkazů:
- import tkinter - vytvoří proměnnou tkinter, umožňující přístup k funkcím modulu.
- canvas = tkinter.Canvas() - vytvoří plátno grafické aplikace - přiřadili jsme jej do proměnné canvas (tím vznikne malá grafická aplikace (samostatné okno) a také plátno.
- canvas.pack() - umístí naše plátno do grafické aplikace (do okna). Plátno je připravené k práci.
- tkinter.mainloop() - grafická aplikace reaguje na klikání, posouvání, změnu velikosti, překreslování apod.

Implicitní rozměry plátna: 380 × 260 px, jdou nastavit libovolně (později)
Grafické příkazy
Syntaxe: canvas.create_<meno útvaru>(x, y, ..., <ďalšie parametre>)
všechny příkazy budou začínat canvas, za kterým bude samotný příkaz.
Význam: do grafické plochy canvas se nakreslí uvedený útvar, jeho poloha souvisí se souřednicemi(x, y) a někdy budeme kromě dalších souřadnic specifikovat i nějaké parametry.

Text v grafické ploše
Nejjednodušší grafický příkaz - na plátno zapíše nějaký text


Jak pracuje tkinter se souřadnicovou soustavou?
Klasicky: souřadnicové osy x a y jsou na sebe kolmé a protínají se v bodě (0, 0).

V počítačových programech se velmi často bod (0, 0) posouvá do levého horního okraje plátna, x-ová osa směřuje zleva doprava v horní straně plátna a y-ová osa směřuje shora dolů v levé straně plátna:

Využijme generátor náhodných čísel (modul random) na generovaní náhodných bodů v grafické ploše. Můžeme napsat:

Tento program na náhodnou pozici umístí text 'PYTHON'. Když jej zavoláme vícekrát, vypíše stejný text na jinou pozici. Příkazy, které generují náhodnou pozici a vypisují text necháme pomocí for-cyklu opakovat 10-krát:


Místo textu zobrazíme jednotlivé souřadnice. Dostáváme 100 náhodně vygenerovaných bodů:

Při vypisování textu pomocí create_text můžeme zobrazit jak textové řetězce a celočíselné proměnné, tak i např. takovéto dvojice:


Souřednice jednotlivých bodů označují přesný střed toohoto textu. Viz obrázek níže
text 'PYTHON' zobrazená je i poloha (x, y) v příkazu create_text:

Kreslení obdélníků
Příkaz: canvas.create_rectangle(x1, y1, x2, y2)

K definici obdélníka stačí libovolné dva protilehlé vrcholy. Nejčastěji to bude levý horní bod (x1, y1) a pravý dolní bod (x2, y2)

Nakreslí obdélník, jehož levý horní vrchol je (50, 30) a pravý dolní je (190, 110).

Obdélník lze definovat pomocí libovolných dvou protilehlých vrcholů -> stejný výsledek

Jak jinak definovat obdélník?

Nakreslíme 10 stejně velkých obdélníků na různá místa plátna:

Změníme náhodně i velikosti obdélníků (vintřní for-cyklus generuje náhodné hodnoty proměnných sirka a vyska):


Jde vybarvit plochu obdélníka?
canvas.create_rectangle(x, y, x + sirka, y + vyska, fill='red')

Jaké barvy můžeme používat?

proměnné barva1 a barva2 - názvy dvou zvolených barev
Ve for-cyklu pomocí proměnné barva1 vybarvíme obdélník a zaměníme barvy v proměnných.
Další obdélník se vybarví druhou barvou a celé se to opakuje...

Lze barvy zadat i jinak?
Pomocí tzv. RGB modelu: red (červená), green (zelená) a blue (modrá).Intenzita každé barevné složky je určená číslem mezi 0 a 255 (0 - není, 255 - maximální intenzita).

Zápis barvy je stejný jako v HTML: zapisuje se ve tvaru '#rrggbb', např. '#ffc0cb', kde ff - intenzita červené složky zapsaná v HEX soustavě (zde 255), c0 - intenzita zelené složky v šestnáctkové soustavě (zde 192) a cb - intenzita modré složky (zde 203)

Formát '{r:02x}' - hodnotu proměnné r zapisujeme na šířku 2, 0 - číslo bude zleva doplněné nulami a x - výpis bude v šestnáctkové soustavě.

Nakreslí stejné obdélníky a zvolené barvy se střídají.


Vygeneruje tři náhodná čísla z intervalu <0, 255> a z nich sestaví reprezentaci barvy v HEX soustavě. Pak vygeneruje síť různobarevných čtverců:

Jiné (rychlejší) generování náhodné barvy: barva = f'#{random.randrange(256**3):06x}'
Vygeneruje náhodné číslo z intervalu <0, 16777215>a toto číslo zapíše v HEX soustavě (tři dvojciferné RGB složky barvy) i se znakem # na začátku.

