Question

当我不对ViewNavigatorApplication应用skinClass时，ViewMenuItems工作正常，但是当我将自定义外观应用于ViewNavigator时，ViewMenuItems不会出现。

我的Main.mxml文件包含

    <?xml version="1.0" encoding="utf-8"?>
    <s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009"                                  xmlns:s="library://ns.adobe.com/flex/spark" firstView="views.MainHomeView"                                skinClass="skins.CustomApplicationSkin">
        <fx:Declarations>
            <!-- Place non-visual elements (e.g., services, value objects) here -->
            </fx:Declarations>
    </s:ViewNavigatorApplication>

CustomApplicationSkin的代码是

<?xml version="1.0" encoding="utf-8"?>
<s:Skin name="CustomApplicationSkin"
            xmlns:fx="http://ns.adobe.com/mxml/2009"
                     xmlns:s="library://ns.adobe.com/flex/spark"
                               >

    <fx:Metadata>
                <![CDATA[ 
                [HostComponent("Main")]
                ]]>
            </fx:Metadata> 

    <s:states>
                <s:State name="normal" />
                 <s:State name="disabled" />
             </s:states>

    <s:BitmapImage width="100%" height="100%" source="@Embed('/assets/background.jpg')"/>

    <s:Group id="contentGroup" width="100%" height="100%" minWidth="0" minHeight="0" />

    <s:ViewNavigator id="navigator" width="100%" height="100%" />

</s:Skin>

MainHomeView.mxml代码

<?xml version="1.0" encoding="utf-8"?>
<!-- components\mobile\views\ViewMenuHome.mxml -->
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        title="Home">

    <fx:Script>
        <![CDATA[
        // The event listener for the click event.
            private function itemClickInfo(event:MouseEvent):void {
                switch (event.currentTarget.label) { 
                    case "Add" : 
                        myTA.text = "Add selected"; 
                        break; 
                    case "Cancel" : 
                        myTA.text = "Cancel selected"; 
                        break; 
                    case "Delete" : 
                        myTA.text = "Delete selected"; 
                        break; 
                    case "Edit" : 
                        myTA.text = "Edit selected"; 
                    break; 
                case "Search" : 
                    myTA.text = "Search selected"; 
                        break; 
                default : 
                    myTA.text = "Error"; 
                }                
            }
        ]]>
    </fx:Script>

    <s:viewMenuItems>
        <s:ViewMenuItem label="Add" click="itemClickInfo(event);" />
        <s:ViewMenuItem label="Cancel" click="itemClickInfo(event);"/>
        <s:ViewMenuItem label="Delete" click="itemClickInfo(event);"/>
        <s:ViewMenuItem label="Edit" click="itemClickInfo(event);"/>
        <s:ViewMenuItem label="Search" click="itemClickInfo(event);"/>
    </s:viewMenuItems>

    <s:VGroup paddingTop="10" paddingLeft="10">
        <s:TextArea id="myTA" text="Select a menu item"/>
        <s:Button label="Open Menu" 
              click="mx.core.FlexGlobals.topLevelApplication.viewMenuOpen=true;"/>
        <s:Button label="Close Menu" 
              click="mx.core.FlexGlobals.topLevelApplication.viewMenuOpen=false;"/>
    </s:VGroup>
</s:View>

请协助。

Answer 1

有两个问题：

您的皮肤不包括菜单（ViewMenu对象）
ViewNavigatorApplicationSkin类是在Actionscript中编写的，并扩展了MobileSkin类，而您的皮肤是用MXML编写的，并扩展了Skin类。

第一个问题很容易解决：我在你的皮肤上添加了一个“initialize”事件处理程序，其中我以与在默认移动皮肤的构造函数中完成相同的方式实例化ViewMenu对象（{{ 1}}）。

然而，执行此操作后，我在尝试打开视图菜单时在运行时收到错误。此错误是上述第二个问题的结果：具体而言，ViewNavigatorApplicationSkin中的代码尝试使用ViewNavigatorApplication方法添加菜单，但是，因为您的自定义皮肤扩展了非移动版{{ 1}} class（本质上是一个Spark addChild()），它会抛出一个错误，指出你不能使用Skin方法，而应该使用Group。此错误是将您的皮肤基于非移动皮肤类（主机组件addChild()，并不期望这样）的直接结果。

我建议您通过扩展原始addElement()类在Actionscript中创建皮肤。看起来你正在做的就是添加一个背景，所以下面的代码可能会起作用。但问题是，在您的皮肤中，ViewNavigatorApplication和背景图像的宽度/高度均为100％。因此导航器完全覆盖了背景。在下面的例子中，我给导航器一些透明度，让背景显示出来。我假设你不会想要那个，但在你目前的设计中，这是看到图像的唯一方法。

ViewNavigatorApplicationSkin

将蒙皮应用于ViewNavigatorApplication时，viewMenuItems不会出现

1 个答案: