Obsah
1. Práce s textovými objekty v GIMPu
2. Vytvoření textového objektu pomocí skriptu
3. První demonstrační příklad – vypsání textu do obrázku
4. Druhý demonstrační příklad – interaktivní nastavení vlastností textového objektu
5. Cesty v grafickém editoru GIMP
7. Základní vlastnosti Bézierových křivek
8. Obsah následující části seriálu
1. Práce s textovými objekty v GIMPu
V předchozích třech částech seriálu o tvorbě skriptů pro známý rastrový grafický editor GIMP jsme si kromě dalších informací popsali i práci s výběry (selections); například jsme si ukázali, jak lze výběry vytvářet přímo ve skriptech s využitím základních geometrických tvarů (elipsy/kružnice a obdélníka/čtverce) a množinových operací (sjednocení dvou množin, doplňku množin a inverze množiny). Také jsme si řekli, jakým způsobem se ve skriptech pracuje s vrstvami neboli hladinami (layers). S výběry i hladinami však poměrně úzce souvisí i problematika práce s takzvanými textovými objekty, s jejichž využitím je možné do editovaných obrázků vykreslovat textové řetězce, vytvářet výběry, jejichž tvar je odvozen z tvarů znaků ve fontu, převádět texty na cesty (paths) atd.
Obrázek 1: Po zvolení nástroje pro psaní textů se v obrázku vytvoří nová hladina nesoucí všechny potřebné metainformace o vytvořeném textu. S touto hladinou je posléze možné provádět množství dalších operací.
Grafický editor GIMP obsahuje od své verze 2.0 nástroj pro vytvoření textového objektu, na nějž se můžeme z uživatelského hlediska dívat jako na zvláštní typ hladiny vytvořené ve chvíli zápisu textového řetězce do dialogového okna. Textová hladina se liší od běžných „rastrových“ hladin (nesoucích informace o barvách jednotlivých pixelů) především v tom ohledu, že jsou v ní uloženy všechny potřebné metainformace o zapsaném textu. Například se jedná o font vybraný uživatelem ve speciálním dialogu, zvolenou velikost tohoto fontu, způsob zarovnání textu, směr psaní textu atd. Tyto informace mohou být kdykoli uživatelem (a samozřejmě i skriptem) změněny, což se ihned projeví na vizuální podobě vypsaného textu.
Obrázek 2: Textový objekt lze převést například na výběr a poté s tímto výběrem provádět všechny operace, které je možné aplikovat i na výběry vytvořené jinými prostředky grafického editoru GIMP.
Teprve ve chvíli, kdy je textová hladina zrušena, například kvůli svému spojení (merge) s jinou hladinou, jsou ztraceny i všechny metainformace o textu, z něhož se tak stane „pouze“ množství obarvených pixelů. S textovým objektem je však možné provádět i některé další operace, například převod textu na výběr (selection) či transformaci textu na cestu (path). Díky tomu je například možné provádět různé deformace textu nikoli na úrovni rastrového obrázku (při nichž by docházelo ke ztrátě informace), ale na úrovni vektorového popisu textu, což je problematika, kterou se budeme podrobněji zabývat ve druhé polovině dnešního článku.
Obrázek 3: Textový objekt po svém převedení na výběr (selection) a následném zobrazení výběru v režimu rychlé masky (Quick Mask) vyvolaného buď z menu nebo klávesovou zkratkou Shift+Q.
2. Vytvoření textového objektu pomocí skriptu
V této kapitole si řekneme, jakým způsobem je možné textový objekt vytvořit pomocí skriptu a jak lze následně tento objekt vykreslit do aktivní (vybrané) hladiny. Pro tyto účely jsou v aplikačním programovém rozhraní (API) grafického editoru GIMP vyhrazeny dvě funkce. První z těchto funkcí, jež se jmenuje gimp-text-fontname, slouží k vlastnímu vytvoření textového objektu – ten lze vytvořit buď ve formě nové textové hladiny (s vlastnostmi popsanými v předchozí kapitole) nebo ve formě takzvaného plovoucího výběru (floating selection). V případě, že je textový objekt vytvořen ve formě výběru, lze ho „uchytit“ do vybrané hladiny pomocí funkce gimp-floating-sel-anchor. Po provedení této dvojice funkcí je text vykreslen (rozrastrován) do vybrané hladiny.
Obrázek 4: Nový plnobarevný (truecolor) obrázek o rozměrech 400×400 pixelů vytvořený přímo v GIMPu, který bude použit pro otestování funkcionality prvního demonstračního příkladu.
Zatímco se funkci gimp-floating-sel-anchor předává pouze plovoucí výběr, který se má ukotvit v aktivní hladině, je počet parametrů funkce gimp-text-fontname mnohem vyšší, což je ostatně patrné při pohledu na následující tabulku, v níž jsou parametry této funkce popsány:
| Pořadí parametru | Význam |
|---|---|
| 1 | identifikátor obrázku, v němž se má textový objekt vytvořit |
| 2 | identifikátor hladiny v případě, že se textový objekt vytváří ve formě plovoucího výběru |
| 3 | x-ová souřadnice počátku textového objektu |
| 4 | y-ová souřadnice počátku textového objektu |
| 5 | vlastní text, který se má vykreslit |
| 6 | šířka okraje |
| 7 | povolení či zákaz antialiasingu |
| 8 | velikost textu zadaná buď v bodech nebo pixelech |
| 9 | volba jednotek, v nichž je specifikovaná velikost textu (body, pixely) |
| 10 | jméno fontu, který se má použít pro vytvoření textového objektu |
Obrázek 5: Po spuštění prvního demonstračního příkladu se do obrázku (přesněji řečeno do jeho aktivní hladiny) vykreslí text zvolenou barvou.
3. První demonstrační příklad – vypsání textu do obrázku
První demonstrační příklad po svém spuštění vytvoří v aktivním obrázku a ve vybrané hladině plovoucí výběr s textem a následně tento výběr v hladině ukotví, čímž dojde k vykreslení textu. Uživatel přitom nemusí specifikovat žádné parametry, protože všechny potřebné parametry vyžadované funkcí gimp-text-fontname jsou ve skriptu uloženy ve formě konstant, takže je první demonstrační příklad z tohoto hlediska poměrně jednoduchý:
; Skriptování v GIMPu (páté pokračování)
; Demonstrační příklad číslo 1
(define (script-fu-text-demo
selected-image
selected-layer
)
(define (create-text-object selected-image selected-layer)
(car (gimp-text-fontname
selected-image ; obrázek, do kterého se má text vykreslit
selected-layer ; hladina pro vytvoření textového objektu
5 150 ; souřadnice, na něž se textový objekt vloží
"www.root.cz" ; text, který se má vykreslit
0 ; šířka okraje
1 ; povolení antialiasingu
64 ; velikost textu
0 ; jednotky pro zadání velikosti: pixely
"Sans" ; jméno fontu
)))
; vložení značky začátku skupiny operací, které mohou
; být vráceny jediným příkazem UNDO (CTRL+Z)
(gimp-undo-push-group-start selected-image)
; vytvoření a následné uchycení textového objektu
(gimp-floating-sel-anchor (create-text-object selected-image selected-layer))
; ukončení skupiny operací, které mohou
; být vráceny jediným příkazem UNDO (CTRL+Z)
(gimp-undo-push-group-end selected-image)
; přinutíme GIMP, aby finální obrázek překreslil
(gimp-displays-flush)
)
; základní informace o skriptu a definice dialogu
; zobrazeného uživateli
(script-fu-register
"script-fu-text-demo"
"Text demo"
"Basic manipulation with the text object"
"Pavel Tisnovsky"
"Pavel Tisnovsky"
"2010-06-01"
"RGB*, GRAY*"
SF-IMAGE "Image" 0
SF-DRAWABLE "Layer" 0
)
; registrace skriptu do menu
(script-fu-menu-register "script-fu-text-demo"
"<Image>/Root.cz")
; finito
Obrázek 6: GIMP plně podporuje kódování UTF-8, takže je možné pracovat jak s českými znaky, tak i s řeckou abecedou či azbukou.
4. Druhý demonstrační příklad – interaktivní nastavení vlastností textového objektu
Druhý skript, který si v dnešním článku popíšeme a ukážeme, vychází z prvního demonstračního příkladu, od kterého se však v několika ohledech odlišuje; především existencí dialogu zobrazeného po spuštění skriptu, v němž je možné zadat některé parametry vykreslovaného textu. Jedná se například o výběr fontu (po stisku příslušného tlačítka se zobrazí nový dialog s náhledem všech fontů dostupných GIMPu), volbu velikosti písma, povolení či zákaz antialiasingu (zahlazování hran znaků) při vykreslování a nakonec i šířku okraje textového objektu. Do příslušného textového řádku lze samozřejmě vepsat i text, který se má vykreslit. Všechny uživatelem zadané parametry jsou předány do skriptu, v němž jsou využity při volání výše popsané funkce gimp-text-fontname.
Obrázek 7: Dialog zobrazený po spuštění druhého demonstračního příkladu
Následuje výpis zdrojového kódu druhého demonstračního příkladu:
; Skriptování v GIMPu (páté pokračování)
; Demonstrační příklad číslo 2
(define (script-fu-text-demo2
selected-image
selected-layer
input-text
selected-font
text-size
antialias
border-size
)
(define (create-text-object selected-image selected-layer
antialias text-size border-size input-text selected-font)
(car (gimp-text-fontname
selected-image ; obrázek, do kterého se má text vykreslit
selected-layer ; hladina pro vytvoření textového objektu
5 150 ; souřadnice, na něž se textový objekt vloží
input-text ; text, který se má vykreslit
border-size ; šířka okraje
antialias ; povolení antialiasingu
text-size ; velikost textu
0 ; jednotky pro zadání velikosti: pixely
selected-font ; jméno fontu
)))
; vložení značky začátku skupiny operací, které mohou
; být vráceny jediným příkazem UNDO (CTRL+Z)
(gimp-undo-push-group-start selected-image)
; vytvoření a následné uchycení textového objektu
(gimp-floating-sel-anchor (create-text-object selected-image selected-layer
antialias text-size border-size input-text selected-font))
; ukončení skupiny operací, které mohou
; být vráceny jediným příkazem UNDO (CTRL+Z)
(gimp-undo-push-group-end selected-image)
; přinutíme GIMP, aby finální obrázek překreslil
(gimp-displays-flush)
)
; základní informace o skriptu a definice dialogu
; zobrazeného uživateli
(script-fu-register
"script-fu-text-demo2"
"Text demo 2"
"Basic manipulation with the text object"
"Pavel Tisnovsky"
"Pavel Tisnovsky"
"2010-06-01"
"RGB*, GRAY*"
SF-IMAGE "Image" 0
SF-DRAWABLE "Layer" 0
SF-STRING "Text" "www.root.cz"
SF-FONT "Font" "Sans"
SF-ADJUSTMENT "Text size" '(10 1 300 1 10 0 0)
SF-TOGGLE "Antialias" TRUE
SF-ADJUSTMENT "Border size" '(0 1 100 1 10 0 0)
)
; registrace skriptu do menu
(script-fu-menu-register "script-fu-text-demo2"
"<Image>/Root.cz")
; finito
Obrázek 8: Výběr fontu z formuláře vyvolaného z úvodního dialogu druhého demonstračního příkladu.
Obrázek 9: Obrázek vykreslený druhým demonstračním příkladem.
5. Cesty v grafickém editoru GIMP
Dalším užitečným a zajímavým typem objektů, které se používají v rastrovém grafickém editoru GIMP a s nimiž se v dnešním článku alespoň v krátkosti seznámíme, jsou takzvané cesty (paths). Cesta je vektorový grafický objekt, tj. objekt popsaný geometrickými atributy, nikoli množinou pixelů, složený z libovolného množství takzvaných segmentů, které na sebe většinou navazují svými koncovými body. Každý segment je představovaný buď úsečkou nebo Bézierovou křivkou, jejichž základní vlastnosti budou zmíněny v navazující kapitole. Cesta může být buď otevřená (jedná se tedy o lomenou čáru nebo křivku) nebo uzavřená – v tomto případě je koncový bod posledního segmentu totožný s počátečním bodem segmentu prvního.
Obrázek 10: Čtyři varianty cest vytvořených v GIMPu: otevřená cesta tvořená polyčárou (lomenou čarou), uzavřená cesta ve tvaru polygonu, uzavřená cesta tvořená pouze Bézierovými křivkami a uzavřená cesta tvořená jak úsečkovými segmenty, tak i segmenty složenými z Bézierových křivek.
Cesty lze v grafickém editoru GIMP vytvořit několika různými způsoby – speciálním nástrojem pro rýsování cest (tento nástroj se vyvolává buď ikonou umístěnou na nástrojovém panelu, z menu nebo klávesovou zkratkou B), dále pak transformací textového objektu na cestu či, což je možná nejzajímavější, transformací výběru (selection) na cestu. V posledním případě vlastně GIMP musí provádět vektorizaci rastrových dat na vektorové objekty spolu s optimalizací výsledné cesty tak, aby obsahovala co nejmenší množství segmentů a současně s dostatečnou přesností aproximovala původní tvar výběru.
Obrázek 11: Vytvoření výběru pomocí nástrojů pro definici eliptické a obdélníkové oblasti s průběžnou aplikací množinové operace sjednocení.
6. Použití cest v GIMPu
V čem spočívá význam a zajímavost cest? Cesty jsou poměrně užitečné například při kreslení různých značek, log, jednoduchých geometrických obrazců ale i složitějších tvarů, protože se jedná o jediný typ vektorových objektů, se kterými je možné v grafickém editoru GIMP pracovat, samozřejmě se všemi výhodami, které nám vektorový popis nabízí oproti popisu rastrovému. Interní reprezentace cest je paměťově velmi efektivní (cesty složené z několika segmentů jsou uloženy doslova na několika bajtech), lze s nimi beze ztráty kvality provádět množství geometrických transformací, včetně otáčení a změny měřítka, koncové body segmentů a řídicí body Bézierových křivek lze přesouvat po ploše obrázku atd. Navíc mohou uživatelům při kreslení pomoci takzvané úchyty, které se vytváří vytažením z levého a horního okraje obrázku.
Obrázek 12: Převod výběru (zobrazeného na jedenáctém obrázku) na cestu.
Cesty lze dále vykreslit příkazem Stroke Path, přičemž je možné detailně zvolit, jakým způsobem bude cesta vykreslena: například čárkovanou křivkou, s využitím vybraného štětce, rozprašovače atd. Ovšem cestu lze taktéž převést na výběr (selection) příkazem Select/From Path (klávesová zkratka Shift+V) a následně tento výběr použít pro vyplnění části obrázku, ořez obrázku atd. Poznámka: při převodu cesty na výběr se původně otevřená cesta (lomená čára, křivka) vždy automaticky uzavře.
Obrázek 13: Dialog zobrazený při vyvolání příkazu pro vykreslení cesty. V pozadí lze vidět již vykreslenou cestu a pomocné úchyty (modré čárkované úsečky) použité při přesném umisťování koncových bodů segmentů, ze kterých se cesta skládá.
7. Základní vlastnosti Bézierových křivek
Bézierovy křivky, které lze v grafickém editoru GIMP použít pro vytváření segmentů cest, patří v počítačové grafice mezi jedny z nejpoužívanějších typů parametrických (aproximačních) křivek. Jsou totiž velmi jednoduché jak na vytváření a editaci (tj. nepřináší žádné větší komplikace pro uživatele), tak i velmi rychlé při vykreslování, což je výhoda pro programátora, nebo pro hardwarovou implementaci vykreslování (to se projeví například i v rychlejším RIPování PostScriptových souborů). Bézierovy křivky stupně dvě a tři, tj. kvadriky a kubiky, jsou použity v mnoha aplikacích a technologiích, včetně PostScriptu a PostScriptových fontů (kubické křivky), TrueType fontů (kvadratické křivky), formátech aplikace Inkscape, CorelDraw!, Adobe Illustrator i ve „vektorovém“ XML formátu SVG – Scalable Vector Graphics, který je mimochodem v nových verzích GIMPu při práci s cestami podporován (resp. v něm existuje podpora pro načítání cest uložených v SVG, nikoli plnohodnotná práce se všemi objekty, animacemi a skripty, které je možné ve formátu SVG ukládat).
Obrázek 14: Kubická Bézierova křivka definovaná pomocí čtveřice řídicích bodů. Tento typ křivky vždy prochází prvním a posledním řídicím bodem, ostatní body určují její tvar a křivka jimi obecně neprochází.
Bézierova křivka obecně prochází pouze svým prvním a posledním bodem (jedná se o takzvané kotvicí body), ostatní body pouze ovlivňují výsledný tvar křivky – jde tedy o aproximační křivky, i když je lze po programových výpočtech použít i pro interpolaci. Ve speciálních případech však křivka může procházet i dalšími (řídicími) body, například tehdy, když všechny body leží na jedné přímce. Pomocí prvního bodu (kotvicího) a druhého bodu (řídicího) P0 a P1 se určuje tečný vektor na začátku křivky. Předposlední bod (řídicí) a poslední bod (kotvicí) Pn-1 a Pn zase určují tečný vektor na konci křivky. Této vlastnosti se velmi často využívá při hladkém navazování Bézierových křivek, typicky i v PostScriptu při tvorbě cest či obrysů fontů. Samozřejmě je také možné hladce navázat Bézierovu křivku na úsečku či kruhový oblouk – v GIMPu jsou však, jak již víme, podporovány pouze cesty, které se skládají z úsečkových segmentů a ze segmentů představovaných Bézierovými křivkami.
Obrázek 15: Různé tvary Bézierových kubických křivek vytvořených v PostScriptu a vykreslených v programovém prohlížeči PostScriptových souborů. V pravé části PostScriptového dokumentu je zobrazena cesta vytvořená z několika segmentů Bézierových kubických křivek.
V počítačové grafice patří mezi nejpoužívanější typ parametrických křivek Bézierovy kubické křivky, jejichž podporu nabízí téměř jakýkoli vyspělejší program pracující s vektorovou grafikou – jedná se opět o již zmiňovaný Inkscape, CorelDraw!, Adobe Illustrator, OpenOffice Draw a samozřejmě též grafický editor GIMP. U systémů CAD a CAM je situace složitější, protože tam si své místo našly B-splajny a NURBS, tj. odlišné a v několika ohledech složitější typy křivek. Avšak i v těchto programech se Bézierovy kubické křivky často používají, minimálně při práci s PostScriptovými fonty. Bézierovy kubické křivky jsou zadány pomocí čtyř bodů v ploše či prostoru. Křivka přitom prochází prvním a posledním (kotvicím) bodem, druhý a třetí bod (řídicí) určuje tečné vektory na začátku a konci křivky. Křivka tedy druhým a třetím řídicím bodem obecně neprochází – viz též obrázek číslo 14.
Obrázek 16: Vytvoření Bézierovy kubické křivky v grafickém editoru GIMP pomocí nástroje pro tvorbu cest. Aktivní koncový bod je zvýrazněn mezikružím (pravá část obrázku), z řídicího bodu vychází tečný vektor, na jehož konci se nachází řídicí bod Bézierovy křivky.
8. Obsah následující části seriálu
V následující části článku o programovacím jazyku Scheme o a různých způsobech jeho využití ve známém grafickém editoru GIMP si na několika demonstračních příkladech ukážeme, jak je možné s využitím cest vykreslovat různé geometrické objekty, převádět textové vrstvy na cesty s následnou úpravou tvarů jednotlivých znaků a na závěr se zmíníme o základech práce s grafickým formátem SVG v GIMPu.
Obrázek 17: Převedení textové hladiny na cestu.
Obrázek 18: Vykreslení cesty vytvořené konverzí z textové hladiny. Při vykreslení se nejprve použil nástroj tužka o šířce dvou pixelů a posléze nástroj štětec s kruhovou stopou a simulací dynamiky kreslení.
9. Odkazy na Internetu
- Odstranění šumu
http://cs.wikipedia.org/wiki/Odstran%C4%9Bn%C3%AD_%C5%A1umu - Detekce hran
http://cs.wikipedia.org/wiki/Detekce_hran - Konvoluce
http://cs.wikipedia.org/wiki/Konvoluce - Starry sky
http://www.td-e.com/soft/starry-sky.php - A Script-Fu Tutorial
http://www.linuxtopia.org/online_books/graphics_tools/gimp_user_manual/en/gimp-using-script-fu-tutorial.html - A Script-Fu Tutorial
http://docs.gimp.org/en/gimp-using-script-fu-tutorial.html - Script-fu Tutorial
http://www.seul.org/~grumbel/gimp/script-fu/script-fu-tut.html - Lambda calculus
http://en.wikipedia.org/wiki/Lambda_calculus - A Short Introduction to the Lambda Calculus
http://www.cs.bham.ac.uk/~axj/pub/papers/lambda-calculus.pdf - A Tutorial Introduction to the Lambda Calculus
http://www.inf.fu-berlin.de/lehre/WS03/alpi/lambda.pdf - (welcome '(schemers . org))
http://www.schemers.org/ - Revised5 Report on the Algorithmic Language Scheme
http://www.schemers.org/Documents/Standards/R5RS/ - The Revised6 Report on the Algorithmic Language Scheme
http://www.r6rs.org/ - Scheme
http://groups.csail.mit.edu/mac/projects/scheme/ - The Kawa language framework
http://www.gnu.org/software/kawa/ - Scheme 48
http://s48.org/ - Introductory textbooks for Schemers
http://www.schemers.org/Documents/#intro-texts - Scheme (programming language)
http://en.wikipedia.org/wiki/Scheme_(programming_language) - Scheme
http://cs.wikipedia.org/wiki/Scheme - Scheme-faq
http://community.schemewiki.org/?scheme-faq - Scheme implementations
http://community.schemewiki.org/?scheme-faq-standards#implementations - Successful Scheme
http://www.itworld.com/swol-1013-regex - Guy L. Steele, Jr.
http://en.wikipedia.org/wiki/Guy_L._Steele - Gerald Jay Sussman
http://en.wikipedia.org/wiki/Gerald_Jay_Sussman - PLT Scheme
http://www.plt-scheme.org/ - Quick: An Introduction to PLT Scheme with Pictures
http://docs.plt-scheme.org/quick/ - PLT Scheme
http://en.wikipedia.org/wiki/Plt_scheme - PLT Scheme Guide
http://docs.plt-scheme.org/guide/ - The DrScheme Project: An Overview
http://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.22.9543 - DrScheme
http://en.wikipedia.org/wiki/DrScheme - How to Design Programs
http://www.htdp.org/ - An Introduction to Scheme
http://www.acm.org/crossroads/xrds1–2/scheme.html
