多件煎茶旋转木马

Posted 2023-02-25

【中文标题】多件煎茶旋转木马

【英文标题】：Multiple items sencha carousel

【发布时间】：2011-11-10 16:30:14

【问题描述】：

嗨，

我无法通过旋转木马到达我想要的地方。这是针对 iPhone / iPad 网络应用程序的。

基本上我想在轮播中显示我上一个和下一个项目卡片的一部分。因为一张图片值一千字，这是我想要获得的最终观点：

与 appStore 中的应用预览截图相同。

我尝试了很多东西，但到目前为止没有任何效果。

任何提示都会很棒 :) 谢谢！

【问题讨论】：

:您好，请问您有什么解决方案在 iphone 和 android 上都能正常运行吗？谢谢！！

遗憾的是，我以一个简单的旋转木马结束了。我对煎茶非常失望，现在我又回到了本地。

【参考方案1】：

如果您要将轮播页面 3“推”到一个页面上，并且间距（边距或内边距）较高以产生效果，这绝对是可能的。

现阶段没有多项目（在一页上）轮播的公开示例，但这是可能的，我目前正在研究多项目轮播。我添加了边距和内边距，以在 1 页上实现 15 个缩略图。

:-)

【讨论】：

我当时尝试使用填充，但无法正常工作

【参考方案2】：

有一个不完全相同但相似的coverflow插件可用。在此处查看演示：

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

您可以在这里获取源代码：

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

【讨论】：

谢谢，但这不是我想要的效果。看起来很简单，但还是找不到解决办法。

【参考方案3】：

您可以使用 Carousel 的 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;'
            
        ] 
    ); 

【参考方案4】：

查看这篇博文，他们对此进行了解释：

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

他们在代码中使用了这个：

itemLength: browserWidth * 0.8.