Legacy Maemo 5 Documentation/Graphical UI Tutorial/Toolbars - Revision history

imported_>amigadave: wikify slightly

2010-10-14T13:24:56Z

wikify slightly

imported_>amigadave: {{Legacy documentation}}

2010-02-12T09:45:24Z

← Older revision		Revision as of 09:45, 12 February 2010
Line 1:		Line 1:
			{{Legacy documentation}}

	= Toolbars =		= Toolbars =
	Toolbars usually simplify the customization of widget look and layout by grouping widgets. The Hildon framework provides two specialized toolbars: HildonFindToolbar and HildonEditToolbar. You can also use GtkToolbars in your Hildon application.		Toolbars usually simplify the customization of widget look and layout by grouping widgets. The Hildon framework provides two specialized toolbars: HildonFindToolbar and HildonEditToolbar. You can also use GtkToolbars in your Hildon application.

imported_>b0unc3: /* Using GtkToolbars in Hildon applications */

2009-12-15T20:30:40Z

Using GtkToolbars in Hildon applications

← Older revision		Revision as of 20:30, 15 December 2009
Line 355:		Line 355:
	'''Example 4.3. Using a GtkToolbar in a Hildon application'''		'''Example 4.3. Using a GtkToolbar in a Hildon application'''

	<tt><span>'''<span><font color="#000080"><nowiki>#include</nowiki></font></span>'''</span> <span><font color="#FF0000"><hildon/hildon.h></font></span>		<tt><span>'''<span><font color="#000080"><nowiki>#include</nowiki></font></span>'''</span> <span><font color="#FF0000"><hildon/hildon.h></font></span>
	<span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">on_clicked</font></span>'''</span> <span><font color="#990000">(</font></span>GtkToolButton <span><font color="#990000"><nowiki>*</nowiki></font></span>toolbutton<span><font color="#990000">,</font></span>		<span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">on_clicked</font></span>'''</span> <span><font color="#990000">(</font></span>GtkToolButton <span><font color="#990000"><nowiki>*</nowiki></font></span>toolbutton<span><font color="#990000">,</font></span>
	gint index<span><font color="#990000">)</font></span>		gint index<span><font color="#990000">)</font></span>
