extjs - Sencha Touch ツールバーの複製

Question

私は Sencha Touch 2 を初めて使用し、ネストされたリストの使用に問題があります。ツールバーが戻るボタンと重複しているため、ネストされたリストの最後に 3 つのツールバーと 3 つの戻るボタンがあります。その理由は、詳細なカードごとに Ext.nestedList を作成しているためだと思います。 useToolbar:false では、前のリストに移動できないため、問題は解決しません。戻るボタンを上書きする必要があるかもしれませんが、それについてはわかりません。どんな助けでも非常に役に立ちます。コードの上部は次のとおりです。

    Ext.define('ListItem', {
    extend: 'Ext.data.Model',
    config: {
        fields: ['text'],
    },

});

var treeStore = Ext.create("Ext.NestedList", {

    fullscreen: true,
    tabBarPosition: 'bottom',

    title: 'Now-Yakutsk',
    iconCls: 'star',
    displayField: 'title',
    layout: 'card',

    store: {
        type: 'tree',
        id: 'ListCard',
        fields: [
            'title','code',
            {name: 'leaf', defaultValue: true}
        ],

        root: {
            leaf: false
        },

        proxy: {
            type: 'jsonp',
            url: 'http://now/catlist.php',
            reader: {
                type: 'json',
                rootProperty: 'cat'
            }
        }
    },                                                                      

    listeners: { 

                leafitemtap: function(nestedList, list, index, target, record) {

                    var treeStore2 = Ext.create("Ext.NestedList", {

                    fullscreen: true,
                    tabBarPosition: 'bottom',
                    //useToolbar:false,

                        //leaf: true ,
                        iconCls: 'star',
                        displayField: 'title',

                    store: {
                        type: 'tree',
                        id: 'detailCard',
                        fields: [
                            'title','code','link',
                            {name: 'leaf', defaultValue: true}
                        ],

                        root: {
                            leaf: false
                        },

                        proxy: {
                            type: 'jsonp',
                            url: 'http://now/catlist2.php',
                            reader: {
                                type: 'json',
                                rootProperty: 'cat'
                            }
                        }
                    },

                    detailCard: {   useToolbar:true,
                                    xtype: 'panel',
                                    scrollable: true,
                                    styleHtmlContent: true
                                },

                    listeners: {

                        leafitemtap: function(nestedList, list, index, target, record) {
                            var cin = Ext.create("Ext.NestedList", {
                                fullscreen: true,
                                tabBarPosition: 'bottom',
                                //useToolbar:false,
                                        //title: 'Blog',
                                        iconCls: 'star',
                                        displayField: 'list',

                                        store: {
                                            type: 'tree',

                                            fields: [
                                                'name', 'link', 'list', 'image', 'adress', 'banner',
                                                {name: 'leaf', defaultValue: true}
                                            ],

                                            root: {
                                                leaf: false
                                            },

                                            proxy: {
                                                type: 'jsonp',
                                                url: 'http://now/cinemalist.php',
                                                reader: {
                                                    type: 'json',
                                                    rootProperty: 'cinema'
                                                }
                                            }
                                        },

                                        detailCard: {
                                            xtype: 'panel',
                                            scrollable: true,
                                            styleHtmlContent: true
                                        },

                                        listeners: {
                                            leafitemtap: function(nestedList, list, index, element, post) {
                                                this.getDetailCard().setHtml(post.get('banner'));
                                            }
                                        }


                            });

そしてスクリーンショット：

http://piccy.info/view3/4985552/cdfd1dcca3928d4a5d4b4b41ba060b1f/

Answer 1

他の誰かが同じ問題を抱えている場合の解決策を見つけました-ポイントは、作成した親などのアクティブな非アクティブメソッドでツールバーを非表示にして表示しています

                 listeners: {  activate : function() { 
                        //this.getToolbar().hide();
                        tb = this.getToolbar();

                         } ,
                         deactivate: function() {
                        //this.getToolbar().hide();                          


}

次に、子に入れます

 listeners: {
                             activate : function() {         
                                                            tb1 = this.getToolbar();
                                                            tb1.hide();
                                                            tb.show(); 


                            //this.getToolbar().hide();

                             } ,
                             deactivate: function() {       
                                //tb.show(); 
                                //alert('dd');
                            //this.getToolbar().hide();                           

    }

等々 ...