Sencha Touch - 触摸后退按钮时如何隐藏自定义按钮?

时间:2013-08-13 08:59:33

标签: sencha-touch-2

我在homepanel的导航视图中创建自定义按钮。我的项目有3个视口。当我按导航视图并按下后退按钮自定义按钮是隐藏。但是当我按导航< / strong>从导航视图中查看并推送到 showSearchCategory 视图,当我从导航中的 showSearchCategory 视图按下按钮时>视图不是隐藏自定义按钮。
我的代码错误在哪里?

我的控制器

Ext.define('Catalog.controller.Main', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            homepanel: 'homepanel',
            but: 'homepanel #category',
            categoryButton: 'button[action=Categories]', 
            list:'list',
            homepanellist: 'homepanel #Applist',
            navigationlist: 'navigation #Catlist',
            navigation: 'navigation',
            showSearchCategoryList: 'showSearchCategory list'

        },
        control: {
            homepanellist:{
                itemtap: 'showApp'
            },
            categoryButton:{
                tap: 'showCat'
            },
            homepanel: {
                back: 'backButtonHandler'
            },
            navigationlist:{
                itemtap: 'showCatQuery'
            },
            navigation:{
                back: 'backButtonNav'
            },
            showSearchCategory:{
                back: 'backFromCategoryList'
            },
            showSearchCategoryList:{
                itemtap: 'showAppFromCategory'
            }
        }
    },
    backButtonHandler: function(button){
        Ext.getCmp('category').show();
    },
    backButtonNav: function(button){
        Ext.getCmp('category').hide();
    },
    showCat: function(btn){  **<<<<< Second View**
        Ext.getCmp('category').hide();
        this.getHomepanel().animateActiveItem({
            xtype: 'navigation'
        },
        {
            type:'slide', 
            direction:'up'
        }
        );

    },
    backFromCategoryList: function(button){
       Ext.getCmp('category').hide(); 
    },
    showCatQuery: function(list,index,element,record){ **<<<<< Third View**
        Ext.getCmp('category').hide(); 
        var catid = record.get('id');
        var catname = record.get('name');
        this.getHomepanel().push({
            xtype: 'panel',
            title: catname,
            scrollable: true,
            styleHtmlContent: true,
            layout: {
                type: 'fit'
            }, 
            items: [
                {
                    catid: catid,
                    xtype: 'showSearchCategory',
                }
            ]
        });
    }
});

1.Hompanel查看:

Ext.define('Catalog.view.Home', {
    extend: 'Ext.navigation.View',
    xtype: 'homepanel',
    config: {
        navigationBar: {
            items: [
                {
                    xtype: 'button',
                    text: 'Categories',
                    id: 'category',
                    translate: true,
                    translationKey: 'navigationbar.category',
                    align: 'left',
                    action : 'Categories'
                }
            ]
        },
        title: 'All',
        iconCls: 'list',
        cls: 'home',
        styleHtmlContent: true,
        tabBarPosition: 'bottom',
        items:[
            {
                title: "All Apps",
                xtype: 'list',
                id:'Applist',
                itemTpl: new Ext.XTemplate(
                    '<img src="http://61.47.41.108:9999/system/appinfos/appicons/000/000/{id}/original/{appicon_file_name}" width="50" heigh="50" style="float:left;clear:both;"></img>',
                    '<div style="margin-left: 60px;word-wrap: break-word;width:80%;">',
                    '<span style="font-size:16px;">{name}</span><br>',
                    '<span style="font-size:13px;color:#7C7C7C;" id="catname">{categoryname}</span>',
                    '</div>'

                ),
                store: {
                    autoLoad: true,
                    fields: ['id','name','created_at','appicon_file_name','categoryid','categoryname','url_ios','url_android','gallery','description'],
                    sorters: [{
                        property:'created_at',
                        direction:'DESC'
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/appinfos.json',
                        reader:{
                            type: 'json',
                            rootProperty:'appinfos'
                        }   
                    }
                }
            }
        ]
    }
});

2.导航视图:

Ext.define('Catalog.view.Navigation', {
    extend: 'Ext.navigation.View',
    xtype: 'navigation',
    requires: ['Ext.data.Store'],
    config: {
        navigationBar: false,
        title: 'Catalog',
        ui: 'dark',
        items: [
            {
                xtype: 'list',
                id: 'Catlist',
                itemTpl: '<span style="font-size:16px;" id="cattname">{name}</span>',
                store: {
                    storeId: 'myStore',
                    autoLoad: true,
                    fields: ['id','name'],
                    sorters: [{
                        property:'name',
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/categories.json',
                        reader:{
                            type: 'json',
                            rootProperty:'Catalog'
                        }   
                    }
                }
            }
        ]   
    }

});

3.showSearchCategory查看:

Ext.define('Catalog.view.showSearchCategory', {
    extend: 'Ext.navigation.View',
    xtype: 'showSearchCategory',
    requires: ['Ext.data.Store'],
    config: {
        catid: null,
        navigationBar: false,
        items: [
            {
                xtype: 'list',
                itemTpl: new Ext.XTemplate(
                    '<img src="http://61.47.41.108:9999/system/appinfos/appicons/000/000/{id}/original/{appicon_file_name}" width="50" heigh="50" style="float:left;clear:both;"></img>',
                    '<div style="margin-left: 60px;word-wrap: break-word;width:80%;">',
                    '<span style="font-size:16px;">{name}</span><br>',
                    '<span style="font-size:13px;color:#7C7C7C;" id="catname">{categoryname}</span>',
                    '</div>'

                ),
                store: {
                    autoLoad: true,
                    storeId: 'allapp',
                    fields: ['id','name','created_at','appicon_file_name','categoryid','categoryname','url_ios','url_android','gallery','description'],
                    sorters: [{
                        property:'created_at',
                        direction:'DESC'
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/appinfos.json',
                        reader:{
                            type: 'json',
                            rootProperty:'appinfos'
                        }   
                    }
                }
            }
        ]       
    },
    initialize: function() {
        var sto = Ext.getStore('allapp');
        sto.clearFilter();
        sto.filter('categoryid', this.getCatid());
        this.callParent(arguments);
    }
});

1 个答案:

答案 0 :(得分:1)

Ext.define('Catalog.view.Navigation', {
    extend: 'Ext.navigation.View',
    xtype: 'navigation',
    requires: ['Ext.data.Store'],
    config: {
        navigationBar: false,
        title: 'Catalog',
        ui: 'dark',
        items: [
            {
                xtype: 'list',
                id: 'Catlist',
                itemTpl: '<span style="font-size:16px;" id="cattname">{name}</span>',
                store: {
                    storeId: 'myStore',
                    autoLoad: true,
                    fields: ['id','name'],
                    sorters: [{
                        property:'name',
                    }],
                    proxy: {
                        type: 'jsonp',
                        url: 'http://61.47.41.108:9999/categories.json',
                        reader:{
                            type: 'json',
                            rootProperty:'Catalog'
                        }   
                    }
                }
            }
        ],   
        listeners:{
            painted:function() {
                Ext.getCmp('category').hide();
            }
        }
    }
});

请在项目后面的配置中添加一个监听器,并添加一个绘制功能,您将在其中编写隐藏功能。这肯定会有效。 绘制的函数仅用于视图,不能在控制器中写入。