Line 362:		Line 362:
	<span><font color="#FF0000">}</font></span>		<span><font color="#FF0000">}</font></span>
	<span><font color="#009900">int</font></span>		<span><font color="#009900">int</font></span>
	<span>'''<span><font color="#000000">main</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">int</font></span> argc<span><font color="#990000">,</font></span>		<span>'''<span><font color="#000000">main</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">int</font></span> argc<span><font color="#990000">,</font></span> <span><font color="#009900">char</font></span> <span><font color="#990000"><nowiki>**</nowiki></font></span>argv<span><font color="#990000">)</font></span>
	<span><font color="#009900">char</font></span> <span><font color="#990000"><nowiki>**</nowiki></font></span>argv<span><font color="#990000">)</font></span>
	<span><font color="#FF0000">{</font></span>		<span><font color="#FF0000">{</font></span>
	HildonProgram <span><font color="#990000"><nowiki>*</nowiki></font></span>program<span><font color="#990000"><nowiki>;</nowiki></font></span>		HildonProgram <span><font color="#990000"><nowiki>*</nowiki></font></span>program<span><font color="#990000"><nowiki>;</nowiki></font></span>

imported_>b0unc3: /* Find toolbars */

2009-12-15T19:38:36Z

Find toolbars

imported_>msoini: Documentation/Maemo 5 Developer Guide/Graphical UI Tutorial/Toolbars moved to Legacy Maemo 5 Documentation/Graphical UI Tutorial/Toolbars: Phase out from Maemo Developer Guide, superceded by Official Nokia Forum documentation

2009-10-14T09:29:47Z

Documentation/Maemo 5 Developer Guide/Graphical UI Tutorial/Toolbars moved to Legacy Maemo 5 Documentation/Graphical UI Tutorial/Toolbars: Phase out from Maemo Developer Guide, superceded by Official Nokia Forum documentation

← Older revision	Revision as of 09:29, 14 October 2009
(No difference)

imported_>liox_lang_valid: /* Toolbars */

2009-09-25T05:56:33Z

Toolbars

← Older revision		Revision as of 05:56, 25 September 2009
Line 41:		Line 41:
	</tt>		</tt>

	After ~~create~~ and properly ~~set~~ up the toolbar ~~is necessary to~~ attach it to any window. HildonWindow provides the following function to attach a toolbar:		After creating and properly setting up the toolbar, attach it to any window. HildonWindow provides the following function to attach a toolbar:

	<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>		<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>
Line 121:		Line 121:
	</tt>		</tt>

	In the example above a callback is set to handle the signal "history-append", emitted by the toolbar when a new item is added to the history. Other signals like~~, for example,~~ "history-append" ~~could~~ trigger additional actions when emitted.		In the example above a callback is set to handle the signal "history-append", emitted by the toolbar when a new item is added to the history. Other signals like "history-append" can trigger additional actions when emitted.

	Apart from the property which stores the internal list, other properties are available such as "max-characters" , which set the maximum length of the search string. To a complete description of the signals and properties available ~~read~~ the Hildon reference manual.		Apart from the property which stores the internal list, other properties are available such as "max-characters", which set the maximum length of the search string. For a complete description of the signals and properties available, see the Hildon reference manual.

	==Edit toolbars ==		==Edit toolbars ==
Line 134:		Line 134:
	The action to be performing by clicking the action button should be implemented in a callback to handle the signal "button-clicked", shown in the example.		The action to be performing by clicking the action button should be implemented in a callback to handle the signal "button-clicked", shown in the example.

	To create a new HildonEditToolbar ~~you should~~ use:		To create a new HildonEditToolbar, use:

	<tt>GtkWidget<span><font color="#990000"><nowiki>*</nowiki></font></span> <span>'''<span><font color="#000000">hildon_edit_toolbar_new</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">void</font></span><span><font color="#990000">);</font></span>		<tt>GtkWidget<span><font color="#990000"><nowiki>*</nowiki></font></span> <span>'''<span><font color="#000000">hildon_edit_toolbar_new</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">void</font></span><span><font color="#990000">);</font></span>
Line 141:		Line 141:
	</tt>		</tt>

	The second creation function allows to set the two labels of the widget. If you use the simple creation function, ~~you should~~ set the labels by using the following functions.		The second creation function allows to set the two labels of the widget. If you use the simple creation function, set the labels by using the following functions.

	<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>		<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>
Line 147:		Line 147:
	</tt>		</tt>

	~~Once~~ the edit toolbar is configured ~~you need to~~ attach it to a window by using:		When the edit toolbar is configured, attach it to a window by using:

	<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>		<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>
Line 153:		Line 153:
	</tt>		</tt>

	~~As was said,~~ the action to be done by clicking the button ~~should be mplemented~~ in a callback attached to the signal "button-clicked". These widgets define also another signal, "arrow-clicked", emitted when users click the arrow. Typically, the callback for the signal "arrow-clicked" ~~should destroy~~ the current edit view.		Implement the action to be done by clicking the button in a callback attached to the signal "button-clicked". These widgets define also another signal, "arrow-clicked", emitted when users click the arrow. Typically, the callback for the signal "arrow-clicked" destroys the current edit view.

	The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.		The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.
Line 335:		Line 335:
	}		}

	The most ~~of stuff~~ related to HildonEditToolbar is in the function edit_window. This function creates a edit view, meaning that a new HildonStackableWindow is created showing a treeview in which users can select several items.		The most things related to HildonEditToolbar is in the function edit_window. This function creates a edit view, meaning that a new HildonStackableWindow is created showing a treeview in which users can select several items.

	Note that the edit window is set to fullscreen and thus displaying the HildonEditToolbar obscures the usual window controls.		Note that the edit window is set to fullscreen and thus displaying the HildonEditToolbar obscures the usual window controls.

	== Using GtkToolbars in Hildon applications ==		== Using GtkToolbars in Hildon applications ==
	~~You can use~~ the widget GtkToolbar as you would use it in a GTK+ application, but ~~take~~ the following ~~considerations into account~~:		Use the widget GtkToolbar as you would use it in a GTK+ application, but consider the following:

	* Use GtkToolbars when only one content item is visible (~~e.g.~~ when editing a single image or editing a single email).		* Use GtkToolbars when only one content item is visible (for example when editing a single image or editing a single email).
	* Provide no menu commands or settings for hiding or showing toolbar. The toolbar is always shown in the view where you decided to put it.		* Provide no menu commands or settings for hiding or showing toolbar. The toolbar is always shown in the view where you decided to put it.

	Like the others toolbars, a GtkToolbar ~~should be attached~~ to a window by using:		Like the others toolbars, attach a GtkToolbar to a window by using:

	<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>		<tt><span><font color="#009900">void</font></span> <span>'''<span><font color="#000000">hildon_window_add_toolbar</font></span>'''</span> <span><font color="#990000">(</font></span>HildonWindow <span><font color="#990000"><nowiki>*</nowiki></font></span>self<span><font color="#990000">,</font></span>

imported_>tatiana: /* Edit toolbars */ Example 4.2. Using an Edit Toolbar: linked code corresponding image

2009-09-10T13:40:53Z

Edit toolbars: Example 4.2. Using an Edit Toolbar: linked code corresponding image

← Older revision		Revision as of 13:40, 10 September 2009
Line 157:		Line 157:
	The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.		The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.

	[[Image:~~Edit_toolbar~~.png\|400px]]		[[Image:Edit_toolbar_list_view.png\|400px]]

	'''Example 4.2. Using an Edit Toolbar'''		'''Example 4.2. Using an Edit Toolbar'''

imported_>tatiana: /* Edit toolbars */ Example 4.2. Using an Edit Toolbar: recovered correct snippet

2009-09-10T13:35:16Z

Edit toolbars: Example 4.2. Using an Edit Toolbar: recovered correct snippet

Show changes

imported_>bijjal: Documentation/Maemo 5 Developer Guide/Application Development/Toolbars moved to Documentation/Maemo 5 Developer Guide/Graphical UI Tutorial/Toolbars: Internal baseline has moved this chapter from Application development.

2009-08-18T08:28:13Z

Documentation/Maemo 5 Developer Guide/Application Development/Toolbars moved to Documentation/Maemo 5 Developer Guide/Graphical UI Tutorial/Toolbars: Internal baseline has moved this chapter from Application development.

← Older revision	Revision as of 08:28, 18 August 2009
(No difference)

imported_>bijjal: /* Edit toolbars */

2009-07-13T14:26:34Z

Edit toolbars

← Older revision		Revision as of 14:26, 13 July 2009
Line 157:		Line 157:
	The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.		The example below shows how to use an edit toolbar. This example builds a main window showing a list of items and a button to go to a edit view where users can select several items and deleted by clicking the action button of the toolbar.

			[[Image:Edit_toolbar.png\|400px]]

	'''Example 4.2. Using an Edit Toolbar'''		'''Example 4.2. Using an Edit Toolbar'''

← Older revision		Revision as of 19:38, 15 December 2009
Line 60:		Line 60:
	'''Example 4.1. Using a Find Toolbar'''		'''Example 4.1. Using a Find Toolbar'''

	<tt><span>'''<span><font color="#000080"><nowiki>#include</nowiki></font></span>'''</span> <span><font color="#FF0000"><hildon/hildon.h></font></span>		<tt><span>'''<span><font color="#000080"><nowiki>#include</nowiki></font></span>'''</span> <span><font color="#FF0000"><hildon/hildon.h></font></span>
	gboolean		gboolean
	<span>'''<span><font color="#000000">on_history_append</font></span>'''</span> <span><font color="#990000">(</font></span>HildonFindToolbar <span><font color="#990000"><nowiki>*</nowiki></font></span>toolbar<span><font color="#990000">,</font></span>		<span>'''<span><font color="#000000">on_history_append</font></span>'''</span> <span><font color="#990000">(</font></span>HildonFindToolbar <span><font color="#990000"><nowiki>*</nowiki></font></span>toolbar<span><font color="#990000">,</font></span>
	gpointer user_data<span><font color="#990000">)</font></span>		gpointer user_data<span><font color="#990000">)</font></span>
	<span><font color="#FF0000">{</font></span>		<span><font color="#FF0000">{</font></span>
	gchar <span><font color="#990000"><nowiki>*</nowiki></font></span>item<span><font color="#990000"><nowiki>;</nowiki></font></span>		gchar <span><font color="#990000"><nowiki>*</nowiki></font></span>item<span><font color="#990000"><nowiki>;</nowiki></font></span>
Line 86:		Line 86:
	<span>'''<span><font color="#0000FF">return</font></span>'''</span> FALSE<span><font color="#990000"><nowiki>;</nowiki></font></span>		<span>'''<span><font color="#0000FF">return</font></span>'''</span> FALSE<span><font color="#990000"><nowiki>;</nowiki></font></span>
	<span><font color="#FF0000">}</font></span>		<span><font color="#FF0000">}</font></span>
	<span><font color="#009900">int</font></span>		<span><font color="#009900">int</font></span> <span>'''<span><font color="#000000">main</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">int</font></span> argc<span><font color="#990000">,</font></span> <span><font color="#009900">char</font></span> <span><font color="#990000"><nowiki>**</nowiki></font></span>argv<span><font color="#990000">)</font></span>
	<span>'''<span><font color="#000000">main</font></span>'''</span> <span><font color="#990000">(</font></span><span><font color="#009900">int</font></span> argc<span><font color="#990000">,</font></span>
	<span><font color="#009900">char</font></span> <span><font color="#990000"><nowiki>**</nowiki></font></span>argv<span><font color="#990000">)</font></span>
	<span><font color="#FF0000">{</font></span>		<span><font color="#FF0000">{</font></span>
	HildonProgram <span><font color="#990000"><nowiki>*</nowiki></font></span>program<span><font color="#990000"><nowiki>;</nowiki></font></span>		HildonProgram <span><font color="#990000"><nowiki>*</nowiki></font></span>program<span><font color="#990000"><nowiki>;</nowiki></font></span>