ログイン
ユーザ名:

パスワード:


パスワード紛失

新規登録
メインメニュー
フォーラム一覧   -   トピック一覧
   超ビギナー
     swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
投稿するにはまず登録を

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 トピック
o2mk
投稿日時: 2008-4-24 18:08
やや 常連さん
登録日: 2008-4-24
居住地:
投稿: 21
swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
初めて質問させて頂きます。
o2mkです。

私は今、swfの下にあるHTMLのリンクなどを押せるようにする方法を探しています。

backgroundAlpha="0.0"と、wmode=transparentを利用して、swfを透過して下のHTMLが見えるようにはできたのですが、HTMLにあるリンクなどを押せるようにもしたいと思っています。

参考までに、具体的に作りたいものを説明しますと、以下のようなものです。
・HTMLの文章が書いてある上に、マーカーで線を引けるアプリ。
・編集モード時は、マウスのドラッグで色線を引くことができる。
・参照モード時は、色線以外の部分は、通常と同じようにHTMLリンクなどを押せるようにしたい。


swfファイルはFlexBuilder3で作っています。
swfとHTMLリンクはそれぞれdivの中にあり、swf側のdivのstyleにposition:absoluteを設定して重ねてあります。

使用ユーザーが限定されるアプリですので、まずはIEで動けば問題ありません。
HTMLリンクが押せる範囲は、背景部分(<mx:Application>のみが存在する範囲)のみで問題ありません。

自分で調べた範囲では、Flexでは無いただのFlash(?)では、背景部分で下にあるHTMLが操作できることを確認できています。
参考URL:http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_14201&sliceId=1
(↑ここにあるサンプルでは、背景部分で右クリックすると、HTMLのメニューが出てくるので、HTMLを操作できているようです。)

しかし、Flexで作ったswfだと後ろのHTMLを操作することができません。

実際に、同じobjectタグで、Flexで作ったswfと、ネットでダウンロードした背景透過のFlashを表示してみたのですが、Flex側はHTMLリンクが押せないのに対して、Flashの方はHTMLリンクは押すことができました。

この問題を解決する方法は無いのでしょうか?
御助言頂きたいと思っております。
よろしくお願いいたします。
Pepe
投稿日時: 2008-4-30 7:05
モデレータ
登録日: 2006-1-10
居住地:
投稿: 1274
Re: swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
HTMLソースにSWFの下に描画されているテキストが無いので
参考 URL はなんか特殊なことをしてるっぽいですね ^_^;

基本的に Flex も Flash CS3 も SWF になってしまえば同じです
参考 URLがしているような特殊なことをすればできるはずです


----------------

o2mk
投稿日時: 2008-4-30 10:17
やや 常連さん
登録日: 2008-4-24
居住地:
投稿: 21
Re: swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
回答ありがとうございます。

>基本的に Flex も Flash CS3 も SWF になってしまえば同じです
>参考 URLがしているような特殊なことをすればできるはずです。
私もそう思ってやり方を探しているのですが、未だに実現できていません。

参考まにで、以下のバンダイのページのまめっち(?)もswfですが、まめっちと吹き出しの間のHTMLをクリックしたりできます。
http://www.bandai.co.jp/top.html
(このページで「さがす たのしむ しる」を選ぶとまめっちが前面に表示されたHTMLが見れます)

Flashの方で頑張ってロジックを作る、という手もありますが、できればFlexで作りたいと思っています。

もう少し調べてみます。
neworder
投稿日時: 2008-4-30 18:28
ご主人様
登録日: 2007-7-14
居住地: 東京
投稿: 176
Re: swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
application の初期化終了後、以下のような状態となります。
marker というコンポーネントを作ったとします。

stage - Stage
  root - SystemManager
    *mouseCatcher - FlexSprite
     application - Application
        *border - HaloBorder
        *ApplicationBackgroundXX - ApplicationBackground
         marker - UIComponent
        *backgroundMask - FlexShape

(*) のついたDisplayObject が透過をさえぎっていると考えられます。したがって、これらをすべて visible = false にすると
背後の HTML にイベントが届くようになります。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"    applicationComplete="app()">
    <mx:Script>
        <![CDATA[
            import mx.managers.SystemManager;
            import flash.display.Shape;

            private function app():void
            {
                var sm:SystemManager = systemManager as SystemManager;
                var o:DisplayObject = sm.getChildByName("mouseCatcher");
                o.visible = false;
                
                for (var n:int = 0; n < rawChildren.numChildren; n++)
                {
                    o = rawChildren.getChildAt(n);
                    if (o.name == "border"
                        || o.name == "backgroundMask"
                        || o.name.indexOf("ApplicationBackground") == 0)
                        o.visible = false;
                }
            }
            override protected function createChildren():void
            {
                super.createChildren();
                create(0, 0, 30);
                create(60, 0, 30);
            }
            private function create(px:Number, py:Number, w:Number):void
            {
                var shape:Shape = new Shape();
                var g:Graphics = shape.graphics;
                g.beginFill(0xffff44);
                g.drawRect(0, 0, w, 15);
                g.endFill();
                shape.x = px;
                shape.y = py;
                shape.alpha = 0.7;
                marker.addChild(shape);
            }
        ]]>
    </mx:Script>
    <mx:UIComponent id="marker"/>
</mx:Application>


背景は透過なので、border, ApplicationBackground, backgroundMask は visible=false でも
問題ないと思います。
mouseCatcher は application 領域外の MOUSE_UP イベントを拾うためのもののようなので、
その関連の問題がおきるかもしれません。参考になれば幸いです。
o2mk
投稿日時: 2008-5-1 10:37
やや 常連さん
登録日: 2008-4-24
居住地:
投稿: 21
Re: swf(Flex)の下にあるHTMLリンクをクリックできるようにしたい
neworderさん、回答ありがとうございます。

こ、これはすごい!できました!!
これでFlexでの開発を進めていけそうです。

Applicationの設定は調べたのですが、初期化終了後の状態まで頭がまわっていませんでした。

助かりました。
本当にありがとうございました。

スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ

投稿するにはまず登録を