haiku/docs/userguide/id/applications/icon-o-matic.html

367 lines
32 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?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="id" xml:lang="id">
<head>
<!--
*
* Copyright 2009-2013, Haiku. All rights reserved.
* Distributed under the terms of the MIT License.
*
* Authors:
* Humdinger <humdingerb@gmail.com>
* Translators:
* mazbrili abu ibrahim
*
-->
<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>Panduan pengguna</span></div>
</div>
<div class="nav">
<div class="inner">
<ul class="lang-menu">
<li class="now">Bahasa Indonesia&nbsp;<span class="dropdown-caret">&#9660;</span></li>
<li><a href="../../ca/applications/icon-o-matic.html">Català</a></li>
<li><a href="../../de/applications/icon-o-matic.html">Deutsch</a></li>
<li><a href="../../en/applications/icon-o-matic.html">English</a></li>
<li><a href="../../es/applications/icon-o-matic.html">Español</a></li>
<li><a href="../../eo/applications/icon-o-matic.html">Esperanto</a></li>
<li><a href="../../fr/applications/icon-o-matic.html">Français</a></li>
<li><a href="../../fur/applications/icon-o-matic.html">Furlan</a></li>
<li><a href="../../it/applications/icon-o-matic.html">Italiano</a></li>
<li><a href="../../hu/applications/icon-o-matic.html">Magyar</a></li>
<li><a href="../../pl/applications/icon-o-matic.html">Polski</a></li>
<li><a href="../../pt_PT/applications/icon-o-matic.html">Português</a></li>
<li><a href="../../pt_BR/applications/icon-o-matic.html">Português (Brazil)</a></li>
<li><a href="../../ro/applications/icon-o-matic.html">Română</a></li>
<li><a href="../../sk/applications/icon-o-matic.html">Slovenčina</a></li>
<li><a href="../../fi/applications/icon-o-matic.html">Suomi</a></li>
<li><a href="../../sv_SE/applications/icon-o-matic.html">Svenska</a></li>
<li><a href="../../tr/applications/icon-o-matic.html">Türkçe</a></li>
<li><a href="../../zh_CN/applications/icon-o-matic.html"> 中文 [中文]</a></li>
<li><a href="../../ru/applications/icon-o-matic.html">Русский</a></li>
<li><a href="../../uk/applications/icon-o-matic.html">Українська</a></li>
<li><a href="../../jp/applications/icon-o-matic.html">日本語</a></li>
</ul>
<span>
« <a href="haikudepot.html">HaikuDepot</a>
:: <a href="../applications.html#list-of-apps" class="uplink">Aplikasi</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>Indeks</td></tr>
<tr class="index"><td><a href="#bitmap-vector">BeOS bitmap vs vektor ikon Haiku</a><br />
<a href="#icons-attributes">Ikon adalah atribut</a><br />
<a href="#i-o-m">Membuat ikon dengan Icon-O-Matic</a><br />
<a href="#i-o-m-path">Path</a><br />
<a href="#i-o-m-shape">Bentuk</a><br />
<a href="#i-o-m-style">Gaya</a><br />
<a href="#i-o-m-transformer">Transformator</a><br />
<a href="#i-o-m-save">Menyimpan ikon</a><br />
<a href="#i-o-m-tips">Tips &amp; Trik</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" />Ikon otomatis (Icon-O-Matic)</h2>
<table summary="layout" border="0" cellspacing="0" cellpadding="2">
<tr><td>Deskbar:</td><td style="width:15px;"></td><td><span class="menu">Aplikasi</span></td></tr>
<tr><td>Lokasi:</td><td></td><td><span class="path">/boot/system/apps/Icon-O-Matic</span></td></tr>
<tr><td>Pengaturan:</td><td></td><td><span class="path">~/config/settings/Icon-O-Matic</span></td></tr>
</table>
<p><br /></p>
<p>Sebelum kita sampai pada pembuatan ikon di Icon-O-Matic, beberapa kata tentang ikon Haiku secara umum.</p>
<h2>
<a href="#"><img src="../../images/up.png" style="border:none;float:right" alt="index" /></a>
<a id="bitmap-vector" name="bitmap-vector">BeOS bitmap vs. Ikon Vektor Haiku </a></h2>
<p>Berlawanan dengan BeOS, Haiku menggunakan ikon vektor, bukan ikon bitmap. Format ikon vektor Haiku (HVIF) khusus dikembangkan yang sangat dioptimalkan untuk ukuran file kecil dan rendering cepat. Itulah sebabnya sebagian besar ikon kita <i>jauh</i> lebih kecil daripada bitmap atau format SVG yang banyak digunakan. Juga, tidak seperti ikon bitmap BeOS, Haiku tidak terbatas pada palet 8bit (256 warna).<br />
Ambil ikon Terminal ini, misalnya:</p>
<table border="0" cellpadding="10">
<tr align="center"><td><b>Bitmap</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 bita<br />+ 256 bita</td><td> 7,192 bita</td><td> 768 bita</td></tr>
</table>
<p>Perhatikan bahwa BeOS menggunakan dua versi ikon, satu 16x16 dan satu 32x32, untuk mencapai visual yang baik dalam mode Daftar dan Ikon Tampilan.</p>
<p>Trik ini tidak diperlukan dengan ikon vektor. Selain hanya mengambil beberapa ratus byte dalam file, ikon vektor juga berskala jauh lebih baik daripada bitmap. (Catatan: BeOS hanya menawarkan tampilan 16x16 dan 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>Bitmap</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>Vektor</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">Ikon adalah atribut</a></h2>
<p>Ikon disimpan sebagai atribut dengan file mereka. Namun, itu tidak berarti bahwa setiap file harus memiliki atribut ini untuk muncul dengan ikon di jendela Tracker: file data mewarisi ikon mereka dari jenis file mereka. Untuk mengubah ikon filetype secara global, Anda menggunakan preferensi <span class="app">FileTypes</span>. Jika Anda hanya ingin menambahkan ikon khusus ke file individual, Anda menggunakan <span class="app">FileType add-on</span> sebagai gantinya. Lihat topik <a href="../filetypes.html">Filetypes</a> untuk informasi lebih lanjut.</p>
<div class="box-info">Menjadi atribut, itu berarti bahwa hanya sistem file yang mendukung metadata yang dapat mempertahankan ikon file individu. Jadi, jika Anda memindahkan file dari volume BFS Anda, pertimbangkan untuk memperbesarnya sehingga Anda tidak kehilangan ikon atau atribut lainnya.</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">Membuat ikon dengan Icon-O-Matic</a></h2>
<p>Icon-O-Matic adalah editor ikon Haiku yang dapat menyimpan pekerjaan Anda sebagai HVIF, SVG atau PNG. Ikon juga dapat secara langsung dilampirkan sebagai atribut ke file yang ada atau diekspor sebagai sumber daya atau file sumber yang digunakan oleh pengembang. Karena aplikasi ini dirancang untuk format HVIF yang dioptimalkan, penggunaannya mencerminkan cara kerja dalam format ini.</p>
<p>Selain dari perangkat halus grafik vektor normal, Anda tidak berurusan dengan objek terpisah yang masing-masing menyertakan semua properti spesifiknya seperti jalur, lebar garis, garis dan warna isi dll. Sebaliknya, Anda merakit objek Anda ("bentuk") dari jalur bersama dan warna ("gaya") dan atur properti tertentu. Penggunaan kembali elemen-elemen ini adalah satu rahasia efisiensi HVIF. Meskipun itu memberlakukan beberapa kendala pada desainer ikon, ada beberapa keuntungan juga.<br />
Misalnya, dengan menggunakan kembali jalur, beberapa objek dapat dimodifikasi bersama dengan memanipulasi jalur yang satu ini. Pikirkan sebuah objek dan bayangannya. Memodifikasi path bersama mereka akan mengubah objek itu sendiri dan secara otomatis bayangannya (mungkin sedikit terdistorsi / diterjemahkan).</p>
<p>Berikut ini ikhtisar singkat jendela Icon-O-Matic:</p>
<img src="../images/apps-images/i-o-m-overview.png" alt="i-o-m-overview.png" />
<p>Untuk membuat objek yang terlihat di kanvas, Anda memerlukan bentuk dengan jalur dan gaya. Dengan mudah, Anda dapat membuat satu, dua, atau ketiganya dari menu <span class="menu">Shape</span>. Setiap jenis objek (Paths, Shapes, Transformers, dan Styles) memiliki menu di atas daftar elemen, menawarkan berbagai perintah. Setiap elemen memiliki opsi tertentu yang diatur dalam tampilan <span class="menu">Properti</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">Jalur</a></h3>
<p>Jalur terdiri dari beberapa titik yang terhubung dengan garis atau kurva Bezier. Untuk menambah atau mengubah titik, pastikan jalur dipilih dalam daftar jalur.</p>
<p>Cukup mengklik di kanvas akan mengatur titik pertama. Saat menetapkan titik, Anda memutuskan apakah garis yang dihasilkan akan lurus atau melengkung: klik dan lepaskan sederhana menghasilkan garis lurus, menahan tombol mouse dan menggerakkan mouse akan menarik pegangan untuk kurva Bezier. Tentu saja, Anda juga bisa mengubahnya nanti.</p>
<img src="../../images/apps-images/i-o-m-path-ab.png" alt="i-o-m-path-ab" />
<p>Untuk mendapatkan dari "A" ke "B", Anda harus mengubah beberapa titik dari titik sudut ke titik kurva. Itu dilakukan dengan menahan <span class="key">ALT</span> sambil mengklik pada suatu titik dan menarik keluar pegangan. Ini menghasilkan Bezier simetris: pegangan kedua mengikuti gerakan yang lain. Jika Anda perlu memindahkan gagang secara mandiri, click &amp; drag pada gagang Bezier sambil menahan <span class="key">ALT</span>.<br />
Begitu juga sebaliknya, untuk beralih dari Bezier ke titik sudut, tahan <span class="key">ALT</span> dan klik satu titik.</p>
<p>Untuk memindahkan titik, cukup klik &amp; seret. Untuk memilih lebih dari satu titik, tahan <span class="key">SHIFT</span> dan gambarkan kotak pilihan. Poin yang dipilih ditandai dengan batas merah, bukan hitam biasa.<br />
Untuk menyisipkan titik ke jalur Anda mengklik pada garis penghubung antara dua titik.<br />
Poin yang dipilih dihapus dengan menekan <span class="key">DEL</span> atau dengan mengklik titik mana saja sambil menahan <span class="key">CTRL</span>.</p>
<p>Pointer mouse menunjukkan mode saat ini:</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>Pindahkan titik</td>
<td>Sisipkan titik</td>
<td>Menambah titik</td>
<td>Menghapus titik<br /><span class="key">CTRL</span></td>
<td>Pojok↔Bezier<br /><span class="key">ALT</span></td>
<td>Pilih titik<br /><span class="key">SHIFT</span></td>
</tr>
</table>
<p>Anda dapat menjalankan menu konteks dengan mengklik kanan titik atau pilihan titik:
</p>
<table summary="Path context" border="0" cellspacing="0" cellpadding="2">
<tr><td class="onelinetop"><span class="menu">Pilih semua</span></td><td style="width:70px"><span class="key">ALT</span> <span class="key">A</span></td><td>Memilih semua titik dari jalur saat ini.</td></tr>
<tr><td><span class="menu">Transformasi </span></td><td><span class="key">T</span></td><td>Letakkan semua titik yang dipilih dalam kotak transformasi, sehingga Anda dapat memindahkan, mengubah ukuran, dan memutar keduanya. Ini bekerja seperti halnya dengan bentuk, dijelaskan sedikit lebih jauh ke bawah.</td></tr>
<tr><td><span class="menu">Belah</span></td><td></td><td>Membagi poin yang dipilih menjadi dua, satu duduk di atas yang lain.</td></tr>
<tr><td><span class="menu">Balik </span></td><td></td><td>Memutar titik yang dipilih sebesar 180°. Hanya berpengaruh </td></tr>
<tr><td><span class="menu">Hapus </span></td><td><span class="key">DEL</span></td><td>DEL Menghapus poin yang dipilih.</td></tr>
</table>
<h4><a id="i-o-m-path-menu" name="i-o-m-path-menu">Menu Jalur</a></h4>
<p>Menu <span class="menu">Jalur </span> menawarkan beberapa entri yang jelas untuk <span class="menu">Tambahkan persegi </span> and <span class="menu">Tambahkan lingkaran</span> or to <span class="menu">Gandakan </span> or <span class="menu">Hapus </span> jalur. Berikut ini beberapa yang mungkin perlu sedikit dijelaskan:</p>
<table summary="Path menu" border="0" cellspacing="0" cellpadding="2">
<tr><td><span class="menu">Membalikkan </span></td><td style="width:15px;"></td><td>Jika jalur Anda tidak "tertutup" (lihat Properti Jalur di bawah), klik ke kanvas selalu membuat titik baru, menghubungkannya dengan yang terakhir. "Balikkan" akan membalikkan pesanan ini dan titik baru Anda akan terhubung ke titik awal asli sebagai gantinya.</td></tr>
<tr><td><span class="menu">Bersihkan </span></td><td></td><td>Paling berguna dengan SVG yang diimpor, fungsi ini akan menghapus titik-titik redundan.</td></tr>
<tr><td class="onelinetop"><span class="menu">Putar indeks ke kanan </span></td><td><span class="key">ALT</span> <span class="key">R</span></td><td>Secara praktis, ini memutar bukaan jalan. Paling baik dilihat saat menggunakan jalur yang tidak tertutup dengan gaya dan bentuk dengan transformator stroke. Sekarang, jika jalur Anda terlihat seperti ⊂ itu akan berputar seperti ini: ⊂ ∩ ⊃ .</td></tr>
<tr><td class="onelinetop"><span class="menu">Putar indeks ke kiri</span></td><td><span class="key">ALT</span> <span class="key">SHIFT</span> <span class="key">R</span></td><td>Lakukan hal yang sama di arah lain.</td></tr>
</table>
<h4><a id="i-o-m-path-properties" name="i-o-m-path-properties">Properti Jalur</a></h4>
<p><span class="menu">Properti</span> di kiri bawah jendela menawarkan semua pengaturan yang tersedia dari objek yang saat ini dipilih. Jalur hanya memiliki dua: <span class="menu">Nama</span> dan jika <span class="menu">Ditutup</span> atau tidak.</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">Bentuk </a></h3>
<p>Suatu bentuk mengelompokkan satu atau beberapa jalur dengan suatu gaya. Praktis, itu objek yang benar-benar akan Anda lihat di kanvas. Pengelompokan dilakukan dengan kotak centang di depan jalur dan gaya: Cukup pilih bentuk Anda dan centang dari jalur yang diinginkan dan gaya.</p>
<p>Bentuk menentukan bagaimana jalur dan gaya diterapkan, mis. jika objek diisi atau hanya dibelai (yang dilakukan dengan menggunakan Transformers pada bentuk, kita akan membahasnya nanti). Juga, suatu bentuk dapat dipindahkan, diputar atau diubah ukurannya tanpa menyentuh jalur yang digunakan. Dengan begitu, Anda bisa menggunakan kembali satu jalur dan mendapatkan bentuk yang berbeda namun terkait.</p>
<img src="../../images/apps-images/i-o-m-shape.png" alt="i-o-m-shape" />
<p>Ketika suatu bentuk dipilih dari daftar, sebuah persegi panjang digambar di sekitarnya. Tergantung di mana tepatnya Anda mengambilnya, bentuknya dipindahkan, diubah ukurannya atau diputar di sekitar titik di tengahnya, yang dengan sendirinya dapat dipindahkan. Memegang <span class="key">SHIFT</span> akan mengunci arah saat bergerak, membatasi sudut putar hingga 45° dan membatasi rasio aspek saat mengubah ukuran. Pointer mouse lagi menunjukkan mode saat ini:</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>Pindah</td>
<td>Ubah size</td>
<td>Putar</td>
<td>Pindahkan<br />titik putar</td>
</tr>
</table>
<p>Bentuk berbaring di atas satu sama lain, masing-masing pada lapisannya sendiri, jika Anda mau. Untuk menyusun ulang mereka, Anda seret &amp; jatuhkan entri mereka ke posisi yang berbeda dalam daftar.</p>
<h4><a id="i-o-m-shape-menu" name="i-o-m-path-menu">Menu Bentuk</a></h4>
<p>Menu <span class="menu">Shape</span> menawarkan kemungkinan yang disebutkan sebelumnya untuk <span class="menu">Tambahkan kosong, dengan jalur/gaya/jalur &amp; gaya</span> dan untuk <span class="menu">Gandakan </span> atau <span class="menu">Hapus </span> bentuk. Lalu ada:</p>
<table summary="Shape menu" border="0" cellspacing="0" cellpadding="2">
<tr><td><span class="menu">Atur ulang transformasi</span></td><td style="width:15px;"></td><td>Mengembalikan semua gerakan, mengubah ukuran, dan memutar transformasi yang telah Anda terapkan pada bentuk.</td></tr>
<tr><td class="onelinetop"><span class="menu">Bekukan transformasi</span></td><td></td><td>Ketika Anda mengubah bentuk, jalur yang ditugaskan tetap pada posisi aslinya. Ini mungkin dimaksudkan; mungkin lebih dari satu bentuk menggunakan jalur itu, mungkin Anda sengaja menggunakan <span class="menu"> Pilihan | Jepret ke kisi</span> untuk mengatur titik pada batas piksel yang tepat.<br />
Jika tidak, "Pembekuan Transformasi" akan menerapkan transformasi bentuk saat ini ke jalur yang ditetapkan. "Reset Transformasi" yang akan datang kemudian akan kembali ke keadaan baru ini.
</td></tr>
</table>
<h4><a id="i-o-m-shape-properties" name="i-o-m-shape-properties">Properti Bentuk</a></h4>
<p>Selain <span class="menu">Nama</span>, tampilan <span class="menu">Properti </span> untuk bentuk tampilan memiliki opsi ini:</p>
<table summary="Shape properties" border="0" cellspacing="0" cellpadding="2">
<tr><td><span class="menu">Min LOD</span></td><td></td><td>Level Minimum Detail</td></tr>
<tr><td><span class="menu">Maks LOD</span></td><td></td><td>Level Maksimum Detail</td></tr>
</table>
<h5><a id="i-o-m-shape-lod" name="i-o-m-shape-lod">Level Detail (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>Lihat bagaimana tidak ada angka dalam versi 16px dari ikon BeVexed? Itu dilakukan dengan pengaturan "Level of Detail" dari bentuknya.<br />
Dengan LOD Anda mengontrol visibilitas bentuk tergantung pada ukurannya. Dengan begitu, Anda dapat meninggalkan detail ikon yang terlihat bagus pada ikon yang lebih besar, tetapi mungkin tidak begitu banyak pada versi yang lebih kecil.</p>
<p>Beginilah cara kerjanya: LOD 1.0 didefinisikan sebagai ukuran ikon 64px. Untuk mendapatkan LOD dari ukuran ikon tertentu, Anda cukup membaginya dengan 64, mis. ikon 16px memiliki LOD 16/64 = 0,25. Bentuk tidak akan terlihat di bawah <span class="menu">Min LOD</span> dan diatas <span class="menu">Max LOD</span>.</p>
<p>Jadi, jika Anda mengatur <span class="menu">Min LOD</span> bentuk ke 0,0 dan <span class="menu">Max LOD</span> ke 0,5, ini berarti bahwa bentuk hanya akan terlihat untuk ukuran ikon yang lebih kecil atau <i>sama</i> dengan 32px. Jika Anda ingin mengecualikan ukuran ikon 32px, Anda harus tetap di bawah 0,5, katakan 0,49.</p>
<p>LOD tidak hanya untuk meninggalkan detail bentuk, tetapi juga untuk mis. ubah lebar goresan pada ukuran yang berbeda, jika Anda merasa itu diperlukan. Cukup duplikat bentuk, buat perubahan Anda dan atur kedua pengaturan LOD mereka untuk menunjukkan salah satu atau yang lain. Di sinilah letak satu-satunya sumber kebingungan potensial, ketika Anda tanpa sadar tumpang tindih bentuk-bentuk LOD, dan bertanya-tanya mengapa pada beberapa ukuran keduanya terlihat ...<br />
Misalnya, jika Bentuk 1 ditunjukkan di bawah 48px dan Bentuk 2 dari 48px ke atas (LOD: 48/64 = 0,75):</p>
<table summary="LOD values example" border="0" cellpadding="5">
<tr align="center"><td></td><td colspan="2"><b>OKE</b></td><td style="width:25px" rowspan="6"></td><td colspan="2"><b>Tidak OKE!</b></td></tr>
<tr style="background-color:#F1F1F1"><td rowspan="2" style="vertical-align:middle ; background-color:#FFFFFF"><b>Bentuk 1</b></td><td>Min LOD</td><td>0.00</td><td>Min LOD</td><td>0.00</td></tr>
<tr style="background-color:#F1F1F1"><td>Max LOD</td><td><span style="background-color:#33FF33">0.74</span></td><td>Max LOD</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>Bentuk 2</b></td><td>Min LOD</td><td>0.75</td><td>Min LOD</td><td>0.75</td></tr>
<tr style="background-color:#F8F8F8"><td>Max LOD</td><td>4.00</td><td>Max LOD</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">Gaya </a></h3>
<p>Gaya dapat berupa warna solid atau beberapa jenis gradien.<br />
Selain warna yang telah ditentukan di bawah <span class="menu">Swatches</span>, Anda dapat mencampur warna Anda sendiri dengan mengklik warna saat ini. Perhatikan juga slider di bawah spektrum warna yang mengatur saluran alpha (transparansi).</p>
<img src="../images/apps-images/i-o-m-gradients.png" alt="i-o-m-gradients" />
<p>Anda dengan cepat membuat gaya baru dengan mencampur warna Anda dan cukup seret &amp; jatuhkan ke dalam daftar gaya.</p>
<p>Jika Anda memilih gradien, Anda mengatur tipe (<span class="menu">Linear</span>, <span class="menu">Radial</span>, <span class="menu">Diamond</span>, <span class="menu">Cone</span>) dan kemudian menentukan warna awal dan akhir. Ini dilakukan dengan drag &amp; drop dari ember warna ke masing-masing indikator warna di bawah gradien.<br />
Tentu saja Anda dapat memindahkan indikator ini untuk mengubah gradien sesuai keinginan Anda. Anda juga dapat memasukkan lebih banyak indikator untuk menambahkan lebih banyak warna dengan mengklik dua kali pada gradien. Menekan <span class="key">DEL</span> menghapus indikator yang dipilih.</p>
<p>Anda dapat memindahkan, mengubah ukuran, dan memutar kotak gradien pada kanvas hingga sesuai dengan kebutuhan Anda. Ini berfungsi seperti halnya dengan bentuk.</p>
<h4><a id="i-o-m-style-menu" name="i-o-m-style-menu">Menu Gaya</a></h4>
<p>Menu <span class="menu">Gaya </span> menawarkan entri biasa ke <span class="menu">Tambah</span>, <span class="menu">Gandakan </span> atau <span class="menu">Hapus </span> gaya dan untuk <span class="menu">Reset transformasi</span>.</p>
<h4><a id="i-o-m-style-properties" name="i-o-m-style-properties">Properti Gaya</a></h4>
<p><span class="menu">Nama</span> adalah satu satunya <span class="menu">Properti</span> dari gaya.</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">Transformer</a></h3>
<p>Suatu bentuk dapat memiliki Transformer yang mengubah penampilannya. Efeknya, bagaimanapun, lebih halus daripada truk yang berubah menjadi robot pertempuran</p>
<h4><a id="i-o-m-transformer-menu" name="i-o-m-transformer-menu">Transformer Menu Tambah </a></h4>
<table summary=" Transformer Add menu" border="0" cellspacing="0" cellpadding="2">
<tr><td><span class="menu">Kontur</span></td><td></td><td>Menambahkan garis besar ke bentuk.</td></tr>
<tr><td><span class="menu">Ketukan</span></td><td></td><td>Mengelus jalur bentuk bukannya mengisinya dengan gaya.</td></tr>
</table>
<p>Bergantung pada jenis Transformer, Anda akan mendapatkan serangkaian properti yang berbeda.</p>
<h4><a id="i-o-m-transformer-properties" name="i-o-m-transformer-properties">Properti Transformer </a></h4>
<p>Selain <span class="menu">Nama</span> dan <span class="menu">Lebar</span> aktual untuk transformator, tampilan <span class="menu">Properti</span> memiliki opsi (tergantung pada jenisnya yang sedikit berbeda):</p>
<table summary="Transformer properties" border="0" cellspacing="0" cellpadding="2">
<tr><td><span class="menu">Caps</span></td><td style="width:15px;"></td><td><i>Stroke saja</i>. mendefinisikan tutup ujung dari garis: <span class="menu">Butt</span>, <span class="menu">Square</span> atau <span class="menu">Round</span>.</td></tr>
<tr><td><span class="menu">Deteksi orient.</span></td><td></td><td><i>Hanya kontur. </i>. Menentukan apakah kontur berada di dalam atau di luar jalur.</td></tr>
<tr><td><span class="menu">Gabung</span></td><td></td><td>Menentukan bagaimana garis digabungkan pada satu titik: <span class="menu">Miter</span>, <span class="menu">Round</span> atau <span class="menu">Bevel</span>.
</td></tr>
<tr><td><span class="menu">Batas Miter</span></td><td></td><td>Hanya ketika <span class="menu">gabungan </span> di atas diatur ke "Mitre", pengaturan ini memengaruhi tampilan sambungan miter.</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">Meyimpan icon</a></h3>
<p>Ada bilah menu seperti biasa di bagian atas, <span class="menu">Berkas</span>, <span class="menu">Edit</span>, <span class="menu">Opsi</span>. Penggunaannya cukup menjelaskan sendiri, jadi kami hanya akan melihat bagaimana cara menyimpan pekerjaan Anda.</p>
<p><span class="menu">Berkas | Simpan sebagai...</span> akan menyimpan dalam format Ikon-O-Matic khusus yang menyimpan informasi tambahan seperti nama jalur, bentuk, dan gaya. Ini akan dihapus dari ikon sebenarnya setelah Anda mengekspornya untuk menghemat ruang. Sebaiknya buat cadangan pekerjaan Anda seperti ini, karena tanpa menyebut objek semuanya bernama "&lt;path&gt;/&lt;shape&gt;/&lt;style&gt;" yang membuat perubahan spesifik menjadi membosankan.</p>
<p><span class="menu">berkas | Export sebagai ...</span> membuka panel simpan yang familier dengan menu pop-up format file di bagian bawah, menawarkan pilihan ini:</p>
<table summary="file formats" border="0" cellspacing="0" cellpadding="2">
<tr><td>HVIF</td><td style="width:15px;"></td><td>Haiku Vector Icon Format</td></tr>
<tr><td>HVIF RDef</td><td></td><td>disimpan sebagai resource yang dipakai programmer</td></tr>
<tr><td>HVIF source code</td><td></td><td>disimpan sebagai resource yang dipakai programmer</td></tr>
<tr><td>SVG</td><td></td><td>Simpain sebagai SVG</td></tr>
<tr><td>PNG</td><td></td><td>Simpan sebagai PNG berukuran 64px</td></tr>
<tr><td>PNG set</td><td></td><td>Simpan sebagai PNG berukuran 16,32 dan 64px</td></tr>
<tr><td>BEOS:ICON attribute</td><td></td><td>Pilih file dan atur atribut ikonnya secara langsung</td></tr>
<tr><td>META:ICON attribute</td><td></td><td>Pilih file dan lampirkan ikon sebagai data meta belaka</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">Tip &amp; Trik</a></h3>
<p>Beberapa hal yang harus Anda ingat ketika bekerja dengan Icon-O-Matic dan beberapa tips umum untuk penggunaannya:</p>
<ul>
<li>Baca <a href="https://www.haiku-os.org/development/icon-guidelines"> Panduan Ikon</a> untuk mempelajari tentang karakteristik penting ikon Haiku, mis. perspektif, bayangan dan <a href="https://www.haiku-os.org/files/downloads/2007-03-20_haiku-color-palette.png">palet warna Haiku</a>.</li>
<li><p>Anda harus selalu berusaha meminimalkan penggunaan jalur Anda, itu yang paling mahal, ukuran file bijaksana. Gunakan kembali jalur sedapat mungkin dan bekerja dengan bentuk yang dimanipulasi dan transformernya. Penggunaan gradien yang cerdas juga dapat menghemat ruang.</p></li>
<li><p>Jika memungkinkan, Anda harus mengaktifkan Snap-to-Grid dari menu <span class="menu">Opsi</span> saat mengedit jalur. Jalur poin yang sejajar dengan grid 64x64 piksel menggunakan lebih sedikit ruang penyimpanan. Anda juga akan mendapatkan tampilan yang paling tajam jika titik ditetapkan pada batas piksel yang tepat. Misalnya, penting untuk menyelaraskan garis besar paling menonjol dengan kisi 16x16</p></li>
<li><p>Periksa pratinjau untuk melihat apakah ikon Anda masih terlihat bagus di 16x16. Anda mungkin ingin menggunakan pengaturan <a href="#i-o-m-shape-lod">Level Of Detail</a> yang dijelaskan di bagian Bentuk.</p></li>
<li><p>Ada cara mudah untuk menghasilkan huruf, bahkan jika Icon-O-Matic tidak menyediakan alat seperti itu. Cukup masukkan teks dalam editor teks seperti StyledEdit, sesuaikan jenis dan gaya font, dan seret &amp; lepas atau salin &amp; tempel teks yang dipilih ke dalam Icon-O-Matic. Ini akan membuat jalur dan bentuk yang sesuai.</p></li>
<li><p>Jika Anda menetapkan lebih dari satu jalur ke suatu bentuk, area yang tumpang tindih akan saling membatalkan. Ketika satu jalur benar-benar di dalam yang lain, itu praktis membuat lubang dalam bentuk yang dihasilkan.</p></li>
<li><p>Anda dapat memperbesar dan memperkecil kanvas dengan roda mouse. Panning dilakukan dengan mengklik &amp; seret dengan tombol tengah mouse atau dengan klik kiri normal &amp; seret sambil menahan <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">Aplikasi</a>
:: <a href="installer.html">Installer</a> »
</span></div>
</div>
</body>
</html>