5. Farby pri kreslení obdĺžnikov

Zopakujme si:

  • program, ktorý kreslí do grafickej plochy, musí začínať tromi špeciálnymi riadkami:

    import tkinter
    platno = tkinter.Canvas()
    platno.pack()
    

Zafarbíme útvary

Každý kreslený útvar môže byť zafarbený rôznymi farbami. Napr. vieme zafarbiť nielen vnútro obdĺžnika, ale aj obrysové úsečky. Pre nás budú najužitočnejšie tieto farby:

  • blue - modrá

  • red - červená

  • green - zelená

  • yellow - žltá

  • gray - šedá

  • black - čierna

  • white - biela

Môžete ich vidieť:

_images/05_01.png

Python používa veľkú škálu preddefinovaných (vyše 500) farieb. Tu môžete vidieť ukážku niekoľkých z nich:

_images/05_02.png

Už vieme, že Python dokáže zafarbovať útvary pomocou mien farieb. Robíme to tak, že do príkazu create_rectangle môžeme pridať ďalšie parametre, ktoré upresňujú napr. farebnosť útvaru. Pre obdĺžniky sú to dva parametre: tzv. fill, ktorý určuje výplň a outline, ktorý určuje farbu obrysových čiar obdĺžnika. Zatiaľ sme tieto parametre nenastavovali, preto sa obdĺžniky kreslili bez výplne (mali priesvitné vnútro) s čiernym obrysom.

Tieto dva nové parametre sa zapisujú za štyri čísla, ktoré určujú súradnice obdĺžnika. Ukážme to na príklade, v ktorom nakreslíme 4 obdĺžniky:

# program kresli farebne obdlzniky

import tkinter

platno = tkinter.Canvas()
platno.pack()

# bez vyplne s ciernym obrysom:
platno.create_rectangle(30, 30, 130, 130)

# cervena vypln s ciernym obrysom:
platno.create_rectangle(30, 150, 130, 250, fill='red')

# bez vyplne so zelenym obrysom:
platno.create_rectangle(150, 30, 250, 130, outline='green')

# zlta vypln s modrym obrysom:
platno.create_rectangle(150, 150, 250, 250, fill='yellow', outline='blue')

Dostávame tieto útvary v grafickej ploche:

_images/05_03.png

Parametre fill, resp. outline píšeme za súradnice vrcholov, dávame za ne znak rovná sa a meno farby v tvare znakový reťazec. Zrejme si meno farby nemôžeme vymyslieť podľa ľubovôle, ale musíme sa trafiť do jednej z Pythonovských farieb. 1

Asi ste si všimli, že farbu obrysu až tak veľmi vidieť nie je: keďže sú tieto obrysové čiary veľmi tenké, ťažšie sa odlíši, či je čiara čierna, zelená alebo modrá. Tu sa nám môže hodiť parameter width, ktorým zmeníme hrúbku obrysových čiar. Už vieme, že štandardne je to 1, ale jednoducho môžeme zmeniť aj toto. Predchádzajúci program upravíme tak, že každému z obdĺžnikov nastavíme nejakú hrúbku:

# program kresli farebne obdlzniky s hrubsimi ramikmi

import tkinter

platno = tkinter.Canvas()
platno.pack()

# bez vyplne s ciernym obrysom:
platno.create_rectangle(30, 30, 130, 130, width=10)

# cervena vypln s ciernym obrysom:
platno.create_rectangle(30, 150, 130, 250, width=6, fill='red')

# bez vyplne so zelenym obrysom:
platno.create_rectangle(150, 30, 250, 130, width=16, outline='green')

# zlta vypln s modrym obrysom:
platno.create_rectangle(150, 150, 250, 250, width=4, fill='yellow', outline='blue')

Takto sa zmenia nakreslené útvary:

_images/05_04.png

Všimnite si, že pomocou parametra width môžeme vytvárať rôzne hrubé rámiky. Ak by sme ale potrebovali rámik úplne zrušiť, nastavíme mu hrúbku obrysu width=0 alebo farbu obrysu nastavíme na priesvitnú outline=''.

Nakreslime dva farebné obdĺžniky, ktoré sa čiastočne prekrývajú:

# program nakresli prekryvajuce sa obdlzniky

import tkinter

platno = tkinter.Canvas()
platno.pack()

platno.create_rectangle(30, 50, 230, 150, fill='tomato', outline='')
platno.create_rectangle(80, 60, 210, 160, fill='dodger blue')
platno.create_rectangle(130, 40, 260, 140, fill='violet', width=0)

Všimnite si, že neskôr nakreslený útvar prekrýva tie, ktoré už boli nakreslené skôr:

_images/05_05.png

Toto je veľmi dôležitá vlastnosť, ktorú si treba uvedomiť vždy vtedy, keď sa obrázok skladá z viacerých prekrývajúcich sa útvarov.

Doteraz mala naša grafická plocha šedé pozadie. Niekedy sa nám môže ale hodiť, aby malo plátno inú farbu hneď na začiatku. Hoci sa to dá urobiť pomocou veľkého obdĺžnika, ktorému nastavíme väčšie rozmery, ako sú rozmery plátna, napr.

