Question

我一直在努力让FXG在我的Flex应用程序中运行，它可以正常运行，但我想要完成的是一种包含数据库中图像数据的图库。我曾经能够使用<s:Image source=/path/{variable_name}>，但现在我必须导入FXG文件，不能再使用<s:Image>了。在这里，我可以显示静态FXG图像：

<?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"
        xmlns:fxg="assets.fxg.*"
        tabBarVisible="false" title="{data.name}">

    <fxg:megapicture001 x="118" y="27" width="338" height="519"/>

    <s:Label x="78" y="43" text="{data.name}"/>

    <s:navigationContent>
        <s:Button icon="@Embed('assets/home.png')" click="navigator.popView()"/>
    </s:navigationContent>

</s:View>

尝试<fxg:{data.picturename} />爆炸。

Answer 1

您不能单独导入和使用FXG元素，因为它们不是显示对象。我的想法是将它们包装在UIComponent容器中。这个课程最有可能在明年年初的下一次更新中作为Flextras Mobile Component set的一部分结束：

package com.dotcomit.utils
{
    import flash.display.DisplayObject;
    import flash.display.Sprite;

    import mx.core.UIComponent;

    public class FXGImage extends UIComponent
    {
        public function FXGImage(source:Class = null)
        {
            if(source){
                this.source = source;
            }
            super();
        }

        // this will tell us the class we want to use for the display
        // most likely an fxgClass
        private var _source : Class;
        protected var sourceChanged :Boolean = true;

        public function get source():Class
        {
            return _source;
        }

        public function set source(value:Class):void
        {
            _source = value;
            sourceChanged = true;
            this.commitProperties();
        }

        public var imageInstance : DisplayObject;

        // if you want to offset the position of the X and Y values in the 
        public var XOffset :int = 0;
        public var YOffset :int = 0;

        // if you want to offset the position of the X and Y values in the 
        public var heightOffset :int = 0;
        public var widthOffset :int = 0;


        override protected function createChildren():void{
            super.createChildren();
            if(this.sourceChanged){
                if(this.imageInstance){
                    this.removeChild(this.imageInstance);
                    this.imageInstance = null;
                }

                if(this.source){
                    this.imageInstance = new source();
                    this.imageInstance.x = 0 + XOffset;
                    this.imageInstance.y = 0 + YOffset;
                    this.addChild(this.imageInstance);
                }
                this.sourceChanged = false;

            }
        }

        override protected function commitProperties():void{
            super.commitProperties();
            if(this.sourceChanged){
                // if the source changed re-created it; which is done in createChildren();
                this.createChildren();
            }
        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
            super.updateDisplayList(unscaledWidth, unscaledHeight);
            if(unscaledHeight != 0){
                this.imageInstance.height = unscaledHeight + this.heightOffset;
            }
            if(unscaledWidth != 0){
                this.imageInstance.width = unscaledWidth + this.widthOffset;
            }
        }

    }
}

您可以使用以下内容：

<utils:FXGImage id="fxgImage" source="assets.images.mainMenu.MainMenuBackground" height="100%" width="100%" />

在Flex中按变量名称嵌入FXG文档

1 个答案: