AIR - StageWebView on iPhone - AIR - StageWebView on iPhone 小贝子编程网

我正在使用Flash Builder 4.5构建一个iPhone应用程序。

为了显示广告，我计划使用StageWebView并加载一个包含广告代码的网页。

假设广告将是320x50像素。所以Actionscript代码看起来像这样:

adView = new StageWebView();
adView.loadURL("http://www.myadishere.com/ad.html");
var top:Number = navigator.actionBar.measuredHeight + 1
adView.viewPort = new Rectangle(0, top, 320, 50);
adView.stage = stage;

在应用程序中，我设置了applicationDPI="160"，以便应用程序在iPhone3和iPhone4上运行时正确显示。然而，StageWebView的内容在iPhone4上看起来很小。如果我做adView.drawViewPortToBitmapData()位图的大小是OK的。

所以问题是如何使StageWebView内容相应地缩放，所以不管屏幕DPI如何，它看起来都很好?

 You need to scale by yourself. Here is sample code.

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" width="100%" height="100%" top="0">
    <fx:Declarations>
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.core.FlexGlobals;
            import mx.core.IVisualElement;
            import mx.events.FlexEvent;
            import spark.components.View;
            import spark.events.ViewNavigatorEvent;
            [Bindable]
            public var htmlText:String;
            public var url:String;
            private var swv:StageWebView;
            private function resizeSWV():void{
                var currentFlexScalingFactor:Number=FlexGlobals.topLevelApplication.runtimeDPI/FlexGlobals.topLevelApplication.applicationDPI;
                if(swv!=null){
    //swv.viewPort=new Rectangle(0, stage.stageHeight-height*currentFlexScalingFactor-FlexGlobals.topLevelApplication.tabbedNavigator.tabBar.height*currentFlexScalingFactor,width*currentFlexScalingFactor,height*currentFlexScalingFactor);
    swv.viewPort=new Rectangle(0, systemManager.screen.height*currentFlexScalingFactor-height*currentFlexScalingFactor-FlexGlobals.topLevelApplication.tabbedNavigator.tabBar.height*currentFlexScalingFactor,width*currentFlexScalingFactor,height*currentFlexScalingFactor);
                }
            }
        ]]>
    </fx:Script>
    <s:creationComplete>
        <![CDATA[
        swv=new StageWebView();
        resizeSWV();
        swv.stage=stage;

        var htmlString:String=htmlText;
        var urlL:String=url;
        swv.loadURL(url);
        (owner as View).addEventListener(ViewNavigatorEvent.REMOVING,
        function(event:ViewNavigatorEvent):void{
            swv.viewPort=null;
            swv.dispose();
            swv=null;
        }
        );
        ]]>
    </s:creationComplete>
    <s:resize>
        resizeSWV();
    </s:resize>
</s:Group>
 This is for TabbedViewNavigatorApplication.

尝试将以下代码添加到您的HTML中，在<head>部分:

<meta name="viewport" content="width=XXXpx, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

用你的banner/StageWebView的宽度替换"XXX"这将使图片显示为您想要的大小。

@OMA我认为StageWebView有一点bug。当(在HTML中)我输入:

<meta name="viewport" content="initial-scale=x.x">

iPhone应用程序崩溃。任何"…-scale'会使应用程序崩溃。-scale'指令运行正常。

我现在的代码是:

<meta name="viewport" content="width=320px, height=50px, user-scalable=no"> 
<style type="text/css">
body, html {margin: 0 0; padding: 0 0; overflow: hidden;}
body {width: 320px; height: 50px;}
html {height: 50px;}

它的工作- ADL显示内容在不正确的大小，但在大多数情况下，iPhone本身显示广告，它应该是。然而，有时广告显示在一半的大小-不确定为什么-它是完全相同的HTML页面和相同的代码所有的时间，但广告显示的方式不同

我是这样做的:

<?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" 
viewActivate="openSWV(event)"
viewDeactivate="closeSWV(event)">
    <s:states>
        <s:State name="portrait"/>
        <s:State name="landscape"/>
    </s:states> 
    <s:navigationContent>
        <s:Button icon="@Embed('assets/icons/back.png')" label.landscape="Back" click="navigator.popView()"/>
    </s:navigationContent>
    <s:titleContent>
        <s:Label text="Help" color="#FFFFFF" textAlign="center" fontWeight="bold" width="100%" />
    </s:titleContent>
    <fx:Declarations>
        <fx:String id="_help">
            <![CDATA[
            <html>
            <body>
            <p>Blah blah blah</p>
            </body>
            </html>
            ]]>
        </fx:String>
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.core.FlexGlobals;
            import mx.events.FlexEvent;
            import flash.media.StageWebView;
            private var _swv:StageWebView;
            private function openSWV(event:Event=null):void {
                _swv = new StageWebView();
                stage.addEventListener(Event.RESIZE, resizeSWV);
                _swv.stage = stage;
                resizeSWV();
                _swv.loadString(_help, 'text/html');
            }
            private function closeSWV(event:Event=null):void {
                stage.removeEventListener(Event.RESIZE, resizeSWV);
                if (! _swv)
                    return;
                _swv.dispose();
                _swv = null;
            }           
            private function resizeSWV(event:Event=null):void {
                if (! _swv)
                    return;
                var scale:Number = FlexGlobals.topLevelApplication.runtimeDPI / FlexGlobals.topLevelApplication.applicationDPI;
                // align to the right-bottom corner
                _swv.viewPort = new Rectangle(stage.stageWidth - scale * width, stage.stageHeight - scale * height, scale * width, scale * height);
            }
        ]]>
    </fx:Script>
</s:View>

我对齐到右下角，因为我使用了SplitViewNavigator。

如果你只想对齐到底部，只需使用:

_swv.viewPort = new Rectangle(0, stage.stageHeight - scale * height, scale * width, scale * height);

首先，为什么需要手动设置DPI ?问题是iphone 4的DPI远高于160(我认为是160的两倍，但不要相信我的话)。为什么不根据相对值(百分比)调整应用程序的大小，甚至根据分辨率设置不同的布局呢?你总是可以检查Capabilities.pixelAspectRatio，看看dpi是什么，并相应地改变。

再次强调，如果是我，我会在大多数事情上使用百分比。

AIR - StageWebView on iPhone

相关内容

最新更新

热门标签：