嗨,我已经使用 Sencha touch2 完成了应用程序。在轮播中,我们在控制器级别从 Web 服务动态绑定图像。当我们在轮播中移动/滑动图像时,下一张图像需要时间来加载/显示在轮播中。如果加载原始图像需要时间,那么它将在轮播中显示默认加载蒙版。根据我们的要求,如果在滑动轮播时加载原始图像需要时间,我们需要在轮播中显示默认图像。加载原始图像后,无需显示默认图像,显然加载蒙版也将消失。谁能告诉我如何实现这个煎茶 touch2?
我的查看页面代码:
Ext.define('SLS.BRND.WEB.view.ProjectsView', {
extend: 'Ext.Panel',
requires: [
'Ext.Carousel'
],
id: 'projectprofile',
xtype: "projectspage",
config: {
autoDestroy: true,
fullscreen: true,
layout: {
type: 'vbox'
},
items: [{
xtype: 'panel',
layout: 'fit',
flex: Ext.os.is.Phone ? 5 : 5,
items: [{
xtype: 'carousel',
direction: 'horizontal',
directionLock: true,
id: 'ImgId',
flex: Ext.os.is.Phone ? 5 : 5,
config: {
fullscreen: true
}
}]
}]
}
});
我的控制器页面代码:
var retrievedObject = localStorage.getItem('ProjectDetails');
jsonObj = Ext.decode(retrievedObject);
var cmp = Ext.getCmp('ImgId');
if (jsonObj != null) {
if (jsonObj != null) {
var itemsoverlay = [];
if (jsonObj.ProjectMainGalleryRoyalGardenia != null) {
for (var i = 0; i < jsonObj.ProjectMainGalleryRoyalGardenia.length; i++) {
var imgURL = jsonObj.ProjectMainGalleryRoyalGardenia[i].ImageUrl;
var senchaIoProjectImageURL = imgURL;
var senchabigImage = imgURL;
var images = [{ url: senchaIoProjectImageURL, bigUrl: senchabigImage}]
Ext.each(images, function (picture) {
var img = picture.url;
var bigImg = picture.bigUrl;
itemsoverlay.push({
xtype: 'label',
html: '<div style="width:' + window.innerWidth + 'px;height:' + SLS.BRND.WEB.Common.Constants.carouselCanvasHeight + 'px;"><img src=' + img + ' style="width:100%;height:100%"/></div>'
});
});
}
}
cmp.setItems(itemsoverlay);
cmp.setActiveItem(0);
}
}