煎茶触摸转盘2取向变化

我有一个carousel显示的ImageViewer项列表在煎茶触摸2/PhoneGap的应用程序管理取向的变化的问题。煎茶触摸转盘2取向变化

当我打开carousel万事大吉。如果我改变设备的方向（在Chrome中通过Ripple插件或在iPhone4S上），布局会自行调整。当改变方向后，我刷卡到下一个图像

出现问题。这已经被预先加载并且位于为之前的方向定尺寸的容器中，所以布局是混乱的。

enter image description here

需要注意的是，如果我一直滑动到下一个图像布局再次正确，因为我只carousel预装单个图像。

我设法拦截changeorientation事件Ext.Viewport对旋转木马采取行动来解决此问题，我尝试触发旋转木马和ImageViewer上的resize事件，但都没有成功。我也试过每次转盘更改activeItem触发对Ext.Viewport的changeorientation事件，但没有任何工作。你有什么想法可以解决这个问题吗？

来源

2013-03-19 Andrea Casaccia

我通过在转盘中每个项目迭代，并呼吁orientationchange的视口烧制后的图像浏览器项目调整大小（）方法来解决它。我的功能如下所示：

handleOrientationChange: function(viewport, orientation, width, height){ 
    var items = this.getItems(); 
    for (var i=0;i<items.getCount();i++){ 
     var obj = items.getAt(i); 
     if (obj instanceof Ext.view.ux.ImageViewer){ 
      console.log("Resize"); 
      obj.resize(); 
     } 
    } 
}

您需要验证该项目是否为Imageviewer。传送带指示符也会返回到ItemCollection中。

我不是100％肯定这是最有效的方式，但它确实工作。

来源

2013-03-27 22:29:21 GerryL

非常感谢你@GerryL，我也尝试调整ImageViewers但我的解决方案并没有在我是如何迭代，因为一个错误的工作由getItems（）返回的ItemCollection。 – 2013-03-28 08:20:29

您可以在.css文件添加此

.my-carousel-item{background:url(images/loading.png) no-repeat center center}@media screen and (orientation: portrait){.my-carousel-item-img{background-size:100% auto}}@media screen and (orientation: landscape){.my-carousel-item-img{background-size:auto 100%}}.x-portrait .my-carousel-item-img{background-size:100% auto}.x-landscape .my-carousel-item-img{background-size:auto 100%}.my-carousel-item-img{background-position:center center}.x-carousel-indicator>*{background-color:orange !important;opacity:0.4}.x-carousel-indicator>.x-carousel-indicator-active{opacity:1}

来源

2014-09-24 13:42:14

煎茶触摸转盘2取向变化

回答

相关问题