Sencha Touch实现点击Panel,切换带图片的Panel



 

  1. 先去Sencha Touch的官网下载需要的库文件,文件目录如图所示:

    Sencha Touch实现点击Panel,切换带图片的Panel_第1张图片

                                 1-1

  2. 然后创建homework1.js文件,加注释,代码分析:

    先写ShenCha Touch需要的引用,然后再在lunch:function()里面创建需要的组件和事件

    Sencha Touch实现点击Panel,切换带图片的Panel_第2张图片

    lunch:function()里面创建一个标题栏和四个Panel组件

    Sencha Touch实现点击Panel,切换带图片的Panel_第3张图片

    创建TabPanel,并将四个带有图片的Panel添加到里面

     

     

    再创建一个Panel,将所有的都添加到里面,调用Ext.Viewport.add()添加Panel进来就可以

    Sencha Touch实现点击Panel,切换带图片的Panel_第4张图片

    (3)创建homework1.html

    Sencha Touch实现点击Panel,切换带图片的Panel_第5张图片


效果如图

    Sencha Touch实现点击Panel,切换带图片的Panel_第6张图片

你可能感兴趣的:(Sencha Touch实现点击Panel,切换带图片的Panel)