Flex Mobile StageWebView not displaying

Question

I'm having issue on displaying the StageWebView on Flex Mobile 4.6 (Flash Builder 4.6), when I created it dynamically, the events are called properly but nothing is visible, here's my code:

<components:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
             xmlns:s="library://ns.adobe.com/flex/spark" 
             xmlns:components="spark.components.*" 
             actionBarVisible="false"
             title="ActivityView"
             creationComplete="init()"
             >
<components:layout>
    <s:BasicLayout/>
</components:layout>
<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
    <![CDATA[
        private var webView:StageWebView;

        protected function init():void {
            webView = new StageWebView();
            webView.stage = this.stage;
            webView.viewPort = new Rectangle(5, 20, screen.width-10, screen.height-40);
            webView.addEventListener(Event.COMPLETE, onURLLoadComplete);
            webView.addEventListener(LocationChangeEvent.LOCATION_CHANGE, onLocationChange);
            webView.loadURL("http://google.com");
        }

        protected function onURLLoadComplete(event:Event):void
        {
            trace("Load Complete");
        }

        protected function onLocationChange(event:LocationChangeEvent):void
        {
            trace("Location change: " + event.location);
        }

    ]]>
</fx:Script>
</components:View>

I managed to solved this finally, by creating the stagewebview after addedToStage is called. — stereo, Nov 14 '12 at 09:11

score 0 · Answer 1 · answered Jan 19 '13 at 01:53

0

webView.stage = this.stage;

When it's in creationComplete event handler, this.stage is still null.

You should put the init() inside of addedToStage event handler.

answered Jan 19 '13 at 01:53

Peter Lee

12,931
11
73
100

score 0 · Answer 2 · answered Apr 04 '13 at 15:05

0

You can use FlexGlobals.topLevelApplication.stage instead, so:

webView.stage = FlexGlobals.topLevelApplication.stage;

answered Apr 04 '13 at 15:05

Prometeus

1

score 0 · Answer 3 · answered Dec 19 '13 at 23:53

I think the safest way to add StageWebView is to add the StageWebView in createdChildren() (you have to define width and height of web view manually as the width and height of parent view will be 0) or during viewActiveEvent state.

Judah has written a very good WebView class which is much easier to use http://www.judahfrangipane.com/blog/2011/01/16/stagewebview-uicomponent/

Hope this helps

Gopinath Ravichandran · Answer 4 · 2014-05-27T05:32:55.863

You can use StageWebViewBridge for displaying HTML, and Javascript communication. I hope this will help you to display HTML in flex Web, as well as AIR application. In your code, stage is not set for StageWebView, you just assign the webView.stage = this.stage in addedToStage handler or use the below method to load html.

        private var webView:StageWebViewBridge;

        protected function addedToStageHandler(event:Event):void
        {
            StageWebViewDisk.addEventListener(StageWebviewDiskEvent.END_DISK_PARSING, onInit );
            StageWebViewDisk.setDebugMode( true );
            StageWebViewDisk.initialize(stage);
        }

        private function onInit(e:StageWebviewDiskEvent):void
        {
            if(!webView)
                webView = new StageWebViewBridge(0, 300, 900, 300);
            webView.addEventListener(StageWebViewBridgeEvent.DEVICE_READY, onDeviceReady );
            webView.addEventListener(Event.COMPLETE, onCompleteHandler);
            webView.addEventListener(ErrorEvent.ERROR, onErrorHandler);
            webView.addEventListener(LocationChangeEvent.LOCATION_CHANGING, onLocationChange);
            var _view:SpriteVisualElement = new SpriteVisualElement();
            _view.addChild(webView);
            addElement(_view);
            webView.loadURL("http://www.google.com");
        }

score 0 · Answer 5 · answered Mar 29 '14 at 18:24

0

You can add stage like this...

private var _stage : Stage;

private function added_to_stage_handler():void
{
     _stage = this.stage;
     initStage();
}
private function initStage() : void
{
     webView.stage = _stage;
}

answered Mar 29 '14 at 18:24

Gopinath Ravichandran

99
7

Flex Mobile StageWebView not displaying

5 Answers5