11
edits
Changes
Jump to navigation
Jump to search
Line 3:
Line 3: + + + Line 63:
Line 66: + + + + + + + + Line 82:
Line 93: − + Line 93:
Line 104: + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Line 163:
Line 209: − + Line 187:
Line 233: + + + + + + + + + + + + + +
Features/GTK3/Porting (view source)
Revision as of 03:00, 23 December 2017
, 03:00, 23 December 2017Included sugar3, pango, gdk
There is another guide written from scratch that uses this one as reference. It was done porting GetBooks Activity [[Features/GTK3/Porting/GetBooks]]
There is another guide written from scratch that uses this one as reference. It was done porting GetBooks Activity [[Features/GTK3/Porting/GetBooks]]
If you would like to reference other examples of GTK3 port:
* [https://github.com/sugarlabs/biorhythm/commit/c16de3b70cce2cc6f8af933e2b062c844a47c144/ Biorhythm]
==Preparation==
==Preparation==
to
to
from gi.repository import Gtk
from gi.repository import Gtk
Remember to import the gi module and specify the Gtk version as 3.0 as well.
<pre>
import gi
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk
</pre>
Then you have to change each call that involves Gtk, for example creating a button will look now like this:
Then you have to change each call that involves Gtk, for example creating a button will look now like this:
button = Gtk.Button()
button = Gtk.Button()
</pre>
</pre>
For porting your activity you do have to change your calls for accessing widgets and services in the new GTK3 sugar-toolkit as well. The new namespace is called sugar3, trying to reflect that GTK3 is the underlying technology. For example the import of the base activity class has to be changed from
For porting your activity you do have to change your calls for accessing widgets and services in the new GTK3 sugar-toolkit as well. The new namespace is called [https://developer.sugarlabs.org/sugar3/ sugar3], trying to reflect that GTK3 is the underlying technology. For example the import of the base activity class has to be changed from
from sugar.activity import activity
from sugar.activity import activity
to
to
Ok, let's do these changes now for your activity. Make sure you are in your master branch using the 'git branch' command (the master branch should have a '*' before it). Make your changes, commit them ('git commit -a') and push them to the remote repository ('git push origin master').
Ok, let's do these changes now for your activity. Make sure you are in your master branch using the 'git branch' command (the master branch should have a '*' before it). Make your changes, commit them ('git commit -a') and push them to the remote repository ('git push origin master').
====Simple example on creating a toolbar====
One of Sugar's activity most unique user interface includes the toolbar. In order to reference the relevant modules and graphics, the sugar3 library has to be imported. These are the relevant ones that would enable us to create a simple toolbar containing the activity button and the stop button.
<pre>
from sugar3.activity import activity
from sugar3.graphics.toolbarbox import ToolbarBox
from sugar3.activity.widgets import ActivityToolbarButton
from sugar3.activity.widgets import StopButton
from sugar3.graphics.toolbarbox import ToolbarButton
from sugar3.graphics import style
</pre>
Since the ActivityToolbar() module has been deprecated, the toolbar can now be called using
ToolbarBox()
Then, from the ToolbarBox(), include the ActivityButton and StopButton. In order for the StopButton to be align to the right as per Sugar activity interface, a separator has to be included as well.
<pre>
toolbar_box = ToolbarBox()
activity_button = ActivityToolbarButton(self)
toolbar_box.toolbar.insert(activity_button, 0)
activity_button.show()
separator = Gtk.SeparatorToolItem()
separator.props.draw = False
separator.set_expand(True)
toolbar_box.toolbar.insert(separator, -1)
separator.show()
stop_button = StopButton(self)
toolbar_box.toolbar.insert(stop_button, -1)
stop_button.show()
self.set_toolbar_box(toolbar_box)
toolbar_box.show()
</pre>
===Tools===
===Tools===
<pre>box.add(widget)</pre>
<pre>box.add(widget)</pre>
This is as far as you need to go for now. However, in GTK3, GtkVBox and GtkHBox have been deprecated, which means they might be removed in GTK4. The replacement is to use GtkBox directly, and you may wish to make this change now. e.g.:
This is as far as you need to go for now. However, in GTK3, GtkVBox and GtkHBox have been deprecated, which means they might be removed in GTK3. The replacement is to use GtkBox directly, and you may wish to make this change now. e.g.:
<pre>vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL)</pre>
<pre>vbox = Gtk.Box(orientation=Gtk.Orientation.VERTICAL)</pre>
<pre>hbox = Gtk.Box(orientation=Gtk.Orientation.HORIZONTAL, homogeneous=True, spacing=8)</pre>
<pre>hbox = Gtk.Box(orientation=Gtk.Orientation.HORIZONTAL, homogeneous=True, spacing=8)</pre>
Additionally, PyGTK accepted these construction parameters as positional arguments. As explained above, they must now be converted to keyword arguments.
Additionally, PyGTK accepted these construction parameters as positional arguments. As explained above, they must now be converted to keyword arguments.
=== Gdk ===
Previously, gdk was an attribute of the gtk module, which means that it can be called through gtk. For example, if we want to use color_parse():
gtk.gdk.color_parse(color)
However, what we have to do now is:
from gi.repository import Gdk
Then we can modify the code to the following:
Gdk.color_parse(color)
=== Pango ===
Following the release of Gtk3, we should not be importing pango like this:
import pango
In fact, we ca now import pango as an attribute within the gtk3 library:
from gi.repository import Pango as pango
=== Other considerations ===
=== Other considerations ===