多個項目sencha輪播

Question

你好

我無法通過旋轉木馬到達想要的地方。 這適用於iPhone / iPad Web應用程序。

基本上，我想在輪播中顯示上一張和下一張商品卡片的一部分。 因為一張圖片值一千個單詞，所以這是我想要獲得的最終視圖：

與appStore中的應用預覽屏幕截圖相同。

我嘗試了很多事情，但到目前為止沒有任何工作。

任何提示都很棒：)謝謝！

Answer 1

如果您將輪播頁面3推到一頁上，並且要增加間距（邊距或填充）以產生效果，那絕對有可能。

在此階段，沒有公開的多項目輪播示例（一頁），但是有可能，我目前正在研究多項目輪播。 我添加了頁邊距和填充以在一頁上獲得15張縮略圖。

:-)

Answer 2

您可以使用旋轉木馬的set itemLength屬性，

Ext.create('Ext.Carousel', {
        fullscreen: true,
         itemLength: 250, // **you can change value as you want**
        defaults: {
            styleHtmlContent: true
        }, 
        items: [
            {
                html: 'item1',
                style: 'background-color:red;'
            }, {
                html: 'item2',
                style: 'background-color:white;'
            }, {
                html: 'item3',
                style: 'background-color:gray;'
            }, {
                html: 'item4',
                style: 'background-color:blue;'
            }, {
                html: 'item5',
                style: 'background-color:yellow;'
            }
        ] 
    }); 

Answer 3

請參閱此博客文章，在其中對其進行解釋：

http://www.sencha.com/blog/using-the-leap-motion-controller-with-sencha-touch/

他們在代碼中使用了此代碼：

itemLength: browserWidth * 0.8.

Answer 4

有一個Coverflow插件可用，它不完全相同，但相似。 在此處查看演示：

http://twomonkeys.com.ar/lab/cover/

您可以在此處獲取源代碼：

https://github.com/elmasse/Ext.ux.Cover