圓形列表不滾動直到結束sencha touch 2

我想在Sencha Touch 2中使用圓角列表視圖。爲此，我使用了ui：round屬性。但它不起作用。現在左側，它圓潤了。但是對於右邊來說，這是不正確的。我想要那個圓形邊框內的列表。下面是我的代碼：圓形列表不滾動直到結束sencha touch 2

這裏是我的代碼：

Ext.define('MyApp.view.MyTabPanel', { 
extend: 'Ext.tab.Panel', 

config: { 
    layout: { 
     animation: 'fade', 
     type: 'card' 
    }, 
    items: [ 
     { 
      xtype: 'container', 
      draggable: true, 
      styleHtmlContent: true, 
      title: 'Artist', 
      items: [ 
       { 
        xtype: 'list', 
        height: 696, 
        ui: 'round', 
        width: 325, 
        modal: true, 
        itemTpl: [ 
         '{firstName}' 
        ], 
        store: 'name', 
        onItemDisclosure: true 
       } 
      ] 
     }, 
     { 
      xtype: 'container', 
      styleHtmlContent: true, 
      scrollable: true, 
      title: 'Albums', 
      items: [ 
       { 
        xtype: 'list', 
        height: 730, 
        ui: 'round', 
        width: 325, 
        modal: true, 
        itemTpl: [ 
         '{albumlist}' 
        ], 
        store: 'albumstore', 
        onItemDisclosure: true 
       } 
      ] 
     }, 
     { 
      xtype: 'container', 
      styleHtmlContent: true, 
      title: 'Playlist', 
      items: [ 
       { 
        xtype: 'list', 
        height: 700, 
        ui: 'round', 
        width: 325, 
        modal: true, 
        itemTpl: [ 
         '{playlist}' 
        ], 
        store: 'playliststore', 
        onItemDisclosure: true 
       } 
      ] 
     } 
    ], 
    tabBar: { 
     docked: 'top', 
     layout: { 
      align: 'center', 
      pack: 'center', 
      type: 'hbox' 
     } 
    } 
} 

});

現在在圓名單即將到來。但滾動不正確。它不會一直持續到名單的末尾。

來源

2012-05-31 Arindam Mukherjee

您SenchaFiddle碼開不起來。提供不同的鏈接。 – Swar

請提供您的senchafiddle鏈接，舊的破壞 –

試試這個傢伙：http://www.senchafiddle.com/#eB8cw#Kv7ml –

您已將一些冗餘配置包含到組件中。

我只更改了MyTabPanel.js（相當多）。

這是編輯後的源代碼，它可以很好地用於藝術家名單，並且它類似於應用到其他組件：

Ext.define('MyApp.view.MyTabPanel', { 
    extend: 'Ext.tab.Panel', 

    config: { 
     layout: { 
      animation: 'fade', 
      type: 'card' 
     }, 
     items: [ 
      { 
       xtype: 'container', 
       layout: 'card', 
       //draggable: true, 
       styleHtmlContent: true, 
       title: 'Artist', 
       items: [ 
        { 
         xtype: 'list', 
         //height: 696, 
         ui: 'round', 
         //width: 325, 
         //modal: true, 
         itemTpl: [ 
          '{firstName}' 
         ], 
         store: 'name', 
         onItemDisclosure: true 
        } 
       ] 
      }, 
      { 
       xtype: 'container', 
       layout: 'card', 
       styleHtmlContent: true, 
       //scrollable: true, 
       title: 'Albums', 
       items: [ 
        { 
         xtype: 'list', 
         height: 730, 
         ui: 'round', 
         width: 325, 
         modal: true, 
         itemTpl: [ 
          '{albumlist}' 
         ], 
         store: 'albumstore', 
         onItemDisclosure: true 
        } 
       ] 
      }, 
      { 
       xtype: 'container', 
       layout: 'card', 
       styleHtmlContent: true, 
       title: 'Playlist', 
       items: [ 
        { 
         xtype: 'list', 
         //height: 700, 
         ui: 'round', 
         //width: 325, 
         //modal: true, 
         itemTpl: [ 
          '{playlist}' 
         ], 
         store: 'playliststore', 
         onItemDisclosure: true 
        } 
       ] 
      } 
     ], 
     tabBar: { 
      docked: 'top', 
      layout: { 
       align: 'center', 
       pack: 'center', 
       type: 'hbox' 
      } 
     } 
    } 

});

來源

2012-06-01 10:27:18

謝謝。它來了。正如我添加onItemDisclosure：true，它添加按鈕。但在該按鈕後，一個小的垂直線或補丁即將到來。 –

請使用屏幕截圖更新您的問題 –

圓形列表不滾動直到結束sencha touch 2

回答

相關問題