WWW.CYRON.CZ

Silně jsem se inspiroval tady. Kromě jednoduššího postupu je však v mém návodu zásadní změna - výstupem není mnohatlačítková fixní lišta s oddělovači a textem, ale normální tlačítko + zvlášť uložený oddělovač. Proč? Protože z těchto komponent můžete snadno poskládat jakoukoliv tlačítkovou lištu včetně možnosti dynamické změny délky a textu ((X)HTML, CSS, atd). Stačí umět řezat a kopírovat...

---

Postup:

Vytvořte nový obrázek 200 x 100 px (délku natáhněte dle uvážení, mé tlačítko je celkem krátké a nechce se mi to dělat znovu), barvu pozadí zvolte průhlednou. Vrstvu přejmenujte na Tl-1.

---

Pomocí nástroje Obdélníkový výběr nakreslete obdélník 140 x 50 px (o 40 px delší: 180 x 50). K upřesnění použijte nastavení v okně Nástroje, nezapomeňte zapnout Zaoblené rohy, poloměr 12. Nástrojem Plechovka obarvěte výběr barvou cdd0d4.

---

Vytvořte novou průhlednou vrstvu s názvem Tl-2. Nakreslete výběr, přesně shodný s přechozím, jen výšku změňťe na 48 px a polohu na 27.

---

Tentokrát k vyplnění použijte nástroj Mísení. Nastavte barvu popředí na 4f4f51 a barvu pozadí 9fa0a4, pak učiňte myší pohyb zdola přesně dle obrázku.

Klikněte pravým tlačítkem na vrstvu Tl-1, pak klikněte na Alfa do výběru. Poté klikněte na Vybrat -> Zmenšit a v dialogovém okně zadejte 2px.

Vytvořte novou vrstvu, pojmenujte ji Tl-3, znovu použije nástroj Mísení. Nastavte barvu popředí na a4a5a6 a barvu pozadí na c1c4c8, nyní učiňte myší tah dle následujícího obrázku.

Vyberte obdélník 132 (172) x 40 / 34 a 33, zaoblení 8. Nastavte barvu popředí na eff0f1, pozadí na a4a5a6.

Myší učiňte pohyb dle obrázku.

Nyní přidejte vržený stín: klepněte pravým tlačítkem na vrstvu Tl-1, zvolte Alfa do výběru, zvolte Filtry -> Světlo a stíny -> Vržený stín a zadejte 0 pro Offset X, 3 pro Offset Y, Poloměr nastavte na 3, černou Barvu a nakonec 80% Krytí.

A základní tlačítko je na světě. Uložte si jej jako XCF. Všechny vrstvy slučte, obrázek ořízněte a uložte jako PNG.

Nakonec vytvořte oddělovače jednotlivých "tlačítek". Pomocí nástroje Obdélníkový výběr nakreslete obdélník široký 2 px, výška dle obrázku. Nástrojem Tužka výběr obarvěte (čára po levé straně barvou 838387, po pravé e8e9ea). Dejte Výběr Invertovat a stiskněte klávesu Delete. Vše krom oddělovače zmizí. Uložte.

Prostým ořezáváním, skládáním a tak dále můžete snadno vytvořit jakkoli dlouhou lištu.

Autor: Miroslav Cyroň

Datum: 11 května 2010

Vstup do diskuze