2012-05-18 78 views
1

我想在view.js中显示没有标签面板的图像 但是,尽管遵循了文档,但似乎无法工作。任何人都可以帮助指出我做错了什么吗?Sencha在标签面板中触摸显示图像

谢谢

App.js

Ext.application({ 
    name: 'hoodhelp1a', 

    requires: [ 
     'Ext.MessageBox' 
    ], 

    views: ['Main'], 

    isIconPrecomposed: true, 

    launch: function() { 
     // Destroy the #appLoadingIndicator element 
     Ext.fly('appLoadingIndicator').destroy(); 

     // Initialize the main view 
     Ext.Viewport.add(Ext.create('hoodhelp1a.view.Main')); 
    }, 

    onUpdated: function() { 
     Ext.Msg.confirm(
      "Application Update", 
      "This application has just successfully been updated to the latest version. Reload now?", 
      function(buttonId) { 
       if (buttonId === 'yes') { 
        window.location.reload(); 
       } 
      } 
     ); 
    } 
}); 

查看/ Main.js

Ext.define("hoodhelp1a.view.Main", { 
    extend: 'Ext.tab.Panel', 
    requires: [ 
     'Ext.TitleBar', 
     'Ext.Video', 
     'Ext.Img', 
    ], 
    config: { 
     tabBarPosition: 'bottom', 

     items: [ 
      { 
       title: 'Home', 
       iconCls: 'home', 
       xtype: 'container', 
       layout: 'hbox', 
       items: [ 
       { 
        docked: 'top', 
        xtype: 'titlebar', 
        title: 'Welcome to Sencha Touch 2' 
       }, 
       { 
         xtype: 'image', 
         src: 'http://www.sencha.com/assets/images/sencha-avatar-64x64.png' 
       } 
      ] 
      }, 
      { 
       title: 'Get Started', 
       iconCls: 'action', 

       items: [ 
        { 
         docked: 'top', 
         xtype: 'titlebar', 
         title: 'Getting Started' 
        }, 
        { 
         xtype: 'video', 
         url: 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c', 
         posterUrl: 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg' 
        } 
       ] 
      } 
     ] 
    } 
}); 

回答

2

由于您使用您的第一个标签页中 '容器' 一个 '横向盒' 布局,你必须指定'flex'配置。 (例如,在'image'配置中设置'flex:1')。

另一种方法是将此“容器”的布局设置为“适合”。

顺便说一下,'xtype:container'不是必需的。

看到这个捣鼓说明用途: http://www.senchafiddle.com/#X0Ejm

+0

谢谢!这是一个很大的帮助。 – shaoming