ubuntu-touch-coreapps team mailing list archive

[Joey Chan <qqworini@xxxxxxxxx>]

yep, a common plugin is necessary


2013/3/28 <mrqtros@xxxxxxxxx>

> Other teams need this ability too, so it is must be included in sdk and
> used this way:
>
> // qml code
>
> Ubuntu.saveImageToLocalStorage(...)
>
> ...
>
> Ubuntu.loadImageFromLocalStorage(...)
>
>
> Or something like that =)))
>
> 27.03.13 13:39 Joey Chan написал(а):
> Hi Ladies and Gentlemen,
>
> I'm here to discuss about the "offline image using pure qml", which means,
> If images are from remote server, we developers need to download them to
> local file system so that apps can load images without Internet connections.
>
> solution 1       ( failed )
>
> this solution use xmlhttprequest to download the whole image data, convert
> it to base64 string then show it to "Image"
>
> source code:
> var xhr = new XMLHttpRequest();
> xhr.overrideMimeType('text/plain; charset=x-user-defined');   // doesn't
> work in qml but html
> xhr.open("GET", "http://www.xxx.com/xxx.png";);
> xhr.onreadystatechange = function() {
>     if (xhr.readyState === 4) {
>         var blob = xhr.responseText ;
>                     var blobarray = new Array ;
>                     for (var i = 0, len = blob.length; i < len; ++i) {
>                         blobarray.push(blob.charCodeAt(i) & 0xff );
>                     }
> // then use        Image.source = "data:image/png;base64," +
>  blobarray.join("")     to show the image
>
>     }
> };
> xhr.send();
>
> This snippet shows an old way to download binary data using xmlhttprequest
> level 1, but not work in qml ( overrideMimeType not supported ) .
> Also, xmlhttprequest level 2 (support binary data) not supported by qml 2.0
>
> Conclusion: it's better update the xmlhttprequest to level 2
>
>
> solution 2:  (success but not perfect)
>
> This solution use qml2 canvas to load a remote url then save it to local
> file system.
>
> source code:
> property string url: "http://www.xxx.com/xxx.png";
>     Canvas {
>         id: mycanvas
>         y: 350
>         width: 200
>         height: 200
>
>      Component.onCompleted:
>     {
>         mycanvas.loadImage(url);
>     }
>
>         onImageLoaded:
>         {
>             console.log("onImageLoaded");
>             requestPaint();
>         }
>
>         onPaint: {
>             var ctx = mycanvas.getContext("2d");
>
>
>             ctx.drawImage(url, 0, 0);
>             ctx.restore();
>
>
>         }
>     }
>
> MouseArea
>         {
>             anchors.fill: parent
>             onClicked: mycanvas.save("./aaa.png");
>         }
>
>
> This solution can download every image, but, the final function "save"
> can't support "homepath" and "temppath", which means, we don't know where
> we can put the downloaded images such as "home"/.cache/coreapp/images/
>
> Conclusion: homepath is needed
>
>
>
> Feel free to prove I am wrong  :P  because I am confusing about the
> offline mode of the RSS reader Core App
>
> Have a nice day :)
>
>