import tkinter

platno = tkinter.Canvas()
platno.pack()

platno.create_rectangle(0, 0, 400, 300, fill='paleGreen')

platno.create_rectangle(30, 50, 230, 150)

Dostaneme:

_images/05_06.png

Podobný výsledok ale dosiahneme, keď už pri vytváraní plátna mu pomocou parametra bg nastavíme farbu pozadia:

import tkinter

platno = tkinter.Canvas(bg='paleGreen')
platno.pack()

platno.create_rectangle(30, 50, 230, 150)

Zrejme, toto riešenie má tú výhodu, že bude fungovať, aj keď sa neskôr naučíme meniť veľkosť grafickej plochy.

RGB model

Z informatiky na predchádzajúcich hodinách pravdepodobne viete, že jedným z modelov, ako sa v počítači dajú „namiešať“ farby je tzv. RGB model. V tomto modeli sa každá farba skladá z troch zložiek: červenej (Red), zelenej (Green) a modrej (Blue). V závislosti od toho, koľko ktorej zložky namiešame, dostávame rôzne farby. Najčastejšie sa množstvá zložiek určujú číslami od 0 do 255, kde 0 označuje, že danú zložku nepoužijeme vôbec a 255 označuje, že ju použijeme v maximálnom možnom množstve. Napr. oranžová farba (orange) vzniká tak, že zoberieme maximum červenej (teda 255), pridáme dosť aj zelenej (165) a modrej nedáme vôbec. Toto budeme zapisovať takouto trojicou čísel (255, 165 0), teda presne v poradí koľko je tam červenej, koľko zelenej a koľko modrej zložky.

Tyrkysová farba cyan je reprezentovaná trojicou (0, 255, 255), čo označuje, že v nej úplne chýba červená zložka a zelená a modrá je na maxime. Už si len zapamätajme, že bile farba white má trojicu (255, 255, 255) a čierna black (0, 0, 0).

Samozrejme, že sa tieto trojice nemusíme učiť naspamäť. Na tomto mieste to pripomíname preto, že aj v Pythone môžeme určovať farby pomocou trojíc čísel RGB modelu. Hoci nie je to veľmi jednoduché, ale tí z vás, ktorí máte skúsenosti so 16-ovou sústavou, resp. s kódovaním farieb v HTML stránkach, môžete pochopiť, ako zakódujete ľubovoľnú RGB trojicu do mena farby:

'#rrggbb'

Teda namiesto mena farby použijeme šestnástkový zápis jednotlivých zložiek ako dve šestnástkové cifry pre červenú rr, dve cifry gg pre zelenú a dve cifry bb pre modrú zložku. Oranžovú farbu orange teda môžeme teda zapísať aj ako '#ffa500', čo zodpovedá trojici (255, 165, 0).

Úlohy

  1. Napíšte program, ktorý nakreslí tri farebné obdĺžniky vo farbách slovenskej trikolóry:

    _images/05_07.png

    Navrhnite to tak, aby veľkosti týchto farebných obdĺžnikov boli: 200x150, 200x100, 200x50. Môžete zvoliť nejaké tri iné rôzne farby (pre trikolóru iného štátu).

  1. Nasledovný obrázok vznikol zo štyroch štvorcov. Prvý z nich má súradnice ľavého horného vrcholu (50, 50). Napíšte program, ktorý nakreslí tieto štyri prekrývajúce sa štvorce. Zvoľte si ľubovoľné štyri rôzne farby (môžu byť iné ako na tomto obrázku):

    _images/05_08.png

  1. Týchto 5 volaní create_rectangle nakreslí nejaký obrázok. Prepíšte program tak, aby sa nakreslil presne taký isý obrázok, ale len s tromi volaniami create_rectangle:

    platno.create_rectangle(90, 90, 150, 150, fill='yellow')
    platno.create_rectangle(150, 90, 210, 150, fill='red')
    platno.create_rectangle(90, 150, 150, 210, fill='green')
    platno.create_rectangle(30, 90, 90, 150, fill='red')
    platno.create_rectangle(90, 30, 150, 90, fill='green')
    

  1. Nakreslite slovenský dvojkríž, napr.

    _images/05_09.png

  1. Zo štyroch úzkych obdĺžnikov vytvorte takýto rámik:

    _images/05_10.png

Zhrnutie

čo sme sa naučili:

  • Príkaz create_rectangle na kreslenie obdĺžnikov má prvé štyri parametre číselné (súradnice vrcholov obdĺžnika) a za tým môže mať ďalšie parametre, ktorými sa nastavujú farby a hrúbka čiar.

  • Farby sa zadávajú ako znakové reťazce buď ich menami (napr. 'blue' alebo 'white') alebo šestnástkovými kódmi RGB reprezentácie (napr. '#00ffff' pre tyrkysovú farbu cyan).


1

Python pri menách farieb nerozlišuje malé a veľké písmená a viacslovné mená dovolí rozdeliť na viac slov. napr. 'SkyBlue' môžeme zapísať napr. aj ako 'sky blue'.