Activity tutorial: Difference between revisions

From OLPC
Jump to navigation Jump to search
mNo edit summary
m (cosmetics)
Line 9: Line 9:
mkdir HelloWorldActivity.activity/activity
mkdir HelloWorldActivity.activity/activity


*Write the activity.info file, to describe your bundle in the activity sub-directory (e.g. HelloWorldActivity.activity/activity/activity.info). The [[Activity Bundles]] specification explain in detail the meaning of each field.
*Write the <tt>activity.info</tt> file, to describe your bundle in the activity sub-directory (e.g. <tt>HelloWorldActivity.activity/activity/activity.info</tt>). The [[Activity Bundles]] specification explain in detail the meaning of each field.


[Activity]
[Activity]
Line 19: Line 19:
show_launcher = yes
show_launcher = yes


*Design an icon for your activity, according to the [[Sugar_Icon_Format|icon format]] and place it in the activity sub-directory. The file name should match the icon file name specified in the info file (e.g. activity-helloworld.svg).
*Design an icon for your activity, according to the [[Sugar_Icon_Format|icon format]] and place it in the activity sub-directory. The file name should match the icon file name specified in the info file (e.g. <tt>activity-helloworld.svg</tt>).


<?xml version="1.0" encoding="UTF-8"?>
<?xml version="1.0" encoding="UTF-8"?>
Line 32: Line 32:
</svg>
</svg>


*Write the setup.py script in the top level directory (e.g. HelloWorldActivity.activity/setup.py), which in most cases will look like this:
*Write the <tt>setup.py</tt> script in the top level directory (e.g. <tt>HelloWorldActivity.activity/setup.py</tt>), which in most cases will look like this:


#!/usr/bin/env python
#!/usr/bin/env python
from sugar.activity import bundlebuilder
from sugar.activity import bundlebuilder
if __name__ == "__main__":
if __name__ == "__main__":
bundlebuilder.start("MyActivityName")
bundlebuilder.start("''MyActivityName''")

*Code your activity. The name you specified in the .info file as "class" is the name of the class which runs your code. For the activity.info file above, we specify a top-level module named HelloWorldActivity.HelloWorldActivity (please note that the use of uppercase names in module names is considered poor Python style, feel free to use an activity name with more standard style names).


*Code your activity. The name you specified in the <tt>.info</tt> file as "<tt>class</tt>" is the name of the class which runs your code. For the <tt>activity.info</tt> file above, we specify a top-level module named <tt>HelloWorldActivity.HelloWorldActivity</tt> (please note that the use of uppercase names in module names is considered poor [[Python Style Guide|Python style]], feel free to use an activity name with more standard style names).
{{ Box File | HelloWorld.py | 2=<pre>
from sugar.activity import activity
from sugar.activity import activity
import logging
import logging
Line 81: Line 81:
print "AT END OF THE CLASS"
print "AT END OF THE CLASS"
</pre>
}}


The above file is called <tt>HelloWorldActivity.py</tt>


*Create a <tt>MANIFEST</tt> (e.g. <tt>HelloWorldActivity.activity/MANIFEST</tt>), containing the list of the files to include in the package. (Note: Be sure '''not''' to leave blank lines at the end of the file.)
The anterior file is called HelloWorldActivity.py

*Create a MANIFEST (e.g. HelloWorldActivity.activity/MANIFEST), containing the list of the files to include in the package. (Note: Be sure '''not''' to leave blank lines at the end of the file.)


Your directory structure should now look like this:
Your directory structure should now look like this:
Line 100: Line 101:
./setup.py dev
./setup.py dev


(It appears this just creates a symlink in ~/Activities .)
(It appears this just creates a symlink in <tt>~/Activities</tt> .)


== Running ==
== Running ==
If you now run sugar the activity icon should be visible on the frame. (You have to restart sugar to get it to pick up the change if you just installed it. Hit ctrl-alt-erase.)
If you now run sugar the activity icon should be visible on the frame. (You have to restart sugar to get it to pick up the change if you just installed it. Hit <tt>ctrl-alt-erase</tt>.)


You can also edit the code in your bundle directory directly. Note that the first time your Activity is launched, it leaves a process around even if you close the window, so you must kill the sugar-activity-factory to get it to reload when you click again.
You can also edit the code in your bundle directory directly. Note that the first time your Activity is launched, it leaves a process around even if you close the window, so you must kill the <tt>sugar-activity-factory</tt> to get it to reload when you click again.


== Distribution ==
== Distribution ==
Create a xo package to distribute your bundle. (An xo file is essentially a zip file built from the MANIFEST with some extra metadata, like a JAR file. It also has some localization ability, and in the future we expect to be able to sign these too.) The bundle name is automatically generated from the 'name' and 'activity_version' values found in the activity.info file, separated by a dash, with a .xo extension.
Create a <tt>.xo</tt> package to distribute your bundle. (An <tt>.xo</tt> file is essentially a zip file built from the MANIFEST with some extra metadata, like a JAR file. It also has some localization ability, and in the future we expect to be able to sign these too.) The bundle name is automatically generated from the '<tt>name</tt>' and '<tt>activity_version</tt>' values found in the <tt>activity.info</tt> file, separated by a dash, with a <tt>.xo</tt> extension.


