0

Facebook から取得したユーザー フィードを Flash アプリに動的に追加して処理しようとしています。そのフィードをボックスに表示し、その横に発行者名と画像を (通常どおり) 表示する必要があります。

問題は、それらの高さが分からない場合、それらを互いに並べて表示するにはどうすればよいかということです。高さを指定せずに互いの下に追加する方法はありますか? 互いの下に div を追加する html のように?

コンテンツがフラッシュウィンドウを超える場合にスクロールバーを追加する方法についての他の質問はありますか?

私はas3とフラッシュが初めてなので、アドバイスが役に立ちます..ありがとう..

私のコード:

        protected function getFeedsHandler(result:Object,fail:Object):void
        {
            if(result)
            {
                var i:Number;

                for(i=0;i<10;i++)
                    if(result[i])
                    {
                        var fdLbl= new Label();
                        addElementAt(fdLbl,1);

                        fdLbl.text=result[i].message;
                        fdLbl.x=20;
                        fdLbl.y=(i+2)*100;
                        fdLbl.width=400;

                        var fdImg= new Image();
                        addElementAt(fdImg,1);

                        fdImg.source=FacebookDesktop.getImageUrl(result[i].from.id,"small");
                        fdImg.x=20;
                        fdImg.y=(i+2)*80;
                        fdImg.width=400;

                        var nameLbl= new Label();
                        addElementAt(nameLbl,1);

                        nameLbl.text=result[i].from.name;
                        nameLbl.x=20;
                        nameLbl.y=(i+2)*90;


                    }
            }

インターフェース:

<s:Button id="loginoutBtn" right="10" top="10" label="Log out"
          click.loggedin="logout(event)"
          label.loggedout="Log in" click.loggedout="login(event)"/>
<s:Form includeIn="loggedin" left="70" top="10">
    <s:FormItem label="User">
        <s:Label id="nameLbl" text=""/>
    </s:FormItem>
    <s:FormItem label="birthday">
        <s:Label id="brthday"/>
    </s:FormItem>
    <s:FormItem label="feeds">
        <s:Image id="feedImg"/>
        <s:Label id="feedLbl" x="0"/>
        <s:Label id="statusLbl" width="405"/>
    </s:FormItem>
</s:Form>
<s:Image id="userImg" includeIn="loggedin" left="10" top="10" width="50"/>
4

1 に答える 1

0

つまり、Flexを使用しているように見え、具体的にはSparkコンポーネントを使用しているようです。Sparkを使用する場合、これを実現する方法についていくつかのオプションがあります。1つのオプションは、上記で作成したコンポーネントをVGroupに配置することです。VGroupは、ビジュアルコンポーネントを垂直にスタックします。これには、コンポーネント間の間隔（VGroupにネストされた各オブジェクト間のピクセル数）を追加または削除するために設定できるギャップと呼ばれるプロパティがあります。VGroupをラップするas：Scrollerコンポーネントを追加すると、スクロールバーが表示されます。基本的に、これが機能する方法は、s：Scrollerのサイズを表示したいサイズに設定することです（100％の幅/高さのようなパーセンテージにすることができます）ビュー/コンテナの）、VGroupに明示的なサイズを設定しない場合、VGroupは、ネストされたすべてのコンポーネントの高さに、パディングとギャップスペースを加えたものに等しい高さになるように拡張されます。スクローラーは、スクロールタブボタンの大きさを計算し、VGroupのscrollRectを調整します。あなたにとって、本質的にそれは魔法のように機能するでしょう:)。これは次のようになります。

<s:Scroller width="100%" height="100%">
    <s:VGroup id="loadedContentVGroup">
        <yourpackage:YourCustomComponent/>
    </s:VGroup>
</s:Scroller>

スクローラーの高さと幅を制限しないと、描画する領域が定義されていないため機能せず、子（ネストされたコンポーネント）と同じ大きさになります。おそらく、AS3のVGroupに要素を追加するので、おそらくIDを付けたいと思うでしょう。

もう1つのオプションは、スパークリストを使用してから、ビジュアルコンポーネントをitemRendererとして設定することです。リストのデータプロバイダー内の各データ要素（ある種のコレクションクラス、ArrayCollection、XMLCollectionなど）に対して、配列の要素をビジュアルコンポーネントの「data」プロパティとして設定します。次に、ビジュアルコンポーネントのデータプロパティへのバインディングを使用して、レンダラーが再利用/リサイクルされているかどうかを確認し、その中の要素が自動的に更新されます。その例を次に示します。

    <s:List dataProvider="{new ArrayCollection([{name:'Shaun', birthday:'04-28-1983', imageSource:'someImage.png'}])}"
            itemRenderer="views.YourCustomComponent"
            width="100%"/>

あなたの場合、リストのdataProviderは、上記の結果ハンドラーコードで割り当てることができます。結果は配列であるように見えるので、myList.dataProvider = new ArrayCollection（result）;のようにArrayCollectionでラップできます。

リスト内の単一のエントリ（上記で使用されているitemRendererクラス）の潜在的なビュー定義は次のとおりです。

[views.YourCustomComponent]

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009" 
          xmlns:s="library://ns.adobe.com/flex/spark"
          implements="mx.core.IDataRenderer">
    <fx:Script>
        <![CDATA[
            private var _data:Object;

            [Bindable(eventName="dataChanged")]
            public function get data():Object
            {
                return _data;   
            }
            public function set data(value:Object):void
            {
                if(_data == value)
                    return;
                _data = value;
                dispatchEvent(new Event("dataChanged"));
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:Label text="{data.name}"/>
    <s:Label text="{data.birthday}"/>
    <s:Image source="{data.imageSource}"/>
</s:VGroup>

これらの回答には確かに警告と代替案がありますが、これにより正しい方向に進むことができれば幸いです。モバイル開発でこれを行う場合は、モバイル用のレンダラーの作成に関する推奨事項を確認してください。ここでのアイデアは次のとおりです。モバイルでレンダラーを作成して再利用するために必要な処理を可能な限り減らし、CPUとメモリの負荷を軽減します。

もう1つ注意すべき点は、AS3とMXMLでビューを定義しているように見えることですが、技術的には問題ありませんが、少し混乱しているようです。通常、レイアウト全体をMXMLで定義するか、必要に応じて完全にAS3で定義します。MXMLで定義されており、コンポーネントをコードで条件付きで非表示にする必要がある場合は、visible/includeInLayoutプロパティを切り替えるだけです。これは単なる好みだと思いますが、2つの間を見てつなぎ合わせる必要がある場合、特定のレイアウトが発生する原因を特定するのは難しいようです。

使用されるクラスのAS3リファレンスへの参照：http： //help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/spark/components/VGroup.html

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/spark/components/Scroller.html

http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/spark/components/List.html

カスタムアイテムレンダラーの詳細http://help.adobe.com/en_US/flex/using/WS03d33b8076db57b9-23c04461124bbeca597-8000.html<-ジェフリーハウザーを参照して、名前がwww.flextras.comのSOの常連です。

于 2012-05-21T02:44:54.180 に答える