使用Sencha在Android离线HTML5应用中加载动态图像

时间:2014-09-01 08:57:33

标签: android html5 image extjs assets

美好的一天。 我遇到了一个奇怪的问题,经过大量的谷歌搜索,我无法找到解决方案/答案

我正在为Android创建和Sencha + cordova app。

它只是循环显示10个图像。 我的代码在桌面Chrome浏览器上工作正常。 当我安装为APK时,它在Android 4.4.2设备上失败。 请帮忙修复android的代码。

    init: function () {
            this.callParent(arguments);
            //console.log('init');
            if(Ext.os.name == 'Android')
                baseurl = baseAndroidUrl;
            else 
                baseurl = baseDesktopUrl;

                //alert('baseurl ' + baseurl);
        }

    var baseurl;
    var baseAndroidUrl = 'file:///android_asset/www/resources/resources/images/';
    var baseDesktopUrl = '/resources/resources/images/';
    var imageArray = 
            ['page00.jpg', 
            'page01.jpg',
            'page02.jpg',
            'page03.jpg',
            'page04.jpg',
            'page05.jpg',
            'page06.jpg',
            'page07.jpg',
            'page08.jpg',
            'page09.jpg',
            'page10.jpg'];

    var counter = 0; 
    -----------------------------------------------
    onPrePageCommand: function () {

            console.log('onPrePageCommand');

             if( counter === 0 )
            return ;
            counter--;
            // Folloing dynamic updation doesn't work in android , works perfectly on desktop 
            Ext.getCmp('pageID').setSrc(baseurl+imageArray[counter]);
                     //Ext.getCmp('pageID ').doLayout();

        },
        onNextPageCommand: function () {

            console.log('onNextPageCommand');
            if( counter === imageArray.length-1 )
            return ;
            counter++;
            Ext.getCmp('pageID').setSrc(baseurl+imageArray[counter]);


        },
    ------------------------------------------
    //initial view : work perfect for both Desktop browser and APK 
    {
                xtype: 'image',
                src:'resources/images/Page00.jpg',
                id:'pageID',
                mode:'image'
                height:'100%',
                width:'100%'
            }
    --------------------------------------------

1 个答案:

答案 0 :(得分:0)

尝试使用类似http://wowslider.com/的框架,这最后一次对我很有用。您也可以用手指滚动图像(滑动它们)。