Home » Archives for Juli 2013
*RePosting dari rumah lama.Yuuuk mari langsung aja yak??ini adalah termasuk dalam basic advance dalam pembuatan manual SVG code menurut saya.di sini akan saya ambil contoh untuk device 480x360 (onyx)untuk menulisnya gunakan Notepad++sebelum mulai, penulisan svg code ini untuk "fix icon" bukan yang bisa ditentukan sendiri oleh user. Mariiiii,,Pertama, siapkan dulu icon2 nya (image extention .png) misal size nya 100x100 pixel dan saya kasih nama : Messages.png
Quote:
Code:
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.w3.org/2000/svghttp://www.plazmic.com/svg/schema/svg.xsd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xforms="http://www.w3.org/2002/xforms" xmlns:pz="http://www.plazmic.com/plazmic_extents" id="TESTING" xml:space="default" width="100%" height="100%" viewBox="0 0 480 360" preserveAspectRatio="xMidYMid meet">
<g id="TB_Messages">
<image id="Msg" width="100" height="100" x="0" y="0" display="inline" xlink:href="Images/Messages.png"/>
<image id="Msg-fokus" width="100" height="100" x="0" y="0" display="inline" xlink:href="Images/Messages_f.png"/>
<set attributeName="display" begin="TB_Messages.focusin" to="none" xlink:href="#Msg"/>
<set attributeName="display" begin="TB_Messages.focusin" to="inline" xlink:href="#Msg-fokus"/>
<set attributeName="display" begin="TB_Messages.focusout" to="inline" xlink:href="#Msg"/>
<set attributeName="display" begin="TB_Messages.focusout" to="none" xlink:href="#Msg-fokus"/>
<loadScene begin="TB_Messages.activate" xlink:href="x-exec://net_rim_bb_messaging_app.Messages"/>
</g>
</svg>
Simple kan?? hehehehe
yuuuk, kita bahas tiap perintah nya :
code bagian ini harus ada karena itu basic command nya, bisa anda peroleh dari hasil compile ataupun dari composser yang d export ke .svg
id="TESTING" = id dari svg itu sendiri..terserah mo d kasih nama apa aja juga boleh..
viewBox="0 0 480 360" = d sini saya setting "x" dan "y" pada posisi "0" (pojok kiri atas dari layar)
untuk normal nya dari composser dia akan tertulis "-240 -180 480 360" (layar d bagi 2) ... dalam perhitungan menentukan posisi saya kira akan lebih enak jika pakai yg "0" 
Code:
<g id="TB_Messages">
yang akan menunjukkan id button dari image yg kita buat.
Code:
<image id="Msg" width="100" height="100" x="0" y="0" display="inline" xlink:href="Images/Messages.png"/>
id untuk menampilkan dari image pada posisi normal
Code:
<image id="Msg-fokus" width="100" height="100" x="0" y="0" display="inline" xlink:href="Images/Messages_f.png"/>
id untuk menampilkan dari image pada posisi fokus
Code:
<set attributeName="display" begin="TB_Messages.focusin" to="none" xlink:href="#Msg"/>
<set attributeName="display" begin="TB_Messages.focusin" to="inline" xlink:href="#Msg-fokus"/>
<set attributeName="display" begin="TB_Messages.focusout" to="inline" xlink:href="#Msg"/>
<set attributeName="display" begin="TB_Messages.focusout" to="none" xlink:href="#Msg-fokus"/>
adalah setting untuk image fokus dan normalnya. lihat pada bagian begin dan to sertaxlink:hrefnya
Code:
<loadScene begin="TB_Messages.activate" xlink:href="x-exec://net_rim_bb_messaging_app.Messages"/>
adalah untuk menampilkan isi / fitur dari image tersebut. (di sini saya ambil contoh untuk mengakses fitur Message dari bb kita)
Sekian dulu simple tutorial ini..jika ada permasalahan, silahkan post d sini aja yak? biar kita pecahkan sama2...terimakasih..Make It Better Than Ever
Read More »
ORIGINAL BY Jizzomaru Hai.. BZT dondoters and BZoners,Kali ini kami dari BZThemers ingin berbagi tips cara menshrink koding SVG yang notabene hasil export dari composer amat sangat banyak baris yang tidak perlu dan bisa di buang, dengan menshrink kode dalam SVG selain meminimalisasi size dari SVG tersebut, dapat memudahkan kita untuk memanage setiap baris kode pada SVG kita.Banyak sekali developer themes yang membuat/mencoding SVG nya secara manual dari nol, tanpa menggunakan bantuan dari Composer, hal ini tentu sangat memberikan keuntungan tersediri bagi developer themes tersebut, okey tanpa banyak bicara mari kita mulai proses shrinking SVG.Perhatikan baris kode dari SVG yang saya buat dari hasil export BlackBerry Composer, yang isinya hanya satu tombol….
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by BlackBerry Composer Version: 6.0.0.21 - Apr 18 2011 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2000/svg http://www.plazmic.com/svg/schema/svg.xsd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xforms="http://www.w3.org/2002/xforms"
xmlns:pz="http://www.plazmic.com/plazmic_extents"
id="Untitled_10" xml:space="default" width="480" height="360" viewBox="-240 -180 480 360" preserveAspectRatio="xMidYMid meet">
<g id="Layer_1">
<!-- pz:tag type="layer" -->
<g id="Theme_Button_1"
transform="translate(-204 23)">
<!-- pz:tag type="button" -->
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="tabImage">
<image id="img_1_1_11" x="0" y="0" width="68" height="68" xlink:href="Images/tabImage_img_1_1.png"/>
<image id="img_11_1_12" x="0" y="0" width="68" height="68" xlink:href="Images/tabImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_13" x="0" y="0" width="68" height="68" xlink:href="Images/tabImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_14" x="0" y="0" width="68" height="68" xlink:href="Images/tabImage_img_1_1.png" visibility="hidden"/>
</g>
<g id="tabFocusImage">
<image id="img_1_1_15" x="0" y="0" width="68" height="68" xlink:href="Images/tabFocusImage_img_1_1.png" visibility="hidden"/>
<image id="img_11_1_16" x="0" y="0" width="68" height="68" xlink:href="Images/tabFocusImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_17" x="0" y="0" width="68" height="68" xlink:href="Images/tabFocusImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_18" x="0" y="0" width="68" height="68" xlink:href="Images/tabFocusImage_img_1_1.png" visibility="hidden"/>
</g>
<g id="normalImage">
<image id="img_1_1_19" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png"/>
<image id="img_11_1_20" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_21" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_22" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
</g>
<g id="focusImage">
<image id="img_1_1_23" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_11_1_24" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_25" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_26" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
</g>
</g>
</g>
</g>
<!-- pz:tag output="anim" -->
<loadScene xlink:href="x-exec://net_rim_bb_messaging_app.Messages" begin="Theme_Button_1.activate"/>
<animate xlink:href="#img_1_1_11" id="_anim_3" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_11" id="_anim_4" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_11" id="_anim_5" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_12" id="_anim_6" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_12" id="_anim_7" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_12" id="_anim_8" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_13" id="_anim_9" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_13" id="_anim_10" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_13" id="_anim_11" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_14" id="_anim_12" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_14" id="_anim_13" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_14" id="_anim_14" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_15" id="_anim_15" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_15" id="_anim_16" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_15" id="_anim_17" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_16" id="_anim_18" attributeName="visibility" begin="Theme_Button_1.focusin" values="visible;visible"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_16" id="_anim_19" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_16" id="_anim_20" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_17" id="_anim_21" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_17" id="_anim_22" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_17" id="_anim_23" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_18" id="_anim_24" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_18" id="_anim_25" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_18" id="_anim_26" attributeName="visibility" begin="Theme_Button_1.activate" values="visible;visible"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_30" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_31" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_32" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_33" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_34" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_35" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze” />
<animate xlink:href="#img_31_1_22" id="_anim_36" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_37" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_38" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_42" attributeName="visibility" begin="Theme_Button_1.focusin" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_43" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_44" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_45" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_46" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_47" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_48" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_49" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_50" attributeName="visibility" begin="Theme_Button_1.activate" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
</svg>
Wkwkw.. sesu anu banget kan,,, satu tombol bisa menghasil kan baris kode sebanyak itu, bayangkan apabila kita membuat 6 atau 12 tombol pada composer…(dalam pikiran kalian pasti bilang WOOGH!!) Okay selanjutnya, tetap tegakkan kepala kalian…hehe (boleh siapin panadol) :
Code:
<g id="tabImage">
* kode awal tab image ketika normal state (biasanya full transparent)
Code:
<g id="tabFocusImage">
* kode awal tab image ketika focus state (background biru)
Code:
<g id="normalImage">
* kode awal icon image ketika normal state
Code:
<g id="focusImage">
* kode awal image ketika focus state
Pada tutorial ini saya hanya ingin menampilkan tombol icon saja, dan tidak membutuhkan tab image, jadi saya akan meghilangkan, memangkas, memotong, menghapus, mendelete dan men men lainnya….so perhatikan perubahan kode dibawah ini
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by BlackBerry Composer Version: 6.0.0.21 - Apr 18 2011 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2000/svg http://www.plazmic.com/svg/schema/svg.xsd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xforms="http://www.w3.org/2002/xforms"
xmlns:pz="http://www.plazmic.com/plazmic_extents"
id="Untitled_10" xml:space="default" width="480" height="360" viewBox="-240 -180 480 360" preserveAspectRatio="xMidYMid meet">
<g id="Layer_1">
<!-- pz:tag type="layer" -->
<g id="Theme_Button_1"
transform="translate(-204 23)">
<!-- pz:tag type="button" -->
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="normalImage">
<image id="img_1_1_19" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png"/>
<image id="img_11_1_20" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_21" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_22" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
</g>
<g id="focusImage">
<image id="img_1_1_23" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_11_1_24" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_25" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_26" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
</g>
</g>
</g>
</g>
<!-- pz:tag output="anim" -->
<loadScene xlink:href="x-exec://net_rim_bb_messaging_app.Messages" begin="Theme_Button_1.activate"/>
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_30" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_31" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_32" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_33" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_34" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_35" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze” />
<animate xlink:href="#img_31_1_22" id="_anim_36" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_37" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_38" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_42" attributeName="visibility" begin="Theme_Button_1.focusin" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_43" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_44" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_45" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_46" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_47" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_48" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_49" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_50" attributeName="visibility" begin="Theme_Button_1.activate" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
</svg>
Wkwk… lumenyan kan sekarang agag lebih ramping kodenya…. Sekarang mari kita shrink lagi kodenya karena masih ada beberapa baris yang menurut saya tidak perlu dan mubazir….sekali lagi perhatikan perubahan kode dibawah ini..lihat baris yang di cetak tebal…
Quote:<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by BlackBerry Composer Version: 6.0.0.21 - Apr 18 2011 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2000/svg http://www.plazmic.com/svg/schema/svg.xsd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xforms="http://www.w3.org/2002/xforms"
xmlnsz="http://www.plazmic.com/plazmic_extents"
id="Untitled_10" xml:space="default" width="480" height="360" viewBox="-240 -180 480 360" preserveAspectRatio="xMidYMid meet">
<g id="Layer_1">
<!-- pz:tag type="layer" -->
<g id="Theme_Button_1"
transform="translate(-204 23)">
<!-- pz:tag type="button" -->
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="normalImage">
<image id="img_1_1_19" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png"/>
<image id="img_11_1_20" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_21" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_22" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png" visibility="hidden"/>
</g>
<g id="focusImage">
<image id="img_1_1_23" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_11_1_24" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_21_1_25" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
<image id="img_31_1_26" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
</g>
</g>
</g>
</g>
<!-- pz:tag output="anim" -->
<loadScene xlink:href="x-exec://net_rim_bb_messaging_app.Messages" begin="Theme_Button_1.activate"/>
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_30" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_31" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_20" id="_anim_32" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_33" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_34" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_21" id="_anim_35" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze” />
<animate xlink:href="#img_31_1_22" id="_anim_36" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_37" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_22" id="_anim_38" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_42" attributeName="visibility" begin="Theme_Button_1.focusin" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_43" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_11_1_24" id="_anim_44" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_45" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_46" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_21_1_25" id="_anim_47" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_48" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_49" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_31_1_26" id="_anim_50" attributeName="visibility" begin="Theme_Button_1.activate" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
</svg>
Mari kita delete yang dicetak tebal tersebut….
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by BlackBerry Composer Version: 6.0.0.21 - Apr 18 2011 -->
<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2000/svg http://www.plazmic.com/svg/schema/svg.xsd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xforms="http://www.w3.org/2002/xforms"
xmlns:pz="http://www.plazmic.com/plazmic_extents"
id="Untitled_10" xml:space="default" width="480" height="360" viewBox="-240 -180 480 360" preserveAspectRatio="xMidYMid meet">
<g id="Layer_1">
<!-- pz:tag type="layer" -->
<g id="Theme_Button_1"
transform="translate(-204 23)">
<!-- pz:tag type="button" -->
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="normalImage">
<image id="img_1_1_19" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png"/>
</g>
<g id="focusImage">
<image id="img_1_1_23" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
</g>
</g>
</g>
</g>
<!-- pz:tag output="anim" -->
<loadScene xlink:href="x-exec://net_rim_bb_messaging_app.Messages" begin="Theme_Button_1.activate"/>
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
</svg>
Wow….wow….wow…. amazing…..sekarang kode nya mulai terlihat sangat sexy…. (tidak buncit lagi )…..tapi tunggu dulu jangan girang dulu, belum selesai masih ada lagi, kode diatas belum selesai, kenapa…???? Karena jika kalian import SVG nya pada TB (Themes Builder) saya jamin tombolnya tidak sido muncul…., kok bisa sih..??? hehe… karena jika kalian perhatikan pada baris animate nilai valuesnya masih hidden;hidden, nah kita harus perbaiki baris tersebut….so mari nengok ke bawah lagi yuk..
Code:
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
Img_1_1_19 adalah id referensi untuk normal button state icon dan Img_1_1_19 untuk focus button state icon, dari kode di atas nilai values nya masih hidden, oleh karena itu kita harus menyesuaikan nilai valuesnya supaya sesuai sebagaimana mestinya… lets cekidot perubahannya…
Code:
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden"
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values=" visible;visible "
keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values=" visible;visible " keyTimes="0;1" dur="0.45s" fill="freeze" />
Nah wis rampung sekarang 
, untuk kode keseluruhannya lihat baris berikut.
Code:
<?xml version="1.0" encoding="UTF-8"?>
<!-- Generated by BlackBerry Composer Version: 6.0.0.21 - Apr 18 2011 -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2000/svg http://www.plazmic.com/svg/schema/svg.xsd"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xforms="http://www.w3.org/2002/xforms"
xmlns:pz="http://www.plazmic.com/plazmic_extents" id="Untitled_10" xml:space="default" width="480" height="360" viewBox="-240 -180 480 360" preserveAspectRatio="xMidYMid meet">
<g id="Layer_1">
<!-- pz:tag type="layer" -->
<g id="Theme_Button_1" transform="translate(-204 23)">
<!-- pz:tag type="button" -->
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="normalImage">
<image id="img_1_1_19" x="0" y="0" width="68" height="68" xlink:href="Images/normalImage_img_1_1.png"/>
</g>
<g id="focusImage">
<image id="img_1_1_23" x="0" y="0" width="68" height="68" xlink:href="Images/focusImage_img_1_1.png" visibility="hidden"/>
</g>
</g>
</g>
</g>
<!-- pz:tag output="anim" -->
<loadScene xlink:href="x-exec://net_rim_bb_messaging_app.Messages" begin="Theme_Button_1.activate"/>
<animate xlink:href="#img_1_1_19" id="_anim_27" attributeName="visibility" begin="Theme_Button_1.focusin" values="hidden;hidden” keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_28" attributeName="visibility" begin="Theme_Button_1.focusout" values="visible;visible" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_19" id="_anim_29" attributeName="visibility" begin="Theme_Button_1.activate” values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_39" attributeName="visibility" begin="Theme_Button_1.focusin" values=" visible;visible " keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_40" attributeName="visibility" begin="Theme_Button_1.focusout" values="hidden;hidden" keyTimes="0;1" dur="0.45s" fill="freeze" />
<animate xlink:href="#img_1_1_23" id="_anim_41" attributeName="visibility" begin="Theme_Button_1.activate" values=" visible;visible " keyTimes="0;1" dur="0.45s" fill="freeze" />
</svg>
Eeeng iiiiing eeeeng….. sekian sodara sodara BZoners dan BZT dondoters kode nya sudah ramping sexy dan siap diproduksi…#eh dimasupin ke TB…haha sekian dulu Tips dan Tricks or Tutorial gendeng dari kami….Mmwuach….
Read More »
ORIGINAL BY Jizzomaru
SVG Code atau SVG Document merupakan file konfigurasi yang ditulis dalam bahasa XML, dan biasanya ciri khas dari document ini adalah mempunyai extension (.svg). SVG merupakan singkatan dari Scalable Vector Graphic yang artinya dalam bahasa kita adalah tampilan antar muka dengan basis vector yang dapat disesuaikan, dibentuk atau diukur maupun diapain aja juga bisa terserah imajinasi anda.
Dokumentasi SVG Code for BlackBerry
Download This Document
Hidden command :Wallpaper:
Code:
x-object:/Image?src=wallpaper
Date:
Code:
x-object:/CurrentDateTime?clocktype=date
Time:
Code:
x-object:/CurrentDateTime?clocktype=time
Battery:
Code:
xlink:href="x-object:/BatteryLevel"
Coverage:
Code:
xlink:href="x-object:/Coverage"
Roaming Icon:
Code:
xlink:href="x-object:/Roaming"
GPS Mode Icon:
Alarm Icon:
Code:
x-object:/AlarmIndicator
System Status:
Code:
x-object:/SystemStatus
Indicators:
Code:
xlink:href="x-object:/GridIndicators
Wifi Signal:
Code:
x-object:/WLANSignalLevel
Owner Name:
Code:
x-object:/OwnerInfo?id=name
Owner's Info:
Code:
x-object:/OwnerInfo?id=info
'PERHATIAN !!!'
Sebagian dari code ini ada yang masih berfungsi ada yang tidak tergantung juga tipe device BlackBerry nya
Contoh SVG Code untuk menampilkan Owner Info Text di HomeScreen :
Kode ini berguna bila kita ingin membuat themes yang mengIncludekan ID / nama sang pemilik device di HomeScreen #:-s ...Selamat Belajar yahShrink your SVG Button Code (BlackBerry Themes Builder & Composer)
'PERHATIAN'
Quote Posting TS akan saya hadiahkan bata merah..
Peace
Read More »
