- 浏览: 19080 次
- 性别:
- 来自: 北京
文章分类
最新评论
一个很简单的单击效果(弹跳,选中时加下划线),可适用于菜单单击,将下面代码作为MenuItemRenderer。实现这个效果无非就是使用了Move3D。(选自FlexViewer)
Underline
<?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" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:components="com.components.*" implements="mx.managers.IFocusManagerComponent" buttonMode="true" focusEnabled="true" useHandCursor="true" click="itemClickHandler(event)"> <fx:Declarations> <s:Move3D id="moveEffect" duration="200" effectEnd="moveEffectEndHandler(event)" repeatBehavior="reverse" repeatCount="2" target="{icon}" yBy="-8" yFrom="0"/> </fx:Declarations> <fx:Script> <![CDATA[ import mx.events.EffectEvent; import mx.events.FlexEvent; /** * 是否打开标识 */ private var isOpen:Boolean = false; /** * 数据更改时触发函数,如果作为菜单的ItemRenderer时,监听DataChangeEvent。否则要外部调用执行。以便实现窗口关闭还原状态 */ public function itemrenderer_dataChangeHandler(open:Boolean):void { //itemrenderer_dataChangeHandler(event:CustomEvent):void //作为renderer时,派发自定义事件,data属性中设置open状态,直接赋值即可。 // icon.source = event.data.icon; // underline.open = event.data.open; underline.open = open; } /** * 鼠标移出事件处理 */ private function mouseOutHandler(event:MouseEvent):void { //执行鼠标移出处理 } /** * 鼠标移上事件处理 */ private function mouseOverHandler(event:MouseEvent):void { //执行鼠标移上处理 } /** * 单击事件处理函数 */ private function itemClickHandler(event:MouseEvent):void { if ( !isOpen ) { moveEffect.end(); moveEffect.play(); underline.open = isOpen = true; } } /** * 单击时效果渲染完毕 处理函数 */ private function moveEffectEndHandler(event:EffectEvent):void { //执行单击操作 } //-------------------------------------------------------------------------- // // Focus Management // //-------------------------------------------------------------------------- /** * 获取焦点,可在此函数中通过焦点来执行鼠标移上移出处理。 */ override public function drawFocus(isFocused:Boolean):void { super.drawFocus(isFocused); // Popup the tooltip or remove the menu if (isFocused) { mouseOverHandler(null); } else { mouseOutHandler(null); } } /** * 空格事件处理,按下空格键派发Click事件 */ private var keyboardPressed:Boolean = false; override protected function keyDownHandler(event:KeyboardEvent):void { if (event.keyCode != Keyboard.SPACE) { return; } keyboardPressed = true; event.updateAfterEvent(); } override protected function keyUpHandler(event:KeyboardEvent):void { if (event.keyCode != Keyboard.SPACE) { return; } if (enabled && keyboardPressed) { // Mimic mouse click on the button. keyboardPressed = false; dispatchEvent(new MouseEvent(MouseEvent.CLICK)); } event.updateAfterEvent(); } ]]> </fx:Script> <s:VGroup width="50" height="30" gap="2" horizontalAlign="center" verticalAlign="middle"> <s:Image id="icon" source="@Embed('assets/images/icons/i_clock.png')" width="25" height="25" buttonMode="true" mouseOut="mouseOutHandler(event)" mouseOver="mouseOverHandler(event)" smooth="true" useHandCursor="true"/> <components:Underline id="underline"/> </s:VGroup> </s:VGroup>
Underline
<?xml version="1.0" encoding="utf-8"?> <!-- 绘制线段 --> <s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <fx:Script> <![CDATA[ [Bindable] public var open:Boolean = false; ]]> </fx:Script> <s:Line width="10" includeInLayout="{open}" visible="{open}"> <s:stroke> <s:SolidColorStroke caps="square" color="0x000000" weight="2"/> </s:stroke> </s:Line> </s:Group>
发表评论
-
ColorLabel
2014-06-19 09:46 386package com.components { imp ... -
Flex4动态加载组件存在的问题
2014-03-13 10:14 1134为了提高Spark组件性能,Adobe做了很多,但凡事均有利弊 ... -
Flex DragManager
2013-12-30 16:34 397当用户使用鼠标选择某个项目时,所选组件称之为启动器,移动过程中 ... -
AdvancedDatagrid分组、显示概要信息及问题
2013-12-27 17:28 396<?xml version="1.0" ... -
Flex日志使用及配置
2013-02-26 12:43 682Flex集成一个Log框架,可以完成很多用trac ... -
Flex 读写本地文件(Flash Player 10)
2013-02-26 11:43 1454FileReference 类提供了在用户计算机和 ... -
Flex FileReference URLRequest 请求缓存问题
2013-02-19 10:20 1168UrlRequest请求时会缓存会话 ... -
Flex 资源链接
2013-01-31 10:47 642RIA爱好者 http://www.riafan.com Co ... -
Flex 4 组件继承关系
2013-01-05 09:55 757. -
自定义的组件中加入多个MXML标记的子UI元素 (转)
2012-11-29 15:24 872首先我们来看一下它定 ... -
Flex 3 与 Flex 4 之间的区别 (转载)
2012-11-23 14:00 560http://www.adobe.com/cn/devn ... -
Flex 4 随记
2012-11-23 13:41 6121. Flex多状态事件 private functio ... -
Flash Builder 4.6 破解
2012-11-20 10:46 2具体步骤如下:1.到Adobe官网下载FlashBuil ... -
Flex HtmlButton 控件
2012-11-19 10:24 737package com { import flash ... -
Flex TimerInput 输入组件
2012-11-19 09:39 718package com { import fl ... -
探究Flex声明周期 (转载 IBM)
2012-11-16 17:14 610http://www.ibm.com/developerwor ... -
Flex 组件 生命周期
2012-11-16 16:12 8691、生命周期简述 (1) Constructio ... -
Flex 杂篇
2012-11-08 13:44 6751.复制内容到系统剪贴板System.setClipbo ... -
Failed to connect; session timed out.(无法连接,会议超时)
2012-11-06 16:23 1393Failed to connect; session time ...
相关推荐
FLEX 鱼眼菜单,点击菜单3D旋转效果切换页面
flex翻书效果flex翻书效果flex翻书效果
图片的发光 、 模糊、 弹跳、 放大效果
flex常用的几种动态菜单
Flex自定义右键菜单
Flex4的菜单滑动效果,可以参考一下,move特效的使用方法
超cool 的flex 菜单,flash builder 4
flex 百叶窗效果 flex 百叶窗效果 flex 百叶窗效果
导入工程后可以直接使用的flex水波纹效果
Flex 菜单导航特效 工程源码 不错哦
flex coverflow 效果示例flex coverflow 效果示例
NULL 博文链接:https://tongqiuyan.iteye.com/blog/1207523
flex 鱼眼菜单flex 鱼眼菜单flex 鱼眼菜单flex 鱼眼菜单
flex 自定义右键菜单 多级右键菜单flex 自定义右键菜单 多级右键菜单flex 自定义右键菜单 多级右键菜单
flex 左右分栏 效果
Flex 逼真海洋效果
Flex右键菜单 flex tree 右键菜单 导入eclipse可直接用。我使用的flex sdk 版本是flex4.5.1,更改为4.0可直接使用。
flex 各种效果 flex 各种效果 flex 各种效果 flex 各种效果
Flex屏蔽浏览器系统右键,实现自定义Menu的右键菜单,支持XML格式的多级菜单,以及支持菜单出现位置的自适应。欢迎大家修改,(能给出如何恢复浏览器右键菜单最好)。
可以实现图片的轮播,点击后连接网业,具体请看原文件(无源码)