Sencha 基础Demo测试,三种showView的方法

最新推荐文章于 2021-02-24 08:57:36 发布

bangman4009

最新推荐文章于 2021-02-24 08:57:36 发布

阅读量145

点赞数

原文链接：http://www.cnblogs.com/Brose/p/sencha_view.html

版权

本文介绍了一种使用Sencha Touch进行视图切换的方法，包括三种不同的展示View的方式：直接创建并添加新视图、通过动画切换已存在的视图以及直接激活已定义的视图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

直接贴代码吧

Ext.define("build.controller.MainController",{
    extend:"Ext.app.Controller",
    config:{
        refs:{
            mainDataview:"main dataview",
            createAdd:"createAdd"
        },
        control:{
            "mainDataview":{
                itemtap:function(data,index,item,record,event){
                    //测试三种展示View的方法................
                    console.log(record)
                    switch (record.data.id){
                        case "1":
                            console.log(1111)
                            /*第一种方式*/
                            var c1=Ext.create("build.view.CreateAdd");
                            Ext.Viewport.add(c1);
                            Ext.Viewport.setActiveItem(c1);
                            break;
                        case "2":
                            console.log(2222)
                            /*第二种方式,这种方式和case3这种show的方式其实是一样de,但是这个先将对象拿出,是为了方便给这个对象设置属性,比如说*/
                            var c2=this.getCreateAdd();
                            if(c2==null){
                                c2=Ext.create("build.view.CreateAdd")
                            }
                            Ext.Viewport.animateActiveItem(c2,{type:"slide",direction:'left'})
　　　　　　　　　　　　　　　　//c2.setXXXXX()
                            break;
                        case "3":
                            console.log(3333)
                            /*第三种方式*/
                            Ext.Viewport.animateActiveItem("createAdd",{type:"slide",direction:'right'})
                            break;
                    }
                    Ext.getCmp("detailView").setTitle(record.data.name)
                }
            }
        }
    }
})