Sencha触摸2幻灯片导航与图标

Question

我是sencha touch的新手。在我们的项目中，我们即将实施幻灯片导航方法。

任何人都可以帮我解决如何实现幻灯片导航，如下图所示。 Navigation

我已尝试过一些示例来实现这样的侧面导航 Slide Navigation

任何人都可以帮助我，如何实现我在上面的图片中共享的导航。

View.js

Ext.define('app.view.SlideNavigation', {
    requires: ['Ext.Menu'],
    singleton: true,
    constructor: function(config) {
        this.initConfig(config);
    },
    views: ['app.view.UserSettings'],
    config: {
    },
    setMenu: function() {
        Ext.Viewport.setMenu(this.createMenu('right'), {
            side: 'right',
            reveal: true
        });
    },

    createMenu: function(side) {
        var items = [
            {
                xtype :'button',
                text: 'User Profile,
                iconCls: 'settings',
                scope: this,
                handler: function() {
                                         }
},{
                text: 'Password',
               // ui:'plain',
                //style:'background-color:white',
                iconCls: 'compose',
                scope: this,
                handler: function() {
}
},
{
                xtype: 'button',
                text: 'Logout',
              //  ui:'plain',
               // style:'background-color:white',
                iconCls: '',
                scope: this,
                handler: function() {
                                      },
} ];
   var className = 'Ext.Menu';

        return Ext.create(className, {
            cls:'user-icons',
            items: items
        });
    }
});