362 lines
33 KiB
HTML
362 lines
33 KiB
HTML
<?xml version="1.0" encoding="UTF-8"?>
|
||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml" lang="sk" xml:lang="sk">
|
||
<head>
|
||
<!--
|
||
*
|
||
* Copyright 2009-2013, Haiku. All rights reserved.
|
||
* Distributed under the terms of the MIT License.
|
||
*
|
||
* Authors:
|
||
* Humdinger <humdingerb@gmail.com>
|
||
* Translators:
|
||
* helix84
|
||
* Bachoru
|
||
* Humdinger
|
||
*
|
||
-->
|
||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||
<meta http-equiv="Content-Style-Type" content="text/css" />
|
||
<meta name="robots" content="all" />
|
||
<title>Icon-O-Matic</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<link rel="stylesheet" type="text/css" href="../../Haiku-doc.css" />
|
||
</head>
|
||
<body>
|
||
|
||
<div id="banner">
|
||
<div><span>User guide</span></div>
|
||
</div>
|
||
|
||
<div class="nav">
|
||
<div class="inner">
|
||
<ul class="lang-menu">
|
||
<li class="now"><img src="../../images/flags/sk.png" alt="" /> Slovenčina</li>
|
||
<li><a href="../../ca/applications/icon-o-matic.html"><img src="../../images/flags/ca.png" alt="" />Català</a></li>
|
||
<li><a href="../../de/applications/icon-o-matic.html"><img src="../../images/flags/de.png" alt="" />Deutsch</a></li>
|
||
<li><a href="../../en/applications/icon-o-matic.html"><img src="../../images/flags/gb.png" alt="" />English</a></li>
|
||
<li><a href="../../es/applications/icon-o-matic.html"><img src="../../images/flags/es.png" alt="" />Español</a></li>
|
||
<li><a href="../../fr/applications/icon-o-matic.html"><img src="../../images/flags/fr.png" alt="" />Français</a></li>
|
||
<li><a href="../../it/applications/icon-o-matic.html"><img src="../../images/flags/it.png" alt="" />Italiano</a></li>
|
||
<li><a href="../../hu/applications/icon-o-matic.html"><img src="../../images/flags/hu.png" alt="" />Magyar</a></li>
|
||
<li><a href="../../pl/applications/icon-o-matic.html"><img src="../../images/flags/pl.png" alt="" />Polski</a></li>
|
||
<li><a href="../../pt_PT/applications/icon-o-matic.html"><img src="../../images/flags/pt_PT.png" alt="" />Português</a></li>
|
||
<li><a href="../../pt_BR/applications/icon-o-matic.html"><img src="../../images/flags/pt_BR.png" alt="" />Português (Brazil)</a></li>
|
||
<li><a href="../../ro/applications/icon-o-matic.html"><img src="../../images/flags/ro.png" alt="" />Română</a></li>
|
||
<li><a href="../../fi/applications/icon-o-matic.html"><img src="../../images/flags/fi.png" alt="" />Suomi</a></li>
|
||
<li><a href="../../sv_SE/applications/icon-o-matic.html"><img src="../../images/flags/sv_SE.png" alt="" />Svenska</a></li>
|
||
<li><a href="../../zh_CN/applications/icon-o-matic.html"><img src="../../images/flags/zh_CN.png" alt="" /> 中文 ［中文］</a></li>
|
||
<li><a href="../../ru/applications/icon-o-matic.html"><img src="../../images/flags/ru.png" alt="" />Русский</a></li>
|
||
<li><a href="../../uk/applications/icon-o-matic.html"><img src="../../images/flags/uk.png" alt="" />Українська</a></li>
|
||
<li><a href="../../jp/applications/icon-o-matic.html"><img src="../../images/flags/jp.png" alt="" />日本語</a></li>
|
||
</ul>
|
||
<span>
|
||
« <a href="haikudepot.html">HaikuDepot</a>
|
||
:: <a href="../applications.html#list-of-apps" class="uplink">Aplikácie</a>
|
||
:: <a href="installer.html">Installer</a> »
|
||
</span></div>
|
||
</div>
|
||
|
||
<div id="content">
|
||
<div>
|
||
|
||
<table class="index" id="index" summary="index">
|
||
<tr class="heading"><td>Obsah</td></tr>
|
||
<tr class="index"><td><a href="#bitmap-vector">BeOS bitmapové vs. Haiku vektorové ikony</a><br />
|
||
<a href="#icons-attributes">Ikony sú atribúty</a><br />
|
||
<a href="#i-o-m">Tvorenie ikon v Icon-O-Matic</a><br />
|
||
<a href="#i-o-m-path">Cesta</a><br />
|
||
<a href="#i-o-m-shape">Tvar</a><br />
|
||
<a href="#i-o-m-style">Štýl</a><br />
|
||
<a href="#i-o-m-transformer">Transformátor</a><br />
|
||
<a href="#i-o-m-save">Uloženie ikony</a><br />
|
||
<a href="#i-o-m-tips">Tipy & Triky</a></td></tr>
|
||
</table>
|
||
|
||
<h2><img src="../../images/apps-images/icon-o-matic-icon_64.png" alt="icon-o-matic-icon_64.png" width="64" height="64" />Icon-O-Matic</h2>
|
||
|
||
<table summary="layout" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td>Panel:</td><td style="width:15px;"></td><td><span class="menu">Aplikácie</span></td></tr>
|
||
<tr><td>Umiestnenie:</td><td></td><td><span class="path">/boot/system/apps/Icon-O-Matic</span></td></tr>
|
||
<tr><td>Nastavenia:</td><td></td><td><span class="path">~/config/settings/Icon-O-Matic</span></td></tr>
|
||
</table>
|
||
|
||
<p><br /></p>
|
||
|
||
<p>Predtým, než začneme vytvárať ikony v Icon-O-Matic, si povieme zopár slov o ikonách v Haiku vo všeobecnosti.</p>
|
||
|
||
<h2>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="bitmap-vector" name="bitmap-vector">Bitmapové ikony BeOS vs. vektorové ikony Haiku</a></h2>
|
||
<p>Na rozdiel od BeOS, Haiku používa vektorové ikony namiesto bitmapových. Špeciálny formát pre vektorové ikony v Haiku (HVIF) bol vyvinutý tak, aby bola veľkosť súboru ikony malá a aby bolo vykresľovanie rýchle. Preto sú naše ikony väčšinou <i>oveľa</i> menšie ako bitové mapy alebo veľmi rozšírený formát SVG. Taktiež, na rozdiel od bitmapových ikon BeOS, nie sú ikony v Haiku obmedzené 8-bitovou paletou (256 farieb).<br />Pozrite sa napríklad na túto ikonu Terminálu:</p>
|
||
<table border="0" cellpadding="10">
|
||
<tr align="center"><td><b>Bitmapové</b></td><td><b>SVG</b></td><td><b>HVIF</b></td></tr>
|
||
<tr align="center"><td><img src="../../images/apps-images/i-o-m-terminal-bitmap32.png" alt="i-o-m-terminal-bitmap32" width="32" height="32" /> <img src="../../images/apps-images/i-o-m-terminal-bitmap16.png" alt="i-o-m-terminal-bitmap16" width="16" height="16" /></td><td style="width:100px"><img src="../../images/apps-images/terminal-icon_32.png" alt="terminal-icon_32" width="32" height="32" /></td><td><img src="../../images/apps-images/terminal-icon_32.png" alt="terminal-icon_32" width="32" height="32" /></td></tr>
|
||
<tr align="center"><td>1 024 bajtov<br />+ 256 bajtov</td><td> 7 192 bajtov</td><td> 768 bajtov</td></tr>
|
||
</table>
|
||
<p>Všimnite si, že BeOS používa dve verzie tej istej ikony, jednu 16x16 a druhú 32x32, na dosiahnutie výsledku v režime zoznamu a v režime zobrazenia ikon.</p>
|
||
<p>Vektorové ikony tento trik nepotrebujú. Nielenže zaberajú iba pár stoviek bajtov, ale ich veľkosť je oveľa lepšie prispôsobiteľná ako veľkosť bitmapových ikon. (Poznámka: BeOS ponúklo iba veľkosti 16x16 a 32x32.)</p>
|
||
<table border="0" cellpadding="10">
|
||
<tr align="center"><td> </td><td><b>16x16</b></td><td><b>32x32</b></td><td><b>64x64</b></td><td><b>128x128</b></td></tr>
|
||
<tr align="center"><td><b>Bitmapové</b></td>
|
||
<td><img src="../../images/apps-images/i-o-m-bitmap16.png" alt="i-o-m-bitmap16" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-bitmap32.png" alt="i-o-m-bitmap32" width="32" height="32" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-bitmap64.png" alt="i-o-m-bitmap64" width="64" height="64" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-bitmap128.png" alt="i-o-m-bitmap128" width="128" height="128" /></td></tr>
|
||
<tr align="center"><td><b>Vektorové</b></td>
|
||
<td><img src="../../images/apps-images/i-o-m-vector16.png" alt="i-o-m-vector16" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-vector32.png" alt="i-o-m-vector32" width="32" height="32" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-vector64.png" alt="i-o-m-vector64" width="64" height="64" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-vector128.png" alt="i-o-m-vector128" width="128" height="128" /></td></tr>
|
||
|
||
</table>
|
||
|
||
<h2>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="icons-attributes" name="icons-attributes">Ikony sú atribúty</a></h2>
|
||
<p>Ikony sú v súboroch uložené ako ich atribúty. To ale neznamená, že je nutné, aby každý súbor mal tento atribút na to, aby mal zobrazenú ikonu v okne Trackera: dátové súbory dedia svoje ikony podľa typu súboru. Globálne sa dá zmeniť ikona typu súboru v nastaveniach <span class="app">Typov súborov</span>
|
||
Ak chcete iba pridať špeciálnu ikonu individuálnemu súboru, môžete použiť <span class="app">doplnok FileType</span>. Ďalšie informácie nájdete v téme <a href="../filetypes.html">Typy súborov</a>.</p>
|
||
<div class="box-info">Pretože je ikona atribútom, iba súborové systémy s podporou metadát môžu uchovať individuálnu ikonu súboru. Takže ak budete presúvať vaše súbory zo zväzku BFS, odporúčame vám zabaliť ich do archívu zip, aby ste sa vyhli strate ikon alebo iných atribútov.</div>
|
||
|
||
<h2>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m" name="i-o-m">Tvorenie ikon v Icon-O-Matic</a></h2>
|
||
<p>Icon-O-Matic je editor ikon Haiku, ktorý dokáže uložiť vašu prácu vo formátoch HVIF, SVG alebo PNG. Ikona tiež môže byť priamo pripojená ako atribút existujúcemu súboru alebo ako zdroj alebo zdrojový kód pre vývojárov. Keďže aplikácia bola ušitá na mieru optimalizovanému formátu HVIF, jej používanie odráža vnútorné fungovanie tohto formátu.</p>
|
||
<p>Na rozdiel od bežného softvéru na tvorbu vektorovej grafiky tu nebudete pracovať so samostatnými objektmi s konkrétnymi vlastnosťami ako cesta, šírka ťahu, farba ťahu a výplne atď. Namiesto toho budete skladať objekty („tvary“) zo zdieľaných ciest a farieb („štýly“) a nastavovať určité vlastnosti. Opätovné použitie prvkov je jedným z tajomstiev efektivity HVIF. Napriek tomu, že táto metóda predstavuje pre používateľa niekoľko obmedzení, má aj svoje výhody. Napríklad opätovným použitím cesty možno modifikovať niekoľko objektov upravením tejto jednej cesty. Dá sa to prirovnať k objektu a jeho tieňu. Úprava zdieľanej cesty zmení samotný objekt a automaticky (hoci možno skreslene) aj jeho tieň.
|
||
</p>
|
||
|
||
<p>Tu je rýchly prehľad okna Icon-O-Matic:</p>
|
||
<img src="../images/apps-images/i-o-m-overview.png" alt="i-o-m-overview.png" />
|
||
|
||
<p>Aby ste mohli na plátne vytvoriť viditeľný objekt, potrebujete tvar s jeho cestou a štýlom. Pohodlne môžete vytvoriť jeden, dva alebo všetky 3 z menu <span class="menu">Tvarov</span>. Každý druh objektu (cesta, tvar, transformátor a štýl) má svoj vlastný zoznam prvkov, ktoré ponúkajú rôzne príkazy. Každý prvok má určité možnosti, ktoré sa nastavujú v <span class="menu">Nastaveniach</span>. </p>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-path" name="i-o-m-path">Cesta</a></h3>
|
||
<p>Cesta pozostáva z niekoľkých bodov spojených čiarami alebo Bézierovými krivkami. Ak chcete pridávať alebo meniť body, uistite sa, že daná cesta je vybraná v zozname ciest.</p>
|
||
|
||
<p>Jednoduché kliknutie na plátno nastaví prvý bod. Počas nastavovania bodu rozhodujete, či bude výsledná čiara rovná alebo krivá: jednoduché kliknutie a pustenie vyprodukuje rovnú čiaru, podržanie tlačidla a posunutie myši vysunie úchopy Bézierovej krivky. Samozrejme, všetko môžete neskôr zmeniť.</p>
|
||
|
||
<img src="../../images/apps-images/i-o-m-path-ab.png" alt="i-o-m-path-ab" />
|
||
|
||
<p>Aby ste sa dostali z obrázka „A“ do „B“, musíte transformovať niektoré body z rohových na krivkové. To sa robí držaním klávesu <span class="key">ALT</span> počas kliknutia na bod, čím sa vysunú úchopy. Takto vznikne symetrický Bézier: prvý úchop kopíruje pohyb druhej. Ak chcete, aby sa úchopy hýbali nezávisle, znovu kliknite a pretiahnite úchop Béziera počas držania klávesu <span class="key">ALT</span>.<br /> Zmeniť riadiaci bod Bézierovej krivky na rohový bod môžete znova držaním klávesu <span class="key">ALT</span> počas kliknutia na bod.</p>
|
||
|
||
<p>Ak chcete presunúť bod, jednoducho naň kliknite a pretiahnite ho myšou. Viac bodov sa dá vybrať držaním kĺavesu <span class="key">SHIFT</span>, čím natiahnete obdĺžnik výberu. Označené body sa líšia od neoznačených červeným okrajom namiesto čierneho.<br />
|
||
Ak chcete do existujúcej cesty pridať bod, kliknite na čiaru medzi bodmi, ktoré ju určujú. Označené body môžete odstrániť stlačením <span class="key">DEL</span> alebo kliknutím na bod počas držania klávesu <span class="key">CTRL</span>.</p>
|
||
|
||
<p>Kurzor myši indikuje aktuálny režim:</p>
|
||
<table summary="Mouse pointer states, Path" border="0" cellpadding="10">
|
||
<tr align="center">
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-move-path.png" alt="i-o-m-pointer-move-path" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-insert.png" alt="i-o-m-pointer-insert" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-add.png" alt="i-o-m-pointer-add" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-delete.png" alt="i-o-m-pointer-delete" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-bezier.png" alt="i-o-m-pointer-bezier" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-select.png" alt="i-o-m-pointer-select" width="16" height="16" /></td>
|
||
</tr>
|
||
<tr align="center">
|
||
<td>Presúvanie bodov</td>
|
||
<td>Vkladanie bodov</td>
|
||
<td>Pridanie bodov</td>
|
||
<td>Odstránenie bodov<br /><span class="key">CTRL</span></td>
|
||
<td>Rohové↔Bézierove body<br /><span class="key">ALT</span></td>
|
||
<td>Výber bodov<br /><span class="key">SHIFT</span></td>
|
||
</tr>
|
||
</table>
|
||
<p>Kliknutím na bod alebo výber bodov pravým tlačidlom myši vyvoláte kontextové menu:</p>
|
||
<table summary="Path context" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td class="onelinetop"><span class="menu">Vybrať všetky</span></td><td style="width:70px"><span class="key">ALT</span> <span class="key">A</span></td><td>Vyberie všetky body aktuálnej cesty.</td></tr>
|
||
<tr><td><span class="menu">Transformovať</span></td><td><span class="key">T</span></td><td>Vloží všetky vybrané body do transformačného boxu, čo vám umožňuje hýbať, meniť veľkosť a otáčať všetky body spolu. Funguje to presne ako s tvarmi (popísané nižšie).</td></tr>
|
||
<tr><td><span class="menu">Rozdeliť</span></td><td></td><td>Rozdelí vybrané body na dva na sebe ležiace.</td></tr>
|
||
<tr><td><span class="menu">Prevrátiť</span></td><td></td><td>Otočí vybrané body o 180°. Ovplyvňuje iba Bézierove body.</td></tr>
|
||
<tr><td><span class="menu">Odstrániť</span></td><td><span class="key">DEL</span></td><td>Odstráni všetky vybrané body.
|
||
</td></tr>
|
||
</table>
|
||
|
||
<h4><a id="i-o-m-path-menu" name="i-o-m-path-menu">Menu cesty</a></h4>
|
||
<p>Menu <span class="menu">Cesty</span> ponúka niekoľko samozrejmých položiek, ako <span class="menu">Pridať obdĺžnik</span> a <span class="menu">Pridať kružnicu</span> alebo <span class="menu">Duplikovať</span> či <span class="menu">Odstrániť</span> cestu. Tu sú tie, ktoré možno treba trochu objasniť:</p>
|
||
|
||
<table summary="Path menu" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td><span class="menu">Obrátiť</span></td><td style="width:15px;"></td><td>Ak vaša cesta nie je „uzavrená“ (pozrite Vlastnosti cesty nižšie), kliknutie na plátno vždy vytvorí nový bod, ktorý sa spojí s posledným. Možnosť „Obrátiť“ prevráti toto poradie a váš nový bod bude pripojený k pôvodnému začiatočnému bodu.</td></tr>
|
||
<tr><td><span class="menu">Vyčistiť</span></td><td></td><td>Užitočné pri importe SVG, táto funkcia odstráni nadbytočné body.</td></tr>
|
||
<tr><td class="onelinetop"><span class="menu">Otočiť indexy vpred</span></td><td><span class="key">ALT</span> <span class="key">R</span></td><td>Táto funkcia otočí otvor cesty. Najlepšie je to vidieť na neuzavretej ceste so štýlom a transformátorom ťahu. Ak vaša cesta vyzerá ako ⊂, bude sa otáčať takto: ⊂ ∩ ⊃ ∪ (v smere hodinových ručičiek).</td></tr>
|
||
<tr><td class="onelinetop"><span class="menu">Otočiť indexy opačne</span></td><td><span class="key">ALT</span> <span class="key">SHIFT</span> <span class="key">R</span></td><td>Robí to isté v opačnom smere.</td></tr>
|
||
</table>
|
||
|
||
<h4><a id="i-o-m-path-properties" name="i-o-m-path-properties">Vlastnosti cesty</a></h4>
|
||
<p><span class="menu">Vlastnosti</span> v dolnej časti okna vľavo ponúkajú všetky dostupné nastavenia aktuálne vybraných objektov. Cesta má iba dve: <span class="menu">Názov</span> a či je <span class="menu">Zatvorená</span> alebo nie.</p>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-shape" name="i-o-m-shape">Tvar</a></h3>
|
||
<p>Tvar zlučuje jednu alebo viac ciest so štýlom. V podstate je to objekt, ktorý bude na plátne viditeľný. Zlučovanie sa robí zaškrtávacími políčkami, ktoré sú pred cestami a štýlmi: Jednoducho vyberte váš tvar a zaškrtnite cesty a štýl, ktoré požadujete.</p>
|
||
<p>Tvar udáva, ako budú cesta a štýl aplikované, napr. či má byť objekt vyplnený alebo iba načrtnutý (čo sa robí pomocou Transformátorov, k tomu sa dostaneme neskôr). Tvar môžete tiež presúvať, otáčať alebo meniť jeho veľkosť bez akejkoľvek manipulácie s použitými cestami. Týmto spôsobom môžete viackrát použiť tú istú cestu a dostať tak rôzne, ale príbuzné tvary.</p>
|
||
|
||
<img src="../../images/apps-images/i-o-m-shape.png" alt="i-o-m-shape" />
|
||
|
||
<p>Okolo označeného tvaru sa zobrazí obdĺžnik. Podľa toho, kde ho uchopíte ním môžete hýbať, meniť jeho veľkosť alebo otáčať ho okolo bodu v strede tvaru, ktorý tiež môžete presunúť. Držaním klávesu <span class="key">SHIFT</span> uzamknete smer hýbania, obmedzíte otáčanie na 45° a zachováte pomer strán pri zmene veľkosti. Kurzor myši znova indikuje aktuálny režim:</p>
|
||
<table summary="Mouse pointer states, Shape" border="0" cellpadding="10">
|
||
<tr align="center">
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-move-shape.png" alt="i-o-m- move-shape" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-resize.png" alt="i-o-m-pointer-resize" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-rotate.png" alt="i-o-m-pointer-rotate" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-pointer-move-path.png" alt="i-o-m-pointer-move-rotation" width="16" height="16" /></td>
|
||
</tr>
|
||
<tr align="center">
|
||
<td>Presúvanie</td>
|
||
<td>Zmena veľkosti</td>
|
||
<td>Otáčanie</td>
|
||
<td>Presúvanie<br />stredu otáčania</td>
|
||
</tr>
|
||
</table>
|
||
|
||
<p>Tvary na sebe ležia, dalo by sa povedať, že každý vo svojej vlastnej vrstve. Ak chcete zmeniť poradie týchto vrstiev, môžete tak urobiť jednoduchým uchopením a pretiahnutím na inú pozíciu v zozname tvarov.</p>
|
||
|
||
<h4><a id="i-o-m-shape-menu" name="i-o-m-path-menu">Menu tvaru</a></h4>
|
||
<p>Menu <span class="menu">Tvaru</span> ponúka už spomenutú možnosť <span class="menu">Pridať prázdny, s cestou/štýlom/cestou a štýlom</span> a <span class="menu">Duplikovať</span> alebo <span class="menu">Odstrániť</span> tvar. Ďalej sú tu možnosti:</p>
|
||
<table summary="Shape menu" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td><span class="menu">Obnoviť transformáciu</span></td><td style="width:15px;"></td><td>Vráti späť všetky presuny, zmeny veľkosti a rotácie, ktoré ste aplikovali na daný tvar.</td></tr>
|
||
<tr><td class="onelinetop"><span class="menu">Zmraziť transformáciu</span></td><td></td><td>Keď transformujete tvar, jeho pridelené cesty zostanú v pôvodnej pozícii. Je to tak úmyselne; možno viac ako jeden tvar používa danú cestu, možno ste úmyselne použili <span class="menu">Možnosti | Prichytávať k mriežke</span> aby ste umiestnili body na presných okrajoch. <br />
|
||
Ak nie, „Zmraziť transformáciu“ aplikuje aktuálnu transformáciu tvaru na cesty, ktoré mu patria. Následná funkcia „Obnoviť transformáciu“ potom vráti tvar do tohto nového stavu.
|
||
</td></tr>
|
||
</table>
|
||
|
||
<h4><a id="i-o-m-shape-properties" name="i-o-m-shape-properties">Vlastnosti tvaru</a></h4>
|
||
<p>Okrem <span class="menu">Názvu</span> ponúka okno <span class="menu">Vlastnosti</span> tvaru tieto možnosti:</p>
|
||
|
||
<table summary="Shape properties" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td><span class="menu">Min. detail</span></td><td></td><td>Minimálna úroveň detailov</td></tr>
|
||
<tr><td><span class="menu">Max. detail</span></td><td></td><td>Maximálna úroveň detailov</td></tr>
|
||
</table>
|
||
|
||
<h5><a id="i-o-m-shape-lod" name="i-o-m-shape-lod">Úroveň detailov (LOD)</a></h5>
|
||
<table summary="LOD example" border="0" cellpadding="10">
|
||
<tr align="center"><td><b>16x16</b></td><td><b>32x32</b></td><td><b>64x64</b></td></tr>
|
||
<tr align="center">
|
||
<td><img src="../../images/apps-images/i-o-m-lod-icon_16.png" alt="i-o-m-lod-icon_16" width="16" height="16" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-lod-icon_32.png" alt="i-o-m-lod-icon_32" width="32" height="32" /></td>
|
||
<td><img src="../../images/apps-images/i-o-m-lod-icon_64.png" alt="i-o-m-lod-icon_64" width="64" height="64" /></td></tr>
|
||
</table>
|
||
<p>Všimli ste si, že na 16-pixlovej verzii ikony BeVexed nie sú žiadne čísla? To sa robí pomocou nastavenia detailov vo vlastnostiach tvarov.<br />
|
||
S touto funkciou môžete kontrolovať viditeľnosť tvaru v závislosti od veľkosti ikony. Týmto spôsobom môžete vynechať detaily, ktoré vyzerajú dobre na väčšej ikone, no zle na menšej verzii.</p>
|
||
<p>Funguje to takto: úroveň detailu 1,0 je definovaná ako ikona o veľkosti 64 px. Úroveň detailu ikony vypočítate tak, že veľkosť ikony jednoducho vydelíte číslom 64, napr. ikona veľká 16 px má úroveň detailov 16/64 = 0,25. Tvar nebude viditeľný pod svojím <span class="menu">Min. detailom</span> a nad svojím <span class="menu">Max. detailom</span>.</p>
|
||
<p>Takže ak nastavíte tvaru <span class="menu">Min. detail</span> 0,0 a <span class="menu">Max. detail</span> 0,5, znamená to, že tvar bude viditeľný iba v ikonách s veľkosťou <i>rovnou</i> alebo menšou ako 32 px. Aj chcete vynechať veľkosť 32 px, musí byť úroveň detailov nižšia ako 0,5, teda napr. 0,49. </p>
|
||
<p>Úroveň detailov neslúži iba na vynechávanie detailných tvarov, ale napríklad aj na zmenu hrúbky ťahu v iných veľkostiach ikony. Jednoducho duplikujte tvar, urobte vami požadované zmeny a nastavte úroveň detailov tak, aby sa zobrazoval buď jeden, alebo druhý tvar. Toto môže potenciálne spôsobiť zmätok, keď nevedomky prekryjete úroveň detailu a neviete, prečo sa na jednej veľkosti zobrazujú oba tvary...<br />
|
||
Napríklad, ak Tvar 1 má byť zobrazený pod veľkosťou 48px a Tvar 2 nad veľkosťou 48px (Úroveň detailov: 48/64 = 0.75):</p>
|
||
|
||
<table summary="LOD values example" border="0" cellpadding="5">
|
||
<tr align="center"><td></td><td colspan="2"><b>OK</b></td><td style="width:25px" rowspan="6"></td><td colspan="2"><b>Zle!</b></td></tr>
|
||
<tr style="background-color:#F1F1F1"><td rowspan="2" style="vertical-align:middle ; background-color:#FFFFFF"><b>Tvar 1</b></td><td>Min. detail</td><td>0.00</td><td>Min. detail</td><td>0.00</td></tr>
|
||
<tr style="background-color:#F1F1F1"><td>Max. detail</td><td><span style="background-color:#33FF33">0.74</span></td><td>Max. detail</td><td><span style="background-color:#FF9977">0.75</span></td></tr>
|
||
<tr><td colspan="6"></td></tr>
|
||
<tr style="background-color:#F8F8F8"><td rowspan="2" style="vertical-align:middle ; background-color:#FFFFFF"><b>Tvar 2</b></td><td>Min. detail</td><td>0.75</td><td>Min. detail</td><td>0.75</td></tr>
|
||
<tr style="background-color:#F8F8F8"><td>Max. detail</td><td>4.00</td><td>Max. detail</td><td>4.00</td></tr>
|
||
</table>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-style" name="i-o-m-style">Štýl</a></h3>
|
||
<p>Štýl môže byť buď pevne daná farba alebo nejaký druh farebného prechodu. <br />
|
||
Okrem preddefinovaných farieb pod <span class="menu">Paletou</span> si môžete namiešať vašu vlastnú kliknutím na aktuálnu farbu. Tiež si všimnite posuvník pod farebným spektrom, ktorým sa nastavuje alfa kanál. </p>
|
||
<img src="../images/apps-images/i-o-m-gradients.png" alt="i-o-m-gradients" />
|
||
<p>Takto môžete rýchlo vytvoriť nový štýl namiešaním vašej vlastnej farby a jednoduchým uchopením a pretiahnutím myšou do zoznamu štýlov.</p>
|
||
<p>Ak si vyberiete farebný prechod, najprv nastavte jeho typ (<span class="menu">Lineárny</span>, <span class="menu">Radiálny</span>, <span class="menu">Diamant</span>, <span class="menu">Kužeľ</span>) a potom vyberte začiatočnú a konečnú farbu. To sa robí pretiahnutím farby myšou z farebného segmentu do indikátorov farieb pod farebným prechodom. <br />
|
||
Samozrejme, tieto indikátory môžete presúvať a meniť tak farebný prechod podľa vášho vkusu. Ak chcete mať vo farebnom prechode viac farieb, môžete dvojklikom na farebný prechod pridať nové indikátory. Stlačenie klávesu <span class="key">DEL</span> odstráni vybraný indikátor.</p>
|
||
<p>Obdĺžnik predstavujúci farebný prechod môžete presúvať, otáčať a meniť jeho veľkosť. Funguje to presne tak, ako pri tvaroch.</p>
|
||
|
||
<h4><a id="i-o-m-style-menu" name="i-o-m-style-menu">Menu štýlu</a></h4>
|
||
<p>Menu <span class="menu">Štýlu</span> ponúka známe nastavenia <span class="menu">Pridať</span>, <span class="menu">Duplikovať</span> alebo <span class="menu">Odstrániť</span> štýl a <span class="menu">Obnoviť transformáciu</span>.</p>
|
||
|
||
<h4><a id="i-o-m-style-properties" name="i-o-m-style-properties">Vlastnosti štýlu</a></h4>
|
||
<p>The <span class="menu">Názov</span> je jediná <span class="menu">Vlastnosť</span> štýlu.</p>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-transformer" name="i-o-m-transformer">Transformátor</a></h3>
|
||
<p>Transformátor dokáže meniť vzhľad tvaru. Nečakajte ale, že premení vaše auto na bojového robota...</p>
|
||
|
||
<h4><a id="i-o-m-transformer-menu" name="i-o-m-transformer-menu">Pridanie transformátora</a></h4>
|
||
<table summary=" Transformer Add menu" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td><span class="menu">Obrys</span></td><td></td><td>Pridá tvaru obrys.</td></tr>
|
||
<tr><td><span class="menu">Ťah</span></td><td></td><td>Nakreslí cestu tvaru namiesto vyplnenia štýlom.</td></tr>
|
||
</table>
|
||
|
||
<p>V závislosti od druhu Transformátora môžete nastavovať rôzne vlastnosti.</p>
|
||
|
||
<h4><a id="i-o-m-transformer-properties" name="i-o-m-transformer-properties">Vlastnosti transformátora</a></h4>
|
||
<p>Okrem <span class="menu">Názvu</span> a <span class="menu">Šírky</span> ponúka okno <span class="menu">Vlastností</span> transformátora (v závislosti od typu mierne odlišné) možnosti:</p>
|
||
<table summary="Transformer properties" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td><span class="menu">Zakončenia</span></td><td style="width:15px;"></td><td><i>Iba pre Ťah</i>. Definuje zakončenia čiary: <span class="menu">Rovné</span>, <span class="menu">Štvorcové</span> alebo <span class="menu">Okrúhle</span>.</td></tr>
|
||
<tr><td><span class="menu">Detegovať orient.</span></td><td></td><td><i>Iba pre Obrys</i>. Určuje, či sa obrys nachádza vo vnútornej alebo vonkajšej strane cesty.</td></tr>
|
||
<tr><td><span class="menu">Spoje</span></td><td></td><td>Určuje akým spôsobom sa čiary spájajú v bode: <span class="menu">Ostrý</span>, <span class="menu">Oblý</span> alebo <span class="menu">Zrazený</span>.</td></tr>
|
||
<tr><td><span class="menu">Limit ostrého spoja</span></td><td></td><td>Iba keď sú hore uvedené <span class="menu">Spoje</span> nastavené na „Ostrý“, toto nastavenie má vplyv na vzhľad ostrého spoja. </td></tr>
|
||
</table>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-save" name="i-o-m-save">Uloženie ikony</a></h3>
|
||
<p>V hornej časti okna sa nachádza typická menu lišta, ktorá obsahuje možnosti <span class="menu">Súbor</span>, <span class="menu">Upraviť</span>, <span class="menu">Možnosti</span>. Z názvov je jasné, akú majú funkciu, takže bližšie si popíšeme iba ukladanie.</p>
|
||
<p><span class="menu">Súbor | Uložiť ako...</span> uloží ikonu v špecialnom formáte Icon-O-Matic, ktorý uchováva informácie ako názvy ciest, tvarov a štýlov. Tieto informácie budú odstránené potom, ako ikonu exportujete, aby sa ušetrilo miesto. Týmto spôsobom je dobré zálohovať vašu prácu, pretože bez pomenovaných objektov sa všetkému priradí názov „<path>/<shape>/<style>“, kvôli čomu môže byť ďalšia práca s ikonou únavná.</p>
|
||
|
||
<p><span class="menu">Súbor | Exportovať ako...</span> otvorí známy panel uloženia s možnosťou výberu formátu. Ponúka tieto možnosti:</p>
|
||
<table summary="file formats" border="0" cellspacing="0" cellpadding="2">
|
||
<tr><td>HVIF</td><td style="width:15px;"></td><td>Vektorový formát ikony Haiku</td></tr>
|
||
<tr><td>HVIF RDef</td><td></td><td>Uloží ako zdroj pre programátorov</td></tr>
|
||
<tr><td>Zdrojový kód HVIF</td><td></td><td>Uloží ako zdrojový kód pre programátorov</td></tr>
|
||
<tr><td>SVG</td><td></td><td>Uloží ako SVG</td></tr>
|
||
<tr><td>PNG</td><td></td><td>Uloží ako PNG s veľkosťou 64 pixlov</td></tr>
|
||
<tr><td>Množina PNG</td><td></td><td>Uloží ako PNG s veľkosťami 16, 32 a 64 pixlov</td></tr>
|
||
<tr><td>Atribút BEOS:ICON </td><td></td><td>Vyberte súbor a priamo mu priraďte ikonu ako atribút</td></tr>
|
||
<tr><td>Atribút META:ICON </td><td></td><td>Vyberte súbor a pripojte k nemu ikonu ako prosté metadáta</td></tr>
|
||
</table>
|
||
|
||
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-tips" name="i-o-m-tips">Tipy & Triky</a></h3>
|
||
<p>Zopár vecí, na ktoré by ste mali myslieť počas práce s Icon-O-Matic a všeobecné tipy pri používaní:</p>
|
||
<ul>
|
||
<li><p>Prečítajte si <a href="https://www.haiku-os.org/development/icon-guidelines">Pokyny</a> o tvorbe ikon, aby ste sa oboznámili s dôležitými charakteristikami ikon Haiku ako napr. perspektíva, farby a tiene.</p></li>
|
||
<li><p>Vždy by ste sa mali snažiť minimalizovať počet použitých ciest, lebo tie najviac zväčšujú výslednú veľkosť súboru. Cesty používajte opätovne tam, kde je to možné a pracujte s manipulovanými tvarmi a ich transformátormi. Šikovné použitie farebných prechodov vám tiež môže ušetriť miesto.</p></li>
|
||
<li><p>Tam, kde je to možné, by ste mali aktivovať možnosť Prichytávať k mriežke v <span class="menu">Možnostiach</span> počas práce s cestami. Body cesty zarovnané so sieťou 64x64 pixlov zaberajú menej miesta. Ak body nastavíte presne do rohov siete, dostanete najostrejší výsledok. Napríklad je dôležité zarovnať najvýraznejšie obrysy so sieťou 16x16 pixlov.</p></li>
|
||
<li><p>V náhľade zistite, či vaša ikona vyzerá dobre vo veľkosti 16x16. Možno sa vám zíde nastavenie <a href="#i-o-m-shape-lod">Úroveň detailov</a> popísané v sekcii Tvary.</p></li>
|
||
<li><p>Napriek tomu, že Icon-O-Matic nemá funkciu na vkladanie znakov, dá sa to urobiť ľahkým spôsobom. Jednoducho otvorte textový editor ako napr. StyledEdit, prispôsobte si typ štýl písma a myšou pretiahnite alebo skopírujte a vložte text do Icon-O-Matic. Všetky cesty a tvary sa vytvoria automaticky.</p></li>
|
||
<li><p>Ak jednému tvaru priradíte viac ako jednu cestu, ich prekrývajúce sa časti sa navzájom vymažú. Keď sa jedna cesta celá nachádza v druhej, vytvorí tak vo výslednom tvare dieru.</p></li>
|
||
<li><p>Plátno môžete pomocou kolieska myši priblížiť. Posúvať sa po plátne môžete buď držaním stredného tlačidla myši alebo ľavým tlačidlom počas držania klávesu <span class="key">SPACE</span>.</p></li>
|
||
</ul>
|
||
|
||
|
||
<!--
|
||
<h3>
|
||
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
|
||
<a id="i-o-m-workshops" name="i-o-m-workshops">Workshops</a></h3>
|
||
<p>The above is of course quite theoretical. The best way to learn using Icon-O-Matic is by experimenting. To get you started and once more show the basics, have a look at these short clips:</p>
|
||
<ul>
|
||
<li><a href="">Paths</a></li>
|
||
<li><a href="">Shapes</a></li>
|
||
<li><a href="">Styles</a></li>
|
||
<li><a href="">Transformers</a></li>
|
||
<li><a href="">Optimizing icons</a></li>
|
||
<li><a href=""></a></li>
|
||
</ul>
|
||
-->
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="nav">
|
||
<div class="inner"><span>
|
||
« <a href="haikudepot.html">HaikuDepot</a>
|
||
:: <a href="../applications.html#list-of-apps" class="uplink">Aplikácie</a>
|
||
:: <a href="installer.html">Installer</a> »
|
||
</span></div>
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|