flex 3将模块中的数据传递给父应用程序,以在视图中切换视图 [英] flex 3 passing data from modules to parent application to switch views in the viewstack

查看:167
本文介绍了flex 3将模块中的数据传递给父应用程序,以在视图中切换视图的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

你好伙伴stackoverflowers,

我正在写一段代码。
我有一个视图堆加载5个模块的应用程序。
每个模块通过moduleLoader标签加载,它们都有一个id。

每个加载的模块都有一个上下文菜单。上下文菜单有5个menuItems。
一个menuItem用于viewstack的每个视图。

上下文菜单通过xml加载。



这是我的应用程序文件。

 <?xml version =1.0encoding =utf-8?> 
layout =absolute
backgroundColor =#b1b1b1
backgroundGradientColors =[#b1b1b1,#252525]>

< mx:Script>
<![CDATA [
import mx.core.Container;


//通过模块上下文菜单更改viewstack视图
public function switchView(viewId:String):void
{
var container:Container = Container (tops.getChildByName(viewId));
if(container!= null)
{
tops.selectedChild = container;
}
}
]]>
< / mx:Script>

< mx:ViewStack id =topswidth =100%height =100%>
< mx:ModuleLoader id =communicatorurl =view / communicator.swfwidth =100%height =100%/>
< / mx:ViewStack>


< / mx:Application>

这是我的模块中的switch语句

  public function changeView():void {
switch(action){
caseadmin:
parentApplication.switchView(admin) ;
break;
casetv:
parentApplication.switchView(tv);
break;
caseshop:
parentApplication.switchView(shop);
break;
casecommunity:
parentApplication.switchView(community);
break;
casedefault:
parentApplication.switchView(communicator);
break;




$ b $这是我的上下文菜单xml

 < mx:XML id =appMenu> 
< root>
< menuitem label =Televisionaction =tvicon =tvMDI/>
< menuitem label =Shopping Mallaction =shopicon =shoppingMallMDI/>
< / root>
< / mx:XML>

我想要做的是通过单击其中一个菜单项来切换视图中的视图上下文菜单。
我无法从我的模块通信到应用程序。
我在做什么错?
我该怎么办?
有人可以帮我吗?

在忘记之前的Oyeah

上下文菜单的xml是在模块中,但上下文菜单是在一个文件,扩展一个按钮。

请任何机构给我一个很好的例子如何做到这一点。

p>

谢谢

DJ

解决方案首先,在你的changeView()函数中,你声明了变量action和然后打开它。

  public function changeView():void {
var action:String;
switch(action){
//此处的操作将始终为空。




$ b $因为你没有'default'的情况在你的switch语句中,parentApplication.switchView永远不会被调用。

另外,为了简洁起见,你可以写如下的switch语句:

  switch(action){
caseadmin:
parentApplication.changeView(admin);
break;
casetv:
parentApplication.changeView(tv);
break;
caseshop:
parentApplication.changeView(shop);
break;
// ...等等...
默认值:
//如果动作与任何东西不匹配,这个被调用。
break;



$ b $ p
$ b

最后,你可以节省更多的输入,因为你的动作和模块ID是同样的,你可以这样做:
$ b $ pre $ public function changeView(action:String):void {
parentApplication.changeView (行动);





$ b

也许试试这些事情,然后更新你的问题(也是你的XML上下文菜单没有在你的问题中正确呈现)。这可能会帮助社区解决您的问题更容易一些。

UPDATE



我不认为这个问题在模块通信中。我建立了一个简单的项目,做我认为你正在寻找的东西。



mmodules.mxml

 <?xml version =1.0encoding =utf-8?> 
< mx:Script>
<![CDATA [
import mx.core.Container;
public function changeView(action:String):void {
viewstack.selectedChild = viewstack.getChildByName(action)as Container;
}
]]>
< / mx:Script>
< mx:ViewStack id =viewstackwidth =100%height =100%>
< mx:ModuleLoader id =module1url =views / module1.swf/>
< mx:ModuleLoader id =module2url =views / module2.swf/>
< / mx:ViewStack>
< / mx:Application>

interfaces / IApplication.as

  package interfaces {
public interface IApplication {
function changeView(action:String);


code

$ p views / module1.mxml

 <?xml version =1.0encoding =utf-8?> 
< mx:Script>
<![CDATA [
import interfaces.IApplication;
导入mx.events.MenuEvent;
导入mx.controls.Menu;
/ **
*动态构建菜单。
* /
protected function showMenu():void {
var m:Menu = Menu.createMenu(null,menuData,false);
m.labelField ='@label';
m.addEventListener(MenuEvent.ITEM_CLICK,onItemClick);
m.show(10,10);
}
/ **
*每当菜单中的一个项目被点击时处理。 (e:MenuEvent):void {
if(e& e.item&& e.item is XML){
protected function onItemClick changeView(e.item @动作。);
}
}
/ **
*指示父应用程序切换视图。
* /
保护函数changeView(action:String):void {
var app:IApplication = parentApplication as IApplication;
switch(action){
case'module1':
app.changeView('module1');
break;
case'module2':
app.changeView('module2');
break;
}
}
]]>
< / mx:Script>
< mx:XML format =e4xid =menuData>
< root>
< menuitem label =Module 1action =module1/>
< menuitem label =Module 2action =module2/>
< / root>
< / mx:XML>
< mx:Button label =Show menuclick =showMenu()/>
< / mx:Module>

希望有帮助。


Hello Fellow stackoverflowers,

I´m stuck writing a piece of code. I have application with a viewstack witch load 5 modules. each module is loaded via the moduleLoader tag and they all have an id.

Every loaded module has a context menu. the context menu has 5 menuItems. one menuItem for each view for the viewstack.

The context menu is loaded via xml.

this is my application file.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
      layout="absolute"
      backgroundColor="#b1b1b1"
      backgroundGradientColors="[#b1b1b1,#252525]">

<mx:Script>
<![CDATA[
import mx.core.Container;


        //change viewstack views via modules context menu
        public function switchView(viewId:String):void
     {
         var container:Container = Container(tops.getChildByName(viewId));
         if (container != null)
         {
             tops.selectedChild = container;
         }
     }
]]>
</mx:Script>

<mx:ViewStack id="tops" width="100%" height="100%">
  <mx:ModuleLoader id="admin" url="view/admin.swf" width="100%" height="100%"/>
  <mx:ModuleLoader id="tv" url="view/tv.swf" width="100%" height="100%"/>
  <mx:ModuleLoader id="community" url="view/community.swf" width="100%" height="100%"/>
  <mx:ModuleLoader id="shop" url="view/shop.swf" width="100%" height="100%"/>
  <mx:ModuleLoader id="communicator" url="view/communicator.swf" width="100%" height="100%"/>
</mx:ViewStack>


</mx:Application>

and this is my switch statement in my Module

public function changeView():void{
switch(action) {
case "admin":
    parentApplication.switchView("admin");
break;
case "tv":
    parentApplication.switchView("tv");
break;
case "shop":
    parentApplication.switchView("shop");
break;
case "community":
    parentApplication.switchView("community");
break;
case "default":
    parentApplication.switchView("communicator");
break;
 }
}

and this is my context menu xml

  <mx:XML id="appMenu">
    <root>
        <menuitem enabled="false"/>
        <menuitem label="Administration" action="admin" icon="adminMDI"/>
        <menuitem label="Television" action="tv" icon="tvMDI"/>
        <menuitem label="Community" action="community" icon="communityMDI"/>
        <menuitem label="Shopping Mall" action="shop" icon="shoppingMallMDI"/>
        <menuitem label="Communicator" action="default" icon="communicatorMDI"/>                                                              
    </root>
  </mx:XML>

What i would like to do is switch the views in the viewstack by clicking on one of the menuitems in the context menu. i can't communicate from my module to the application. What am i doing wrong? what must i do? Can anybody help me out?

Oyeah before i forget

the xml of the context menu is in the module but, the context menu is in a as file that extensiate a button.

please can any body give me a good example how to accomplish this.

Thank

DJ

解决方案

I see a couple issues before getting into the multi-module communication.

First, in your changeView() function, you are declaring the variable action and then switching on it.

public function changeView():void {
    var action:String;
    switch(action) {
        // action will always be null here.
    }
}

Because you don't have a 'default' case in your switch statement(s), parentApplication.switchView will never be called.

Also, for the sake of brevity, you can write switch statements like this:

switch(action) {
    case "admin":
        parentApplication.changeView("admin");
    break;
    case "tv":
        parentApplication.changeView("tv");
    break;
    case "shop":
        parentApplication.changeView("shop");
    break;
    // ... etc ...
    default:
        // this gets called if action doesn't match anything.
    break;
}

Finally, you could save yourself even more typing because your action and module ids are the same, you could do this:

public function changeView(action:String):void {
    parentApplication.changeView(action);
}

Maybe try those things and then updating your question (also, the XML for your context menus didn't render correctly in your question). That may help the community solve your issue a little easier.

UPDATE

I don't think the problem is in the module communication. I built a simple project that does what I think you're looking for. I've posted the source below.

mmodules.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" implements="interfaces.IApplication">
    <mx:Script>
        <![CDATA[
            import mx.core.Container;
            public function changeView(action:String):void {
                viewstack.selectedChild = viewstack.getChildByName(action) as Container;
            }
        ]]>
    </mx:Script>
    <mx:ViewStack id="viewstack" width="100%" height="100%">
        <mx:ModuleLoader id="module1" url="views/module1.swf" />
        <mx:ModuleLoader id="module2" url="views/module2.swf" />
    </mx:ViewStack>
</mx:Application>

interfaces/IApplication.as

package interfaces {
    public interface IApplication {
        function changeView(action:String);
    }
}

views/module1.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            import interfaces.IApplication;
            import mx.events.MenuEvent;
            import mx.controls.Menu;
            /**
            * Dynamically builds a menu.
            */
            protected function showMenu():void {
                var m:Menu = Menu.createMenu(null, menuData, false);
                m.labelField = '@label';
                m.addEventListener(MenuEvent.ITEM_CLICK, onItemClick);
                m.show(10, 10);
            }
            /**
            * Handles whenever an item in the menu is clicked.
            */
            protected function onItemClick(e:MenuEvent):void {
                if(e && e.item && e.item is XML) {
                    changeView(e.item.@action);
                }
            }
            /**
            * Tells the parent application to switch views.
            */
            protected function changeView(action:String):void {
                var app:IApplication = parentApplication as IApplication;
                switch(action) {
                    case 'module1':
                        app.changeView('module1');
                    break;
                    case 'module2':
                        app.changeView('module2');
                    break;
                }
            }
        ]]>
    </mx:Script>
    <mx:XML format="e4x" id="menuData">
        <root>
            <menuitem label="Module 1" action="module1" />
            <menuitem label="Module 2" action="module2" />
        </root>
    </mx:XML>
    <mx:Button label="Show menu" click="showMenu()" />
</mx:Module>

Hope that helps.

这篇关于flex 3将模块中的数据传递给父应用程序,以在视图中切换视图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