./setup.py dist
./setup.py dist

Revision as of 06:39, 22 September 2007

  english | 日本語 | 한국어 | português | español HowTo [ID# 65955]  +/-  

The tutorial explains step by step how to create the Hello World activity bundle.

It assumes you have already installed a Sugar development environment.

  • Create the bundle directory structure:
mkdir HelloWorldActivity.activity
mkdir HelloWorldActivity.activity/activity
  • Write the activity.info file, to describe your bundle in the activity sub-directory (e.g. HelloWorldActivity.activity/activity/activity.info). The Activity Bundles specification explain in detail the meaning of each field.
[Activity]
name = HelloWorld
service_name = org.laptop.HelloWorldActivity
class = HelloWorldActivity.HelloWorldActivity
icon = activity-helloworld
activity_version = 1
show_launcher = yes
  • Design an icon for your activity, according to the icon format and place it in the activity sub-directory. The file name should match the icon file name specified in the info file (e.g. activity-helloworld.svg).
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
  <!ENTITY fill_color "#FFFFFF">
  <!ENTITY stroke_color "#000000">
]>
<svg xmlns="http://www.w3.org/2000/svg" width="50" height="50">
  <rect x="1" y="1" width="48" height="48"
  style="fill:&fill_color;;stroke:&stroke_color;;stroke-width:2"/>
</svg>
  • Write the setup.py script in the top level directory (e.g. HelloWorldActivity.activity/setup.py), which in most cases will look like this:
#!/usr/bin/env python
from sugar.activity import bundlebuilder
if __name__ == "__main__":
    bundlebuilder.start("MyActivityName")
  • Code your activity. The name you specified in the .info file as "class" is the name of the class which runs your code. For the activity.info file above, we specify a top-level module named HelloWorldActivity.HelloWorldActivity (please note that the use of uppercase names in module names is considered poor Python style, feel free to use an activity name with more standard style names).
 File: HelloWorld.py
 from sugar.activity import activity
 import logging
 
 import sys, os
 import gtk
 
 class HelloWorldActivity(activity.Activity):
     def hello(self, widget, data=None):
         logging.info('Hello World')
 
     def __init__(self, handle):
         print "running activity init", handle
         activity.Activity.__init__(self, handle)
         print "activity running"
 
         self.set_title('Hello World')
 
         # Creates the Toolbox. It contains the Activity Toolbar, which is the
         # bar that appears on every Sugar window and contains essential
         # functionalities, such as the 'Collaborate' and 'Close' buttons.
         toolbox = activity.ActivityToolbox(self)
         self.set_toolbox(toolbox)
         toolbox.show()
 
         # Creates a new button with the label "Hello World".
         self.button = gtk.Button("Hello World")
     
         # When the button receives the "clicked" signal, it will call the
         # function hello() passing it None as its argument.  The hello()
         # function is defined above.
         self.button.connect("clicked", self.hello, None)
     
         # Set the button to be our canvas. The canvas is the main section of
         # every Sugar Window. It fills all the area below the toolbox.
         self.set_canvas(self.button)
     
         # The final step is to display this newly created widget.
         self.button.show()
     
         print "AT END OF THE CLASS"

The above file is called HelloWorldActivity.py

  • Create a MANIFEST (e.g. HelloWorldActivity.activity/MANIFEST), containing the list of the files to include in the package. (Note: Be sure not to leave blank lines at the end of the file.)

Your directory structure should now look like this:

HelloWorldActivity.activity/
HelloWorldActivity.activity/setup.py
HelloWorldActivity.activity/activity
HelloWorldActivity.activity/activity/activity.info
HelloWorldActivity.activity/activity/activity-helloworld.svg
HelloWorldActivity.activity/HelloWorldActivity.py
HelloWorldActivity.activity/MANIFEST

Setup your bundle for development

./setup.py dev

(It appears this just creates a symlink in ~/Activities .)

Running

If you now run sugar the activity icon should be visible on the frame. (You have to restart sugar to get it to pick up the change if you just installed it. Hit ctrl-alt-erase.)

You can also edit the code in your bundle directory directly. Note that the first time your Activity is launched, it leaves a process around even if you close the window, so you must kill the sugar-activity-factory to get it to reload when you click again.

Distribution

Create a .xo package to distribute your bundle. (An .xo file is essentially a zip file built from the MANIFEST with some extra metadata, like a JAR file. It also has some localization ability, and in the future we expect to be able to sign these too.) The bundle name is automatically generated from the 'name' and 'activity_version' values found in the activity.info file, separated by a dash, with a .xo extension.

 ./setup.py dist

To install the xo on a laptop you can use the installer script.

 sugar-install-bundle HelloWorld-1.xo