Re: Image jumps when trying to position it in the centre

[Piotr Zarzycki]

Hi,

Can you create some spinner ? Once loading will be done you will hide it.
MDL module has Spinner, but not sure whether you can use that module in
your app.

Thanks, Piotr

2017-11-20 2:42 GMT+01:00 Justin Mclean <jus...@classsoftware.com>:

> Hi,
>
> This code:
>
> <?xml version="1.0" encoding="utf-8"?>
> <js:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
>                 xmlns:js="library://ns.apache.org/royale/basic"
>                 applicationComplete="init()">
>
>     <fx:Script><![CDATA[
>         public function init():void {
>             image.addEventListener("layoutNeeded", resetImage);
>         }
>
>         public function changeImage():void {
>             image.src = "http://apache.org/img/flex.jpg";;
>         }
>
>         public function resetImage():void {
>             holder.dispatchEvent(new Event("layoutNeeded"));
>         }
>         ]]></fx:Script>
>
>     <js:valuesImpl>
>         <js:SimpleCSSValuesImpl/>
>     </js:valuesImpl>
>
>     <js:initialView>
>         <js:View width="100%" height="100%">
>             <js:beads>
>                 <js:VerticalLayout />
>             </js:beads>
>             <js:Label text="Here's the ASF logo" />
>             <js:Container id="holder" width="520" height="300">
>                 <js:style>
>                     <js:SimpleCSSStyles backgroundColor="#333333" />
>                 </js:style>
>                 <js:Image id="image" src="http://apache.org/img/
> asf_logo.png">
>                     <js:beads>
>                         <js:CenterElement />
>                     </js:beads>
>                 </js:Image>
>             </js:Container>
>             <js:TextButton text="Change Image" click="changeImage()" />
>         </js:View>
>     </js:initialView>
>
> </js:Application>
>
> Has a visual jump of the image from the bottom right when the image is
> loaded to the centre when the image is centred. Anyone know of any way to
> stop this from happening or any suggestions on what might be done to fix it?
>
> The two images are different height and width so while setting those
> properties fixes the jumping issue it also stretches the second image which
> is less than desirable.
>
> I’ve tried setting the images visibility to true/false but that doesn’t
> seem to get around the issue.
>
> Thanks,
> Justin




-- 

Piotr Zarzycki

Patreon: *https://www.patreon.com/piotrzarzycki
<https://www.patreon.com/piotrzarzycki>*