Sugar.graphics.style: Difference between revisions

From OLPC
Jump to navigation Jump to search
(New page: {{Sugar Almanac}} === What colors are in the sugar system color palette? == To keep your activity with the same look and feel of the sugar os, you might want to consider using the system...)
 
No edit summary
 
(3 intermediate revisions by the same user not shown)
Line 2: Line 2:




=== What colors are in the sugar system color palette? ==
=== What colors are in the sugar system color palette? ===
To keep your activity with the same look and feel of the sugar os, you might want to consider using the system color palette in your activity. Here are some of the colors available to you to ensure a consistent look and feel.
To keep your activity with the same look and feel of the sugar os, you might want to consider using the system color palette in your activity. Here are some of the colors available to you to ensure a consistent look and feel.
*COLOR_PANEL_GREY
*COLOR_PANEL_GREY
Line 11: Line 11:
*COLOR_INACTIVE_STROKE
*COLOR_INACTIVE_STROKE
*COLOR_TEXT_FIELD_GREY
*COLOR_TEXT_FIELD_GREY



=== How do I use the system colors in my activity? ===
=== How do I use the system colors in my activity? ===
Line 16: Line 17:


<pre>
<pre>
gdkWhite = sugar.graphics.style.COLOR_WHITE.get_gdk_color()
intWhite = sugar.graphics.style.COLOR_WHITE.get_int()
</pre>




=== Is there a transparent color? ===
Yes there is. You want to use sugar.graphics.style.COLOR_TRANSPARENT



=== Can I use the sugar color object for my own colors since it offers so many useful conversion functions? ===
Indeed, you can construct your own color objects with all of the same conversion utilities. Pass into the constructor a hexadecimal string. An optional second parameter lets you specify an alpha value.

<pre>
red = sugar.graphics.style.Color('#FF0000')
</pre>
</pre>



=== For example, how would I change the background color of my activity? ===

=== How do I change the background color of my activity? ===
Here is how you would change the color of your activity's background using the sugar system colors:
Here is how you would change the color of your activity's background using the sugar system colors:
<pre>
<pre>

Latest revision as of 18:43, 2 October 2008

  Sugar Almanac


What colors are in the sugar system color palette?

To keep your activity with the same look and feel of the sugar os, you might want to consider using the system color palette in your activity. Here are some of the colors available to you to ensure a consistent look and feel.

  • COLOR_PANEL_GREY
  • COLOR_SELECTION_GREY
  • COLOR_TOOLBAR_GREY
  • COLOR_BUTTON_GREY
  • COLOR_INACTIVE_FILL
  • COLOR_INACTIVE_STROKE
  • COLOR_TEXT_FIELD_GREY


How do I use the system colors in my activity?

The sugar color class has a number of conversion utilities returning these colors as different objects (e.g. gdk.Color, a hexadecimal string suitable for html, or an int value).

gdkWhite = sugar.graphics.style.COLOR_WHITE.get_gdk_color()
intWhite = sugar.graphics.style.COLOR_WHITE.get_int()


Is there a transparent color?

Yes there is. You want to use sugar.graphics.style.COLOR_TRANSPARENT


Can I use the sugar color object for my own colors since it offers so many useful conversion functions?

Indeed, you can construct your own color objects with all of the same conversion utilities. Pass into the constructor a hexadecimal string. An optional second parameter lets you specify an alpha value.

red = sugar.graphics.style.Color('#FF0000')


How do I change the background color of my activity?

Here is how you would change the color of your activity's background using the sugar system colors:

import sugar.graphics.style
...
#use an eventbox to set the background color, not a vbox (vbox doesnt have a gtk.gdk.window to draw background on)
self.bg = gtk.EventBox()
self.set_canvas( self.bg )
self.bg.modify_bg( gtk.STATE_NORMAL, sugar.graphics.style.COLOR_WHITE.get_gdk_color() )
#don't forget to show_all or you won't see your color changes! (or anything)
self.bg.show_all( )