2012-04-24 72 views
1

我開始玩弄sencha touch 2並遇到以下問題。 我試圖建立一個非常簡單的應用程序,它有一個按鈕和一個列表視圖和tabpanel:無法顯示在sencha touch 2中的列表視圖

我看到tabpanel與我的按鈕和不錯的標題;但是listview拒絕顯示;我嘗試添加'佈局:適合',但它更糟糕。

我在這裏錯過了什麼'明顯'的東西?

Main.js:

Ext.define('CurrencyFX.view.Main', { 
extend: 'Ext.Panel', 

requires: [ 
    'CurrencyFX.view.Home', 
    'CurrencyFX.view.CurrencyList', 
], 

config: { 

    items: [ 
     { xtype: 'homecard' }, 
     { xtype: 'currencycard' },  
    ] 
} 
}); 

Home.js:

Ext.define('CurrencyFX.view.Home', { 
extend: 'Ext.Panel', 
requires: ['Ext.TitleBar'], 
xtype: 'homecard', 

config: { 
    items: [{ 
     docked: 'top', 
     xtype: 'titlebar', 
     title: 'Currency FX', 
     items: [ 
      { 
       text: 'Refresh', 
       align: 'right', 
       action: 'reloadQuotes' 
      } 
     ] 
    } 
    ] 
} 
}); 

CurrencyList.js:

Ext.define('CurrencyFX.view.CurrencyList', { 
    extend: 'Ext.List', 
    requires: ['CurrencyFX.store.Currencies'], 

    xtype: 'currencycard', 
    config: { 
     itemTpl: '{name} is at {value}', 
     store: 'Currencies', 
    } 
}) 

回答

2

你可以添加一個高度與currencycard?這提供了一個快速檢查:

 
    items: [ 
      { xtype: 'homecard'}, 
      { xtype: 'currencycard', height: 500 } 
     ] 

這裏有一個佈局,將填補屏幕(請注意,我感動停靠:「頂」在這裏!):

 
Ext.define('CurrencyFX.view.Main', { 
    extend: 'Ext.Panel', 

    requires: [ 
     'CurrencyFX.view.Home', 
     'CurrencyFX.view.CurrencyList' 
    ], 

    config: { 
     fullscreen: true, 
     layout: 'fit', 
     items: [ 
      { 
       xtype: 'homecard', 
       docked: 'top' 
      }, 
      { xtype: 'currencycard'} 
     ] 
    } 
}); 
+0

哇,不能相信太簡單了!有用 !有沒有辦法讓它自動把整個屏幕減去tabpanel?所以它可以在非視網膜顯示器上工作? – Disco 2012-04-24 19:18:24

+1

是的,我明白了。更新了我的答案。高度:是一個快速的技巧,看看是否有東西被摺疊。 – 2012-04-24 19:29:03

+0

你剛剛度過了我的一天!謝謝+1啤酒:) – Disco 2012-04-24 19:38:30