Toolbar is a great way of getting a single-click access to application features. It can have buttons, drop-downs, text field, and so on. Sencha Touch provides a toolbar component and this recipe will show us how to use it and work with its options.
Make sure that you have set up your development environment by following the recipes outlined in Chapter 1.
Carry out the following steps:
Create and open a new file named
ch06_11.js
and paste the following code in it:Ext.setup({ onReady: function() { var myToolbar = new Ext.Toolbar({ title: 'My Toolbar', items: [ { text: 'Rose' }, { text: 'Daffodil' },{ text: 'Hibiscus' },{ text: 'Reset', ui: 'decline-round' }, { text: 'Back', ui: 'back' } ] }); var myPanel = new Ext.Panel({ dockedItems: [myToolbar...