Comment la position de l'étincelle de la Liste de contrôle ci-dessous StageWebView en Flex Mobile

Question

Je développe une application mobile pour iOS et Android à l'aide de Flex Mobile.Sur l'un des points de vue je suis de l'affichage de StageWebView avec une carte Google map et une étincelle de la Liste de contrôle pour afficher les données d'un autre.Je suis l'aide de la StageWebView afin de bénéficier de Google Maps JavaScript API v3.Exemple de code ci-dessous:

<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" title="Clubs" backgroundAlpha="0"
    viewActivate="view1_viewActivateHandler(event)"
    backKeyPressed="view1_backKeyPressedHandler(event)"
    initialize="view1_initializeHandler(event)">

<fx:Script>
    <![CDATA[
        import flash.sensors.Geolocation;

        import mx.collections.ArrayCollection;
        import mx.events.FlexEvent;

        import spark.events.ViewNavigatorEvent;
        private var myWebView:StageWebView;
        [Bindable]
        private var locations:ArrayCollection;
        private var geolocation:Geolocation;

        protected function view1_initializeHandler(event:FlexEvent):void
        {
            myWebView = new StageWebView();
            myWebView.stage = this.stage;
        }

        protected function view1_viewActivateHandler(event:ViewNavigatorEvent):void
        {   
            if(Geolocation.isSupported)
            {
                geolocation = new Geolocation();
                geolocation.addEventListener(GeolocationEvent.UPDATE, onGeolocationChange);
            }
        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{

            super.updateDisplayList(unscaledWidth, unscaledHeight);

            if (myWebView) {
                var point:Point = (new Point());
                point = localToGlobal(point);
                myWebView.viewPort = new Rectangle(point.x,point.y, stage.width,stage.height/3);
            }
        }

        protected function view1_backKeyPressedHandler(event:Event):void
        {
            if (myWebView) 
            {
                myWebView.viewPort = null;
                myWebView = null;
            }

            navigator.popView();
        }

        protected function onGeolocationChange(event:GeolocationEvent):void
        {
            geolocation.removeEventListener(GeolocationEvent.UPDATE, onGeolocationChange);

            locations = new ArrayCollection();
            var location0:Object = new Object();
            location0.lat = event.latitude;
            location0.long = event.longitude;
            locations.addItem(location0);
            var location1:Object = new Object();
            location1.lat = "42.697325";
            location1.long = "23.315364";
            locations.addItem(location1);
            var location2:Object = new Object();
            location2.lat = "42.696441";
            location2.long = "23.321028";
            locations.addItem(location2);



            var url:String = "http://whozzzin.dev.mediatecture.at/gmapsformobile/map.php";

            var counter:Number = 1;

            for each(var location:Object in locations)
            {
                if(counter == 1)
                {   
                    url += "?locations["+counter.toString()+"][lat] = " + location.lat;
                    url += "&locations["+counter.toString()+"][long] = " + location.long;
                }
                else
                {
                    url += "&locations["+counter.toString()+"][lat] = " + location.lat;
                    url += "&locations["+counter.toString()+"][long] = " + location.long;
                }
                counter++;
            }

            myWebView.loadURL(url);

        }


    ]]>
</fx:Script>

<s:navigationContent>
    <s:Button includeInLayout="{Capabilities.version.indexOf('IOS') > -1}" visible="{Capabilities.version.indexOf('IOS') > -1}" id="backButton" label="BACK" click="view1_backKeyPressedHandler(event)"/>
</s:navigationContent>

<s:List width="100%" contentBackgroundAlpha="0" id="placesList" dataProvider="{locations}" labelField="lat">
    <s:layout>
        <s:TileLayout columnWidth="{(width - 16)/3}"/>
    </s:layout>
</s:List>

</s:View>

Actuellement, la liste n'est pas visible car il apparaît derrière le StageWebView.Ma question est comment la position de la Liste de contrôle exactement après la WebStageView.

Answer 1

Comment je résolvai-je:

Je reçois le bas de la site WebView et convertissez un nouveau point de Global en local avec x= 0 et y= myWebView.bootom:

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{

            super.updateDisplayList(unscaledWidth, unscaledHeight);

            if (myWebView) {
                var point:Point = (new Point(0,this.radiusDropDown.height));
                point = localToGlobal(point);
                myWebView.viewPort = new Rectangle(point.x,point.y, stage.width,stage.height/3);
                this.placesList.y = globalToLocal(new Point(0,myWebView.viewPort.bottom)).y;

            }
        }

Answer 2

Vous pouvez utiliser l' top contrainte:

<s:List width="100%" top="{stage.height/3}" id="placesList"

Edit:Mettre dans un trace(stage.height); dans votre updateDisplayList la fonction et aussi regarder stage.stageHeight.Ces valeurs devraient vous aider à comprendre exactement top la valeur à utiliser dans ce cas.