zoukankan      html  css  js  c++  java
  • Flex2:无边框透明背景MenuBar实现

    在Flex2中,大家是否发现MenuBar的背景与边框是不能去掉的,其实这是因为MenuBar的缺省的backgroundSkin属性使用的是mx.skins.halo.MenuBarBackgroundSkin,不管您怎么设置,该skin都会绘制背景以及边框,所以我们不能去掉MenuBar的边框。

    既然这样的话,要去掉边框,只需要不使用该Skin就可以,所以我们自定义了一个Skin:MenuBarNoBorderFillSkin,该Skin什么都不做,只是用来替代MenuBarBackgroundSkin而已。

    MenuBarNoBorderFillSkin.as:

    package com.eshangrao.skin{
      import mx.skins.ProgrammaticSkin;
      import flash.display.Graphics;
      public class MenuBarNoBorderFillSkin extends ProgrammaticSkin{
        public function MenuBarNoBorderFillSkin(){
          super();
        }
      }
    }
    另外,使用了MenuBarNoBorderFillSkin以后,MenuBar的菜单栏不再根据鼠标移动显示不同的选择状态了,所以我们又做了个MenuBarActiveSkin类来响应鼠标,然后将MenuBar的itemDownSkin和itemOverSkin属性MenuBarActiveSkin,这样菜单栏就可以显示不同的状态。

    MenuBarActiveSkin.as:

    package com.eshangrao.skin{
      import mx.skins.ProgrammaticSkin;
      import flash.display.Graphics;
      import mx.utils.ColorUtil;
      public class MenuBarActiveSkin extends ProgrammaticSkin{
        public function MenuBarActiveSkin(){
          super();
        }
        override protected function updateDisplayList(w:Number, h:Number):void{
          var backgroundAlpha:Number = getStyle("backgroundAlpha");
          var rollOverColor:uint=getStyle("rollOverColor");
          graphics.clear();
          drawRoundRect(0,0,w,h,5,rollOverColor,backgroundAlpha);
        }
      }
    }


    测试代码如下:

    <mx:MenuBar labelField="@label" dataProvider="{menubarXML.menuitem}" width="100%"backgroundSkin="com.eshangrao.skin.MenuBarNoBorderFillSkin"itemDownSkin="com.eshangrao.skin.MenuBarActiveSkin"itemOverSkin="com.eshangrao.skin.MenuBarActiveSkin"/>


    查看示例
    | 查看完整源代码

  • 相关阅读:
    SQL(4)— Date、order by
    步入三十(二)
    【js】特殊字符转义
    【ionic】项目中$ionicModal简单用法
    【ionic】常见问题处理
    【js】视频截图
    实现笔记本拔除电源后修改屏幕缩放比例
    激活 公众号java
    【Golang】基于beego/orm实现相同表结构不同表名的分表方法实现
    .Net Cors 跨域配置域名通配符
  • 原文地址:https://www.cnblogs.com/taobataoma/p/1048332.html
Copyright © 2011-2022 走看看