nathan_christopher
24th Aug '07 Fri, 12:48
Hmmm. sa mga web developers at mga theme artists medyo importante ito. pero ,para sa lahat at mga nagnanais na maging theme artists (using carbide 3.1), tingin na din kayo dito.
Ano nga ba ang SVG o Scalable Vector Graphics? Ito ay dinevelop ng W3 Consortium para sa internet. Ang usual na alam kasi natin sa "graphics" ay isang file na composed ng mga pixels - na mas malaki ang resolution, siyempre, mas malaki ang file size.
Pero, nakakita na ba kayo ng isang "image" na hindi naman composed ng pixels? TAMA, SVG ang tawag doon. Ang "image" na nakikita natin sa ating mga browsers (Iexplorer, firefox, etc - na may built-in interpreter ng SVG) ay described ng ilang lines of instruction. Halimbawa, copy and paste nyo ito sa inyong notepad:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<rect width="300" height="100"
style="fill:rgb(0,0,255);stroke-width:1;
stroke:rgb(0,0,0)"/>
</svg>
Tapos, save nyo ang file as "sample.svg" (without the quotation marks) kahit saan sa computer nyo (halimbawa sa desktop).
Punta kayo sa desktop at hanapin nyo yung file. Usually, ang icon nya ngayon ay represented ng IExplorer icon. double click nyo ito para mabuksan sa Iexplorer. Ano makikita nyo?
Galeng ano?
heto pa isa:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<rect x="20" y="20" width="250" height="250"
style="fill:blue;stroke:pink;stroke-width:5;opacity:0.9"/>
</svg>
Copy and paste ulit sa notepad at bigyan ng filename na sample2.svg. Open nyo ulit ito sa IExplorer o sa Firefox.
Ano makikita nyo? Ang galeng galeng ano?
Pero, hindi natin kailangang maging expert sa XML coding (yun ang tawag sa piece of code na nasa itaas). Bagkus, may mga softwares na available para makapag create ng sarili nating
SVG files, o mag-edit ng mga existing SVG files. Sample ng mga programs ay Illustrator ng Adobe at Freehand naman sa Macromedia.
Sa Carbide 3.1, halos lahat ng mga components ng isang theme doon sa SVG files. Hindi kagaya sa Carbide 1.2, na halos lahat naman ay bitmap files ang components. May advantages at disadvantages naman yung dalawang versions ng carbide, pero ibang topic na yun.
Ang ibig ko lang sabihin, mas magiging madali para sa upcoming themers na gumamit ng SVG dahil nga wala nang kailangang gawing mask..
Eniwey, postulit ako ng iba pang mga tutorials tungkols sa SVG later on. Kayo, kung may gusto kayong i-share, post na rin dito..
-duds-
Ano nga ba ang SVG o Scalable Vector Graphics? Ito ay dinevelop ng W3 Consortium para sa internet. Ang usual na alam kasi natin sa "graphics" ay isang file na composed ng mga pixels - na mas malaki ang resolution, siyempre, mas malaki ang file size.
Pero, nakakita na ba kayo ng isang "image" na hindi naman composed ng pixels? TAMA, SVG ang tawag doon. Ang "image" na nakikita natin sa ating mga browsers (Iexplorer, firefox, etc - na may built-in interpreter ng SVG) ay described ng ilang lines of instruction. Halimbawa, copy and paste nyo ito sa inyong notepad:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<rect width="300" height="100"
style="fill:rgb(0,0,255);stroke-width:1;
stroke:rgb(0,0,0)"/>
</svg>
Tapos, save nyo ang file as "sample.svg" (without the quotation marks) kahit saan sa computer nyo (halimbawa sa desktop).
Punta kayo sa desktop at hanapin nyo yung file. Usually, ang icon nya ngayon ay represented ng IExplorer icon. double click nyo ito para mabuksan sa Iexplorer. Ano makikita nyo?
Galeng ano?
heto pa isa:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<rect x="20" y="20" width="250" height="250"
style="fill:blue;stroke:pink;stroke-width:5;opacity:0.9"/>
</svg>
Copy and paste ulit sa notepad at bigyan ng filename na sample2.svg. Open nyo ulit ito sa IExplorer o sa Firefox.
Ano makikita nyo? Ang galeng galeng ano?
Pero, hindi natin kailangang maging expert sa XML coding (yun ang tawag sa piece of code na nasa itaas). Bagkus, may mga softwares na available para makapag create ng sarili nating
SVG files, o mag-edit ng mga existing SVG files. Sample ng mga programs ay Illustrator ng Adobe at Freehand naman sa Macromedia.
Sa Carbide 3.1, halos lahat ng mga components ng isang theme doon sa SVG files. Hindi kagaya sa Carbide 1.2, na halos lahat naman ay bitmap files ang components. May advantages at disadvantages naman yung dalawang versions ng carbide, pero ibang topic na yun.
Ang ibig ko lang sabihin, mas magiging madali para sa upcoming themers na gumamit ng SVG dahil nga wala nang kailangang gawing mask..
Eniwey, postulit ako ng iba pang mga tutorials tungkols sa SVG later on. Kayo, kung may gusto kayong i-share, post na rin dito..
-duds-