1

我是 Sencha Touch 2 的新开发人员,我正在尝试使用其提供的 MVC 架构创建我的第一个应用程序。我发现在页面之间导航时工具栏/标题栏文本重叠的问题。看看这些截图:

示例 1

示例 2

我不太确定外面发生了什么。我正在使用 animateActiveItem 和路由方法在我的应用程序中移动。

Users.js 控制器文件,登录方法

// Ajax code here, not included here
// on ajax success:
this.redirectTo("login");

Routes.js 控制器文件

routeLoginPage: function() {
    console.log("routeLoginPage");
    Ext.Viewport.animateActiveItem({ xtype: "loginpage" }, { type: "slide", direction: "left" });
},

真的有人遇到过这样的问题吗?我不知道现在该怎么做,因为我试图解决这个问题 2 天+。

编辑

基本上我需要在定义为视图的页面之间移动。我在包含属性的不同文件中定义每个视图:扩展、要求、别名、配置和我定义的方法。每个配置属性都附加了标题栏作为其第一项。

当我尝试更改页面时,我通过更改地址哈希的控制器命令加载另一个视图。Routes 控制器然后触发 animateActiveItem 方法,该方法加载另一个视图(之前通过别名属性定义为 xtype)。

我正在使用 Miami Coder 的教程 (miamicoder.com/2012/how-to-create-a-sencha-touch-2-app-part-1/) 来学习 Sencha Touch 基础知识。

4

3 回答 3

1

我认为您的意思是标题栏而不是工具栏...

使用导航视图在视图之间导航而不是Ext.Viewport.animateActiveItem 它是一种更好的方法。要使用导航视图,请在 sencha 文档中使用本指南... Sencha 有一个陡峭的学习曲线,所以要准备好面对这样的挫折......

导航 查看指南

于 2012-12-10T12:05:36.123 回答
0
{
    xtype: 'navigationview',
    id: 'navView',
    navigationBar: {
        hidden: true
    }

}

上面的代码将隐藏导航视图生成的标题栏...现在您需要像这样定义自己的标题栏

{
       xtype: 'titlebar',
       title: 'title',
       items: [
            {
                   xtype: 'button',
                   text: 'back',
                   listeners: [
                     {
                         fn: function(button){
                              Ext.getCmp('navView').pop();//this will pop the view and show previous view
                         },event: 'tap'

                     }
                   ]
            }
       ]



}

希望能帮助到你...

于 2012-12-11T05:37:54.853 回答
0

您可以在一个面板类中添加所需的视图,并使用

mainclass.setActiveItem(0)

或者使用导航视图

于 2012-12-10T12:38:55.143 回答