enlightenment/www
enlightenment
/
www
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

docs on gradient stuff.... 

SVN revision: 4657
This commit is contained in:
Carsten Haitzler 2001-04-18 21:31:32 +00:00
parent 069b5b028c
commit 70346d3c91
9 changed files with 262 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
e/data/evas.html
View File

@ -212,6 +212,44 @@ with something other than a solid color, but do not want to go to the
expense of needing an image for it. They can be used to hilight areas with
lighting and shadow effects and many other things.
@:para@
Creating and managing these objects, like almost everything else, is also
childs play. take a look at this:
@:para@
<pre>
object = evas_add_gradient_box(evas);
evas_move(evas, object, 150.0, 100.0);
evas_resize(evas, object, 200.0, 120.0);
gradient = evas_gradient_new();
evas_gradient_add_color(gradient, 255, 255, 255, 255, 10);
evas_gradient_add_color(gradient, 255, 255, 0, 255, 10);
evas_gradient_add_color(gradient, 255, 0, 0, 255, 10);
evas_gradient_add_color(gradient, 0, 0, 128, 255, 10);
evas_gradient_add_color(gradient, 0, 0, 128, 0, 10);
evas_set_gradient(evas, object, gradient);
evas_gradient_free(gradient);
evas_set_angle(evas, object, 290.0);
evas_show(evas, object);
</pre>
@:para@
The program we are developing looks now something like this:
@:para@
<a href=evas_grad_eg_0.html><img src=img/evas_grad_eg_0_thumb.png width=80 height=80 border=1></a>
@:para@
As you see, you create the gradient box object, place it somewhere in your
Evas, set its size, and now you get to define the list of colors it is to
use (from start of the gradient to end) and their relative "distance" apart.
This is relative to the length of the gradient, not an absolute, so the
total length is the sum of all the distances (except the first element in
the gradient whose distance is ignored). We add in white, yellow, red, dark
blue then "transparent" in the gradient in order, then set this gradient to
be used by this gradient box. once we are done setting up this gradient we
can set it to be used by more than one gradient box, and when done with it
finally, we can just free it. All we do now is determine the angle the
gradient is at in the box (with 0 degrees being the first element of the
gradient at 12:00 o'clock, going all the way up to 360 degrees clock-wise),
and then we show the object. All we need to do now is move and resize it,
show it, change the angle etc. and Evas handles it for us.
@:para@
@tile_area_end@
@:para@
This is not where it ends. there are other primitives that Evas supports.

6
e/data/evas_grad_eg_0.html Normal file
View File

@ -0,0 +1,6 @@
@top@
@start@
@:para@
<a href=evas.html><img src=img/evas_grad_eg_0.png width=400 height=400 border=1></a>
@end@
@bottom@

4
e/data/main.html
View File

@ -7,5 +7,9 @@ For information on aspects of Enlightenment choose an option on the list to
the left. This website is in the process of being redesigned. Please have
some patience and let the <a href=team.html>Web Team</a> have some time to
get on with it.
@:para@
<b>Quick Links:</b>
@:para@
<a href=evas.html>Evas</a>
@end@
@bottom@

38
e/pages/evas.html
View File

@ -369,6 +369,44 @@ with something other than a solid color, but do not want to go to the
expense of needing an image for it. They can be used to hilight areas with
lighting and shadow effects and many other things.
<font face=arial,helvetica,lucida size=2><p>
Creating and managing these objects, like almost everything else, is also
childs play. take a look at this:
<font face=arial,helvetica,lucida size=2><p>
<pre>
object = evas_add_gradient_box(evas);
evas_move(evas, object, 150.0, 100.0);
evas_resize(evas, object, 200.0, 120.0);
gradient = evas_gradient_new();
evas_gradient_add_color(gradient, 255, 255, 255, 255, 10);
evas_gradient_add_color(gradient, 255, 255, 0, 255, 10);
evas_gradient_add_color(gradient, 255, 0, 0, 255, 10);
evas_gradient_add_color(gradient, 0, 0, 128, 255, 10);
evas_gradient_add_color(gradient, 0, 0, 128, 0, 10);
evas_set_gradient(evas, object, gradient);
evas_gradient_free(gradient);
evas_set_angle(evas, object, 290.0);
evas_show(evas, object);
</pre>
<font face=arial,helvetica,lucida size=2><p>
The program we are developing looks now something like this:
<font face=arial,helvetica,lucida size=2><p>
<a href=evas_grad_eg_0.html><img src=img/evas_grad_eg_0_thumb.png width=80 height=80 border=1></a>
<font face=arial,helvetica,lucida size=2><p>
As you see, you create the gradient box object, place it somewhere in your
Evas, set its size, and now you get to define the list of colors it is to
use (from start of the gradient to end) and their relative "distance" apart.
This is relative to the length of the gradient, not an absolute, so the
total length is the sum of all the distances (except the first element in
the gradient whose distance is ignored). We add in white, yellow, red, dark
blue then "transparent" in the gradient in order, then set this gradient to
be used by this gradient box. once we are done setting up this gradient we
can set it to be used by more than one gradient box, and when done with it
finally, we can just free it. All we do now is determine the angle the
gradient is at in the box (with 0 degrees being the first element of the
gradient at 12:00 o'clock, going all the way up to 360 degrees clock-wise),
and then we show the object. All we need to do now is move and resize it,
show it, change the angle etc. and Evas handles it for us.
<font face=arial,helvetica,lucida size=2><p>
</td></tr></table></td>
</tr><tr>
<td background=img/col_black.png><img src=img/blank.gif width=1 height=1></td>

86
e/pages/evas_grad_eg_0.html Normal file
View File

@ -0,0 +1,86 @@
<html><head><title>W W W . E N L I G H T E N M E N T . O R G</title></head>
<body bgcolor=#cccccc
text=#000000
link=#445566
vlink=#99aabb
alink=#ff0000
topmargin=20
leftmargin=20
marginwidth=20
marginheight=20>
<center>
<table border=0 cellpadding=0 cellspacing=0>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><table border=0 cellpadding=8 cellspacing=0><tr><td><img src=img/logo_tl.png width=80 height=100></td></tr></table></td>
<td width=1 height=1 background=img/col_pane.png><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><table border=0 cellpadding=8 cellspacing=0><tr>
<td><a href=main.html><img src=img/title.png width=480 height=100 border=0 alt=Enlightnement></a></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png valign=top><table border=0 cellpadding=8 cellspacing=0><tr>
<td><a href=main.html><img src=img/nav_main.png width=80 height=15 border=0></a><br><br>
<a href=news.html><img src=img/nav_news.png width=80 height=15 border=0></a><br><br>
<a href=download.html><img src=img/nav_download.png width=80 height=15 border=0></a><br><br>
<a href=shots.html><img src=img/nav_shots.png width=80 height=15 border=0></a><br><br>
<a href=team.html><img src=img/nav_team.png width=80 height=15 border=0></a><br><br>
<a href=info.html><img src=img/nav_info.png width=80 height=15 border=0></a><br><br>
<a href=source.html><img src=img/nav_source.png width=80 height=15 border=0></a><br><br>
<a href=mail.html><img src=img/nav_mail.png width=80 height=15 border=0></a><br><br>
<a href=goodies.html><img src=img/nav_goodies.png width=80 height=15 border=0></a></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=480 height=1 background=img/col_content.png valign=top align=left>
<table border=0 cellpadding=0 cellspacing=0><tr>
<td><img src=img/shadow_tl.png width=20 height=20></td>
<td background=img/shadow_t.png><img src=img/blank.gif width=480 height=20></td>
<td><img src=img/shadow_t.png width=20 height=20></td>
</tr><tr>
<td background=img/shadow_l.png><img src=img/blank.gif width=20 height=300></td>
<td valign=top align=left>
<font face=arial,helvetica,lucida size=2><p>
<a href=evas.html><img src=img/evas_grad_eg_0.png width=400 height=400 border=1></a>
</td>
<td><img src=img/blank.gif width=20 height=20></td>
</tr><tr>
<td><img src=img/shadow_l.png width=20 height=20></td>
<td><img src=img/blank.gif width=480 height=20></td>
<td><img src=img/blank.gif width=20 height=20></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
</table>
</center>
</body></html>

86
e/pages/evas_text_eg_0.html Normal file
View File

@ -0,0 +1,86 @@
<html><head><title>W W W . E N L I G H T E N M E N T . O R G</title></head>
<body bgcolor=#cccccc
text=#000000
link=#445566
vlink=#99aabb
alink=#ff0000
topmargin=20
leftmargin=20
marginwidth=20
marginheight=20>
<center>
<table border=0 cellpadding=0 cellspacing=0>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><table border=0 cellpadding=8 cellspacing=0><tr><td><img src=img/logo_tl.png width=80 height=100></td></tr></table></td>
<td width=1 height=1 background=img/col_pane.png><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><table border=0 cellpadding=8 cellspacing=0><tr>
<td><a href=main.html><img src=img/title.png width=480 height=100 border=0 alt=Enlightnement></a></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 background=img/col_pane.png valign=top><table border=0 cellpadding=8 cellspacing=0><tr>
<td><a href=main.html><img src=img/nav_main.png width=80 height=15 border=0></a><br><br>
<a href=news.html><img src=img/nav_news.png width=80 height=15 border=0></a><br><br>
<a href=download.html><img src=img/nav_download.png width=80 height=15 border=0></a><br><br>
<a href=shots.html><img src=img/nav_shots.png width=80 height=15 border=0></a><br><br>
<a href=team.html><img src=img/nav_team.png width=80 height=15 border=0></a><br><br>
<a href=info.html><img src=img/nav_info.png width=80 height=15 border=0></a><br><br>
<a href=source.html><img src=img/nav_source.png width=80 height=15 border=0></a><br><br>
<a href=mail.html><img src=img/nav_mail.png width=80 height=15 border=0></a><br><br>
<a href=goodies.html><img src=img/nav_goodies.png width=80 height=15 border=0></a></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=480 height=1 background=img/col_content.png valign=top align=left>
<table border=0 cellpadding=0 cellspacing=0><tr>
<td><img src=img/shadow_tl.png width=20 height=20></td>
<td background=img/shadow_t.png><img src=img/blank.gif width=480 height=20></td>
<td><img src=img/shadow_t.png width=20 height=20></td>
</tr><tr>
<td background=img/shadow_l.png><img src=img/blank.gif width=20 height=300></td>
<td valign=top align=left>
<font face=arial,helvetica,lucida size=2><p>
<a href=evas.html><img src=img/evas_text_eg_0.png width=400 height=400 border=1></a>
</td>
<td><img src=img/blank.gif width=20 height=20></td>
</tr><tr>
<td><img src=img/shadow_l.png width=20 height=20></td>
<td><img src=img/blank.gif width=480 height=20></td>
<td><img src=img/blank.gif width=20 height=20></td>
</tr></table>
</td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
<tr>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
<td width=1 height=1 bgcolor=#000000><img src=img/blank.gif width=1 height=1></td>
</tr>
</table>
</center>
</body></html>

BIN
e/pages/img/evas_grad_eg_0.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 20 KiB

BIN
e/pages/img/evas_grad_eg_0_thumb.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

4
e/pages/main.html
View File

@ -67,6 +67,10 @@ For information on aspects of Enlightenment choose an option on the list to
the left. This website is in the process of being redesigned. Please have
some patience and let the <a href=team.html>Web Team</a> have some time to
get on with it.
<font face=arial,helvetica,lucida size=2><p>
<b>Quick Links:</b>
<font face=arial,helvetica,lucida size=2><p>
<a href=evas.html>Evas</a>
</td>
<td><img src=img/blank.gif width=20 height=20></td>
</tr><tr>