Satelit Indonesia - Cara Membuat Widget Gambar di Skin Receiver GX6605S

Satelit Indonesia update tutorial cara membuat atau memasang widget image di theme receiver Guoxin GX6605S sendiri dengan mudah. Sudah beberapa lama Satelit Indonesia memberi waktu jeda dalam membahas skin receiver NationalChip GX6605S. Kali ini kita lanjutkan lagi dan memilih bahasan yang lumayan sedikit rumit.

Image atau gambar dalam theme atau skin receiver sangatlah penting walaupun sebenarnya tanpa imagepun juga bisa. Hanya saja memang dengan image lebih enak dalam desain dan tampilan lebih menarik daripada hanya permainan warna. Maka untuk widget image memang harus benar benar dipelajari, paling tidak selalu di coba, agar lebih cepat di mengerti prosesnya.

Dari proses desain di image editor, kemampuan nalar atau logika sangat penting dalam pemotongan. Hal ini sangat membantu dalam memperkecil ukuran block skin, kemudahan dalam coding membuat widget image. Jadi memang sangat penting dan ini membutuhkan pengalaman bukan sekedar pokoknya jadi tampil dengan baik, namun tidak optimal dalam ukuran.

Widget image sendiri terbagi menjadi 2 mode yaitu single dan multiple. Keduanya memiliki fungsi masing masing, jadi hanya kita yang menentukan butuh yang mana. Mode singlepun masih di bagi menjadi dua, yaitu statis dan dinamis. Untuk dinamis, biasanya di tentukan dari system mengenai nama class nya. Jadi kita tidak bisa sembarangan, seperti yang statis. Contoh widget dinamis seperti img_progbar_tv_radio , img_progbar_hd dan masih ada yang lain. Untuk lebih gampangnnya silahkan lihat image.

Single, hanya terdiri dari satu image untuk membentuk widget image. Mode ini dipakai jika memang tidak ada area yang bisa di ulang ulang, dan resolusi yang dipakai usahakan kecil untuk optimasi image. Untuk mode Multiple, widget image tersusun dari lebih dari satu gambar, dan biasanya digunakan untuk optimasi image yang bisa berulang ulang. Beberapa tag untuk widget image biasanya sudah di tentukan dari sistemnya, cotohnya sebagai berikut

Tag Widget Image Mode Multiple
Kode	Tag	Posisi
lt	lt_img	Bagian kiri atas ukuran menyesuaikan resolusi image dan fixed
rt	rt_img	Bagian kanan atas ukuran menyesuaikan resolusi image dan fixed
lb	lb_img	Bagian kiri bawah ukuran menyesuaikan resolusi image dan fixed
rb	rb_img	Bagian kanan bawah ukuran menyesuaikan resolusi image dan fixed
l	l_img	Bagian kiri akan di ulang ulang dari atas ke bawah setinggi ukuran image dengan lebar sesuai lebar image
r	r_img	Bagian kanan akan di ulang ulang dari atas ke bawah setinggi ukuran widget image dengan lebar sesuai lebar image
t	t_img	Bagian atas akan di ulang ulang dari kiri ke kanan selebar ukuran widget image dengan tinggi sesuai tinggi image
b	b_img	Bagian bawah akan di ulang ulang dari kiri ke kanan selebar ukuran widget image dengan tinggi sesuai tinggi image

Contoh source code widget image single adalah sebagai berikut

• <widget class="image" style="default" name="img_progbar_logo_si">
• <property>
• <rect>[797,76,80,52]</rect>
• <forecolor>[#ffff00,#ffff00,#ffff00]</forecolor>
• <backcolor>[gui_trans,gui_trans,gui_trans]</backcolor>
• <mode>single</mode>
• <img>ico_logo_si</img>
• </property>
• </widget>

Contoh source code widget image multiple adalah sebagai berikut

• <widget class="image" style="default" name="img_channel_edit_bkline">
• <property>
• <rect>[80,48,864,474]</rect>
• <forecolor>[default_color,default_color,default_color]</forecolor>
• <backcolor>[osd_back_color,osd_back_color,osd_back_color]</backcolor>
• <mode>multiple</mode>
• <img/>
• <lt_img>atn_Win_l_t001</lt_img>
• <rt_img>atn_Win_r_t001</rt_img>
• <lb_img>atn_Win_l_b001</lb_img>
• <rb_img>atn_Win_r_b001</rb_img>
• <l_img>atn_Win_l_m001</l_img>
• <r_img>atn_Win_r_m001</r_img>
• <t_img>atn_Win_t_m001</t_img>
• <b_img>atn_Win_b_m001</b_img>
• </property>
• </widget>

Selain tag, isi elemen sangat perlu diperhatikan, ada yang harus sama dengan sistem ada yang bisa seenak sendiri menyesuaikan declarasi yang ada di file image.xml. Jadi isi elemen ini harus di declarasikan dahulu dengan masukkan data ke file image.xml yang biasanya ada di folder image. Contoh penulisan source code declarasi image adalah sebagai berikut

• <image id="ico_logo_si">channelinfo/ico_logo_si.bmp</image>

Perhatikan, atribut id adalah id untuk mendeklarasikan isi elemen, dari contoh diatas maka ico_logo_si mendeklarasikan imaget yang berada di channelinfo/ico_logo_si. bmp. Deklarasi image ini sangat penting, tanpa melakukan ini maka image tidak akan tampil. Dan perlu dipahami juga perhatikan text case, usahakan harus sama.