`

flex设计器功能拆分之一(调整组件大小位置)

    博客分类：
  • Flex
FlexFlashAdobeUIUP 
阅读更多

只要是设计器就逃不脱对组件的动态调整。比如大小，位置是最常见的。

在flashBuilder中可以看到下面效果图：


在此简单实现，更多细节不予考虑，有点伤到我的神经了，总体设计思路图：



 由resizeUI完成核心功能。

ResizeContainer容器类：

package org.forever.view
{
	import flash.events.MouseEvent;
	
	import mx.collections.ArrayList;
	import mx.core.IUIComponent;
	
	import spark.components.SkinnableContainer;
	
	/**容器类*/
	public class ResizeContainer
	{
		
		
		private var _app_container:SkinnableContainer;
		private var _current_resizeUI:ResizeUI;
		private var _resizeUIList:ArrayList;

		public function get mouseMoveCallFun():Function
		{
			return _mouseMoveCallFun;
		}

		public function set mouseMoveCallFun(value:Function):void
		{
			_mouseMoveCallFun = value;
		}

		private var _mouseMoveCallFun:Function;
		
		public function ResizeContainer(app_container:SkinnableContainer){
			_app_container = app_container;
			initContainer();
			
			_resizeUIList = new ArrayList();
		}
		
		public function get current_resizeUI():ResizeUI
		{
			return _current_resizeUI;
		}

		public function set current_resizeUI(value:ResizeUI):void
		{
			if(null!=_current_resizeUI){
				_current_resizeUI.hideResizeUI();	
			}
			_current_resizeUI = value;
			
		}

		public function register(uicomp:IUIComponent):void{	
			var _resizeUI:ResizeUI = new ResizeUI(uicomp,_app_container);
			_resizeUI.resizeContainer = this;
			_resizeUIList.addItem(_resizeUI);
		}
		
		
		public function initContainer():void{
			_app_container.addEventListener(MouseEvent.MOUSE_DOWN,appContainerMouseDownHandler);
			_app_container.addEventListener(MouseEvent.MOUSE_MOVE,appContainerMouseMoveHandler);
			_app_container.addEventListener(MouseEvent.MOUSE_UP,appContainerMouseUpHandler);
		}
		
		public function appContainerMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			if(null!=_current_resizeUI){
				_current_resizeUI.hideResizeUI();	
			}
		}
		
		public function appContainerMouseMoveHandler(event:MouseEvent):void{
			if(null != _mouseMoveCallFun){
				_mouseMoveCallFun(event);
			}
		}
		
		public function appContainerMouseUpHandler(event:MouseEvent):void{
			if(null != _mouseMoveCallFun){
				_mouseMoveCallFun = null;
				if(null!=_current_resizeUI)_current_resizeUI.updateUIComp();
			}
		}
		
		
		
		
	}
}

 ResizeUI调整类：

package org.forever.view 
{
	import flash.display.DisplayObject;
	import flash.display.MorphShape;
	import flash.events.MouseEvent;
	import flash.ui.Mouse;
	
	import mx.controls.Alert;
	import mx.controls.Image;
	import mx.core.IUIComponent;
	import mx.core.IVisualElement;
	import mx.core.UIComponent;
	import mx.graphics.SolidColorStroke;
	import mx.logging.ILogger;
	import mx.logging.Log;
	import mx.managers.CursorManager;
	
	import spark.components.BorderContainer;
	import spark.components.SkinnableContainer;
	import spark.components.mediaClasses.VolumeBar;
	import spark.primitives.Line;

	/**
	 *调整UI组件的一个类，类似在flashBuilder对组件的一个调整功能 
	 */
	public class ResizeUI{
		private var _resizeContainer:ResizeContainer;
		private static var _log:ILogger = Log.getLogger("org.forever.report.view.ResizeUI");		
		private var _uiComp:IUIComponent;
		private var _container:SkinnableContainer;
		private var _centerRect:BorderContainer;
		private var _leftTopRect:BorderContainer;
		private var _rightTopRect:BorderContainer;
		private var _leftBottomRect:BorderContainer;
		private var _rightBottomRect:BorderContainer;		
		private var _topCenterRect:BorderContainer;
		private var _leftCenterRect:BorderContainer;
		private var _bottomCenterRect:BorderContainer;
		private var _rightCenterRect:BorderContainer;
		
		private var _leftTopTopCenterLine:Line;
		private var _topCenterRightTopLine:Line;
		private var _leftTopLeftCenterLine:Line;
		private var _leftCenterLeftBottomLine:Line;
		private var _leftBottomBottomCenterLine:Line;
		private var _bottomCenterRightBottomLine:Line;
		private var _rightCenterRightBottomLine:Line;
		private var _rightTopRightCenterLine:Line;
		
		private var _rect_w:Number = 6; 
		
		private var _startMove:Boolean = false;
		private var _moving:Boolean = false;
		
		public function get resizeContainer():ResizeContainer
		{
			return _resizeContainer;
		}

		public function set resizeContainer(value:ResizeContainer):void
		{
			_resizeContainer = value;
		}

		/**初始化中间矩形*/
		public function initCenterRect():void{
			_centerRect = new BorderContainer();
			_centerRect.setStyle("borderColor","ffffff");
			_centerRect.alpha = 1;
			_centerRect.visible = false;
			_container.addElement(_centerRect);
		}
		
		/**初始化所有矩形*/
		public function initAllRectProp():void{
			_leftTopRect = new BorderContainer();
			_rightTopRect = new BorderContainer();
			_leftBottomRect = new BorderContainer();
			_rightBottomRect = new BorderContainer();
			_topCenterRect = new BorderContainer();
			_leftCenterRect = new BorderContainer();
			_bottomCenterRect = new BorderContainer();
			_rightCenterRect = new BorderContainer();
			
			initRectProp(_leftTopRect);
			initRectProp(_rightTopRect);
			initRectProp(_leftBottomRect);
			initRectProp(_rightBottomRect);
			initRectProp(_topCenterRect);
			initRectProp(_leftCenterRect);
			initRectProp(_bottomCenterRect);
			initRectProp(_rightCenterRect);
		}
		
		/**初始化所有线条*/
		public function initAllLine():void{
			_leftTopTopCenterLine = new Line();
			_leftTopTopCenterLine.stroke = new SolidColorStroke(0x70b2ee);
			_topCenterRightTopLine = new Line();
			_topCenterRightTopLine.stroke = new SolidColorStroke(0x70b2ee);
			_leftTopLeftCenterLine = new Line();
			_leftTopLeftCenterLine.stroke = new SolidColorStroke(0x70b2ee);
			_leftCenterLeftBottomLine = new Line();
			_leftCenterLeftBottomLine.stroke = new SolidColorStroke(0x70b2ee);
			_leftBottomBottomCenterLine = new Line();
			_leftBottomBottomCenterLine.stroke = new SolidColorStroke(0x70b2ee);
			_bottomCenterRightBottomLine = new Line();
			_bottomCenterRightBottomLine.stroke = new SolidColorStroke(0x70b2ee);
			_rightCenterRightBottomLine = new Line();
			_rightCenterRightBottomLine.stroke = new SolidColorStroke(0x70b2ee);
			_rightTopRightCenterLine = new Line();
			_rightTopRightCenterLine.stroke =  new SolidColorStroke(0x70b2ee);
			_container.addElement(_leftTopTopCenterLine);
			_container.addElement(_topCenterRightTopLine);
			_container.addElement(_leftTopLeftCenterLine);
			_container.addElement(_leftCenterLeftBottomLine);
			_container.addElement(_leftBottomBottomCenterLine);
			_container.addElement(_bottomCenterRightBottomLine);
			_container.addElement(_rightCenterRightBottomLine);
			_container.addElement(_rightTopRightCenterLine);	
		}
		
		
		
		
		
		
		public function ResizeUI(uiComp:IUIComponent,container:SkinnableContainer){
			_uiComp = uiComp;
			_container = container;
			initCenterRect();
			initAllRectProp();
			updateCenterRect();
			initAllLine();
			
			_uiComp.addEventListener(MouseEvent.MOUSE_DOWN,uiCompMouseDownHandler);
			_uiComp.addEventListener(MouseEvent.MOUSE_MOVE,uiCompMouseMoveHandler);
			_uiComp.addEventListener(MouseEvent.MOUSE_UP,uiCompMouseUpHandler);
			
			_centerRect.addEventListener(MouseEvent.MOUSE_UP,centerRectMouseUpHandler);
			_centerRect.addEventListener(MouseEvent.MOUSE_MOVE,centerRectMouseMoveHandler);
			
			_rightCenterRect.addEventListener(MouseEvent.MOUSE_DOWN,rightCenterMouseDownHandler);
			_topCenterRect.addEventListener(MouseEvent.MOUSE_DOWN,topCenterRectMouseDownHandler);
			_bottomCenterRect.addEventListener(MouseEvent.MOUSE_DOWN,bottomCenterRectMouseDownHandler);
			_leftCenterRect.addEventListener(MouseEvent.MOUSE_DOWN,leftCenterRectMouseDownHandler);
			
			_rightTopRect.addEventListener(MouseEvent.MOUSE_DOWN,rightTopRectMouseDownHandler);
			_rightBottomRect.addEventListener(MouseEvent.MOUSE_DOWN,rightBottomRectMouseDownHandler);
			_leftTopRect.addEventListener(MouseEvent.MOUSE_DOWN,leftTopRectMouseDownHandler);
			_leftBottomRect.addEventListener(MouseEvent.MOUSE_DOWN,leftBottomRectMouseDownHandler);

		}
		
		public function uiCompMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.current_resizeUI = this;
			_startMove = true;//点击组件做移动准备
			_moving = false;//并未真正移动
			_log.debug("_centerRect准备开始移动......");
			updateCenterRect();
			showResizeUI();
		}
		
		public function updateUIComp():void{
			_uiComp.x = _leftTopRect.x + _leftTopRect.width;
			_uiComp.y = _leftTopRect.y + _leftTopRect.height;
			_uiComp.width = _rightTopRect.x - _leftTopRect.x - _leftTopRect.width;
			_uiComp.height = _leftBottomRect.y - _leftTopRect.y - _leftTopRect.height;
			_log.debug("updateUIComp.........");
			updateCenterRect();
		}
		
		public function updateCenterRect():void{
			_centerRect.x = _uiComp.x;
			_centerRect.y = _uiComp.y;
			_centerRect.width = _uiComp.width;
			_centerRect.height = _uiComp.height;
			_log.debug("updateCenterRect....."); 
			
		}
		
		
		public function uiCompMouseMoveHandler(event:MouseEvent):void{
			if(_startMove && !_moving){
				_uiComp.visible = false;
				_centerRect.visible = true;
				_centerRect.startDrag();
				_moving = true;
				_log.debug("_centerRect开始移动......");
			}
		}	
		
		public function centerRectMouseMoveHandler(event:MouseEvent):void{
			refreshResizeUI();
		}
		
		public function centerRectMouseUpHandler(event:MouseEvent):void{
			stopCenterRectMove();
			refreshResizeUI();
		}
		
		public function stopCenterRectMove():void{
			_startMove = false;
			_moving = false;
			_centerRect.stopDrag();
			_uiComp.x = _centerRect.x;
			_uiComp.y = _centerRect.y;
			_uiComp.visible = true;
			_centerRect.visible = false;
			_log.debug("停止_centerRect的移动........");
			
		}
		
		public function uiCompMouseUpHandler(event:MouseEvent):void{
			stopCenterRectMove();
		}
		
		public function rightCenterMouseOverHandler(event:MouseEvent):void{
			Mouse.hide();
		}
		
		public function rightCenterMouseOutHandler(event:MouseEvent):void{
			Mouse.show();
		}
		
		public function leftBottomRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateLeftBottomRectCall;
		}
		
		public function updateLeftBottomRectCall(event:MouseEvent):void{
			updateLeftCenterRectCall(event);
			updateBottomCenterRectCall(event);
		}
		
		public function leftTopRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateLeftTopRectCall;
		}
		
		public function updateLeftTopRectCall(event:MouseEvent):void{
			updateTopCenterRectCall(event);
			updateLeftCenterRectCall(event);
			
		}
		
		public function rightBottomRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateRightBottomRectCall;
		}
		
		public function updateRightBottomRectCall(event:MouseEvent):void{
			updateRightCenterRectCall(event);
			updateBottomCenterRectCall(event);
		}
		
		public function rightTopRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateRightTopRectCall;
		}
		
		public function updateRightTopRectCall(event:MouseEvent):void{
			updateRightCenterRectCall(event);
			updateTopCenterRectCall(event);
		}
		
		public function leftCenterRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateLeftCenterRectCall;
		}
		
		public function updateLeftCenterRectCall(event:MouseEvent):void{
			_leftCenterRect.x = _container.mouseX;
			_leftTopRect.x = _leftCenterRect.x;
			_leftBottomRect.x = _leftCenterRect.x;
			updateLeftTopLeftCenterLine();
			updateLeftCenterLeftBottomLine();
			updateLeftTopTopCenterLine();
			updateLeftBottomBottomCenterLine();
			updateTopCenterRect();
			updateBottomCenterRect();
			updateTopCenterRightTopLine();
			updateBottomCenterRightBottomLine();
		}
		
		public function bottomCenterRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateBottomCenterRectCall;
		}
		
		public function updateBottomCenterRectCall(event:MouseEvent):void{
			_bottomCenterRect.y = _container.mouseY;
			_leftBottomRect.y = _bottomCenterRect.y;
			_rightBottomRect.y = _bottomCenterRect.y;
			updateLeftBottomBottomCenterLine();
			updateBottomCenterRightBottomLine();
			updateLeftCenterLeftBottomLine();
			updateRightCenterRightBottomLine();
			updateLeftCenterRect();
			updateRightCenterRect();
			updateLeftTopLeftCenterLine();
			updateRightTopRightCenterLine();
			
		}
		
		public function topCenterRectMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateTopCenterRectCall;
		}
		
		public function updateTopCenterRectCall(event:MouseEvent):void{
			_topCenterRect.y = _container.mouseY;
			_leftTopRect.y = _topCenterRect.y;
			_rightTopRect.y = _topCenterRect.y;
			updateLeftTopTopCenterLine();
			updateTopCenterRightTopLine();
			updateLeftTopLeftCenterLine();
			updateRightTopRightCenterLine();
			updateLeftCenterRect();
			updateRightCenterRect();
			updateLeftCenterLeftBottomLine();
			updateRightCenterRightBottomLine();
		}
		
		public function rightCenterMouseDownHandler(event:MouseEvent):void{
			event.stopImmediatePropagation();
			_resizeContainer.mouseMoveCallFun = updateRightCenterRectCall;
			
		}
		
		public function updateRightCenterRectCall(event:MouseEvent):void{
			_rightCenterRect.x = _container.mouseX;
			_rightTopRect.x = _rightCenterRect.x;
			_rightBottomRect.x = _rightCenterRect.x;
			updateRightTopRightCenterLine();
			updateRightCenterRightBottomLine();
			updateTopCenterRightTopLine();
			updateBottomCenterRightBottomLine();
			updateTopCenterRect();
			updateBottomCenterRect();
			updateLeftBottomBottomCenterLine();
			updateLeftTopTopCenterLine();
			
		}
		
		public function updateRightCenterRect():void{
			_rightCenterRect.y = (_rightTopRect.y + _rightBottomRect.y)/2;
		}
		
		public function updateLeftCenterRect():void{
			_leftCenterRect.y = (_leftTopRect.y + _leftBottomRect.y)/2;
		}
		
		public function updateTopCenterRect():void{
			_topCenterRect.x = (_leftTopTopCenterLine.xFrom + _topCenterRightTopLine.xTo)/2;
		}
		
		public function updateBottomCenterRect():void{
			_bottomCenterRect.x = (_leftBottomBottomCenterLine.xFrom + _bottomCenterRightBottomLine.xTo)/2;
		}
		
		
		public function initRectProp(_rect:BorderContainer):void{
			_rect.width = _rect_w;
			_rect.height = _rect_w;
			_rect.visible = false;
			_rect.setStyle("borderColor","#70B2EE");
			_container.addElement(_rect);
		}
		
		
		public function refreshResizeUI():void{
			_leftTopRect.x = _centerRect.x-_leftTopRect.width;
			_leftTopRect.y = _centerRect.y -_leftTopRect.height;
			_rightTopRect.x = _centerRect.x + _centerRect.width;
			_rightTopRect.y = _centerRect.y - _leftBottomRect.height;
			_leftBottomRect.x = _centerRect.x-_leftBottomRect.width;
			_leftBottomRect.y = _centerRect.y + _centerRect.height;
			_rightBottomRect.x = _centerRect.x + _centerRect.width;
			_rightBottomRect.y = _centerRect.y + _centerRect.height;
			_topCenterRect.x = _centerRect.x + _centerRect.width/2 -_topCenterRect.width/2 ;
			_topCenterRect.y = _centerRect.y - _topCenterRect.height;
			_leftCenterRect.x = _centerRect.x - _leftCenterRect.width;
			_leftCenterRect.y = _centerRect.y + _centerRect.height/2 - _leftCenterRect.height/2;
			_bottomCenterRect.x =_centerRect.x + _centerRect.width/2 -_topCenterRect.width/2 ;
			_bottomCenterRect.y = _centerRect.y + _centerRect.height;
			_rightCenterRect.x = _centerRect.x + _centerRect.width;
			_rightCenterRect.y = _centerRect.y + _centerRect.height/2 - _leftCenterRect.height/2;
			showAllRect();
			updateLeftTopTopCenterLine();
			updateBottomCenterRightBottomLine();
			updateLeftBottomBottomCenterLine();
			updateLeftCenterLeftBottomLine();
			updateLeftTopLeftCenterLine();
			updateTopCenterRightTopLine();
			updateRightCenterRightBottomLine();
			updateRightTopRightCenterLine();
			_log.debug("refreshResizeUI............");
		}
		
		public function showAllRect():void{
			_leftTopRect.visible = true;
			_rightTopRect.visible = true;
			_leftBottomRect.visible = true;
			_rightBottomRect.visible = true;
			_topCenterRect.visible = true;
			_leftCenterRect.visible = true;
			_bottomCenterRect.visible = true;
			_rightCenterRect.visible = true;
		}
		
		
		public function hideResizeUI():void{
			hideAllRect();
			hideAllLine();
			
		}
		
		public function showAllLine():void{
			_leftTopTopCenterLine.visible = true;
			_topCenterRightTopLine.visible = true;
			_leftTopLeftCenterLine.visible = true;
			_leftCenterLeftBottomLine.visible = true;
			_leftBottomBottomCenterLine.visible = true;
			_bottomCenterRightBottomLine.visible = true;
			_rightCenterRightBottomLine.visible = true;
			_rightTopRightCenterLine.visible = true;
		}
		
		public function hideAllLine():void{
			_leftTopTopCenterLine.visible = false;
			_topCenterRightTopLine.visible = false;
			_leftTopLeftCenterLine.visible = false;
			_leftCenterLeftBottomLine.visible = false;
			_leftBottomBottomCenterLine.visible = false;
			_bottomCenterRightBottomLine.visible = false;
			_rightCenterRightBottomLine.visible = false;
			_rightTopRightCenterLine.visible = false;
		}
		
		public function hideAllRect():void{
			_leftTopRect.visible = false;
			_rightTopRect.visible = false;
			_leftBottomRect.visible = false;
			_rightBottomRect.visible = false;
			_topCenterRect.visible = false;
			_leftCenterRect.visible = false;
			_bottomCenterRect.visible = false;
			_rightCenterRect.visible = false;
		}
		
		/**显示所有辅助组件拖动的矩形框*/
		public function showResizeUI():void{
			_leftTopRect.x = _uiComp.x-_leftTopRect.width;
			_leftTopRect.y = _uiComp.y -_leftTopRect.height;
			_rightTopRect.x = _uiComp.x + _uiComp.width;
			_rightTopRect.y = _uiComp.y - _leftBottomRect.height;
			_leftBottomRect.x = _uiComp.x-_leftBottomRect.width;
			_leftBottomRect.y = _uiComp.y + _uiComp.height;
			_rightBottomRect.x = _uiComp.x + _uiComp.width;
			_rightBottomRect.y = _uiComp.y + _uiComp.height;
			_topCenterRect.x = _uiComp.x + _uiComp.width/2 -_topCenterRect.width/2 ;
			_topCenterRect.y = _uiComp.y - _topCenterRect.height;
			_leftCenterRect.x = _uiComp.x - _leftCenterRect.width;
			_leftCenterRect.y = _uiComp.y + _uiComp.height/2 - _leftCenterRect.height/2;
			_bottomCenterRect.x =_uiComp.x + _uiComp.width/2 -_topCenterRect.width/2 ;
			_bottomCenterRect.y = _uiComp.y + _uiComp.height;
			_rightCenterRect.x = _uiComp.x + _uiComp.width;
			_rightCenterRect.y = _uiComp.y + _uiComp.height/2 - _leftCenterRect.height/2;
			showAllRect();
			updateLeftTopTopCenterLine();
			updateBottomCenterRightBottomLine();
			updateLeftBottomBottomCenterLine();
			updateLeftCenterLeftBottomLine();
			updateLeftTopLeftCenterLine();
			updateTopCenterRightTopLine();
			updateRightCenterRightBottomLine();
			updateRightTopRightCenterLine();
			showAllLine();
			_log.debug("showResizeUI............");
			
		}
		
		public function updateLeftTopTopCenterLine():void{
			_leftTopTopCenterLine.xFrom = _leftTopRect.x+_leftTopRect.width;
			_leftTopTopCenterLine.yFrom = _leftTopRect.y+_leftTopRect.height/2;
			_leftTopTopCenterLine.xTo = _topCenterRect.x;
			_leftTopTopCenterLine.yTo = _topCenterRect.y+_leftTopRect.height/2;
		}
		
		public function updateBottomCenterRightBottomLine():void{
			_bottomCenterRightBottomLine.xFrom = _bottomCenterRect.x + _bottomCenterRect.width;
			_bottomCenterRightBottomLine.yFrom = _bottomCenterRect.y + _bottomCenterRect.height/2;
			_bottomCenterRightBottomLine.xTo = _rightBottomRect.x;
			_bottomCenterRightBottomLine.yTo = _rightBottomRect.y + _rightBottomRect.height/2;
		}
		
		public function updateLeftBottomBottomCenterLine():void{
			_leftBottomBottomCenterLine.xFrom = _leftBottomRect.x + _leftBottomRect.width;
			_leftBottomBottomCenterLine.yFrom = _leftBottomRect.y + _leftBottomRect.height/2;
			_leftBottomBottomCenterLine.xTo = _bottomCenterRect.x;
			_leftBottomBottomCenterLine.yTo = _bottomCenterRect.y + _bottomCenterRect.height/2;
		}
		
		public function updateLeftCenterLeftBottomLine():void{
			_leftCenterLeftBottomLine.xFrom = _leftCenterRect.x + _leftCenterRect.width/2;
			_leftCenterLeftBottomLine.yFrom = _leftCenterRect.y + _leftCenterRect.height;
			_leftCenterLeftBottomLine.xTo = _leftBottomRect.x + _leftBottomRect.width/2;
			_leftCenterLeftBottomLine.yTo = _leftBottomRect.y;
		}
		
		public function updateLeftTopLeftCenterLine():void{
			_leftTopLeftCenterLine.xFrom = _leftTopRect.x + _leftTopRect.width/2;
			_leftTopLeftCenterLine.yFrom = _leftTopRect.y + _leftTopRect.height;
			_leftTopLeftCenterLine.xTo = _leftCenterRect.x + _leftCenterRect.width/2;
			_leftTopLeftCenterLine.yTo = _leftCenterRect.y;
		}
		
		public function updateTopCenterRightTopLine():void{
			_topCenterRightTopLine.xFrom = _topCenterRect.x+_topCenterRect.width;
			_topCenterRightTopLine.yFrom = _topCenterRect.y+_topCenterRect.height/2;
			_topCenterRightTopLine.xTo = _rightTopRect.x;
			_topCenterRightTopLine.yTo = _rightTopRect.y+_rightTopRect.height/2;
			
		}
		
		public function updateRightCenterRightBottomLine():void{
			_rightCenterRightBottomLine.xFrom = _rightCenterRect.x + _rightCenterRect.width/2;
			_rightCenterRightBottomLine.yFrom = _rightCenterRect.y + _rightCenterRect.height;
			_rightCenterRightBottomLine.xTo = _rightBottomRect.x + _rightBottomRect.width/2;
			_rightCenterRightBottomLine.yTo = _rightBottomRect.y;
		}
		
		public function updateRightTopRightCenterLine():void{
			_rightTopRightCenterLine.xFrom = _rightTopRect.x + _rightTopRect.width/2;
			_rightTopRightCenterLine.yFrom = _rightTopRect.y + _rightTopRect.height;
			_rightTopRightCenterLine.xTo = _rightCenterRect.x + _rightCenterRect.width/2;
			_rightTopRightCenterLine.yTo = _rightCenterRect.y;
		}
		
	}
}

 简单日志类LogUtil：

package org.forever.log
{
	import mx.logging.Log;
	import mx.logging.LogEventLevel;
	import mx.logging.targets.TraceTarget;

	public class LogUtil
	{
		public function LogUtil()
		{
		}
		
		public static function initLogging():void {
			var logTarget:TraceTarget = new TraceTarget();
			logTarget.filters=["*"];
			logTarget.level = LogEventLevel.ALL;
			logTarget.includeDate = true;
			logTarget.includeTime = true;
			logTarget.includeCategory = true;
			logTarget.includeLevel = true;
			/* Begin logging. */
			Log.addTarget(logTarget);
		}
	}
}

 例子类ResizeUIDemo.mxml：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
			   creationComplete="init()">
	
	
	<fx:Script>
		<![CDATA[
			import org.forever.log.LogUtil;
			import org.forever.view.ResizeContainer;
			import org.forever.view.ResizeUI;
			
			public function init():void{
				LogUtil.initLogging();
				var _resizeContainer:ResizeContainer = new ResizeContainer(this);
				_resizeContainer.register(btn_1);
				_resizeContainer.register(btn_2);
				_resizeContainer.register(bc);
				_resizeContainer.register(lbl);
			}	
			
		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	
	<s:Button id="btn_1" x="282" y="125" label="按钮_1"/>
	<s:Button id="btn_2" x="71" y="214" label="按钮_2"/>
	<s:BorderContainer id="bc" x="111" y="77" width="85" height="69" backgroundColor="#75FA51">
	</s:BorderContainer>
	<s:Label x="27" y="10" text="点击下面组件进行拖放或者调整大小" width="200" height="24" verticalAlign="middle"/>
	<s:Label id="lbl" x="224" y="223" text="标签组件"/>
</s:Application>

 效果图：



 有时间在继续写了。累了。
 

  • 大小: 3.8 KB
  • 大小: 16 KB
  • 大小: 18.2 KB
2
顶
10
踩
分享到：
| java zip
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    flex设计器功能拆分之二(撤销与恢复)

    在Flex设计器中，这一功能同样得到了充分的实现，使得开发者可以更加灵活地管理和调整他们的代码和设计。 撤销功能（通常通过快捷键Ctrl+Z触发）允许用户取消最近的一次操作，如删除、移动或修改元素。这对于尝试...

    flex基础教程 富客户端技术

    Flex中的布局管理器能够自动调整组件的位置和大小，以适应不同的屏幕尺寸和分辨率。常见的布局有垂直布局、水平布局、网格布局等，可以根据应用需求选择合适的布局。 5. 数据绑定与AMF Flex支持双向数据绑定，允许...

    Flex之模块化

    模块在Flex中是指一组相关的组件、服务或功能，它们被封装在一个单独的SWF文件中，可以在运行时动态加载和卸载。这样，开发者可以将一个大的应用程序拆分成多个模块，每个模块专注于特定的功能区域。 2. **模块的...

    FLEX 编程入门教程及操作说明

    同时，Flex的模块化设计允许你将大型应用拆分为多个独立的模块，以提高加载速度和维护性。 总的来说，Flex编程入门教程将帮助你掌握如何使用Flex Builder 3创建、设计和实现富互联网应用程序。通过学习和实践，你将...

    Flex4 Dashboard

    通过分析这些文件，我们可以学习如何组织一个Flex4项目，理解其构建过程，并研究如何将Flex3的组件和设计模式迁移到Flex4。对于初学者来说，这是一个很好的实践案例，可以深入理解Flex4的新特性和最佳实践。

    ssh+flex配置

    它允许将页面拆分为多个组件，每个组件可以独立设计和重用。 5. **i18n（国际化）**：通过提供不同语言的资源文件，i18n使应用程序能够支持多种语言。在`web.xml`中配置`ResourceBundle`，并使用`&lt;resource-bundle&gt;...

    Flex 3 RIA开发详解与精深实践

    《Flex 3 RIA开发详解与精深实践——企业级Web应用与AIR桌面应用》一书深入探讨了Flex 3在实际项目中的应用，涵盖了从基础到高级的各种技术，包括组件设计、数据绑定、服务集成、动画效果以及Adobe AIR的桌面应用...

    FLEX从入门到精通(中文高清版)

    《FLEX从入门到精通(中文高清版)》是一本专为初学者设计的全面教程，旨在帮助读者快速掌握Adobe Flex这一强大的富互联网应用程序（RIA）开发框架。Flex以其丰富的用户界面组件、强大的数据绑定机制和高效的编程模型...

    WuxWeapp微信小程序自定义UI组件

    1. 合理拆分组件：根据功能和复用性将组件划分，避免过度复杂化。 2. 模块化管理：使用模块化思想组织代码，提高代码可读性和维护性。 3. 优化性能：合理使用wx:if和wx:key，避免不必要的渲染。 4. 充分利用微信小...

    Flex4Cookbook

    《Flex4 Cookbook》是一本专为Flex 4开发者编写的实战指南，旨在帮助读者深入理解和高效运用Adobe Flex 4框架进行富互联网应用（RIA）的开发。这本书是继《Flex 3 Cookbook》之后的更新版，针对Flex 4的新特性、新...

    基于Vue20的Mobile组件库mlui

    2. **组件化**: Vue的组件系统是其强大之处，允许开发者将UI拆分成独立、可复用的组件，提高了代码的可维护性和可重用性。 3. **指令系统**: 如`v-if`、`v-for`、`v-bind`等，使得数据绑定和逻辑控制变得简单。 4. *...

    Flex 模块化应用程序开发

    通过采用模块化的开发方式，开发者可以将大型的应用程序拆分成多个小的、可重用的组件或模块，这不仅有助于提高代码的可维护性，还能让应用程序更加灵活和高效。 #### 核心概念：Flex中的模块(Module) 在Flex中，`...

    AS3实现登录功能重构

    组件化是一种将应用程序拆分为可重用、独立单元的方法，这有助于提高代码的可维护性和可扩展性。在AS3中，我们可以创建自定义组件，如登录框和按钮，以便在多个项目中重复使用。下面是如何实现这一目标的步骤： 1. ...

    Altium Designer Beta 19.0.10完整版安装包+安装教程+和谐文件

    修复了刚度Flex设计在等轴测视图和具有真几何的Board装配视图中显示不正确的问题。 22669 改进了Dimension对象点的捕捉行为。 24616 修复了（特定用户的设计）导出到PDF （BC：9184）后出现“绘图员文档已过期”的...

    Cairngrom教程

    - **未来发展**：虽然Flex不再是最热门的技术栈之一，但Cairngorm仍然有着广泛的社区支持和持续的维护。 #### 二、客户端状态管理 在Flex应用程序中，有效地管理客户端状态是非常重要的。Cairngorm通过其模型定位...

    PureMVC最佳实践[中文版].pdf

    尽管PureMVC最初是为Flash和Flex设计的，但它已经成功地移植到了其他平台和环境中，证明了其设计的普适性和有效性。总之，PureMVC是一个值得学习和应用的框架，特别是在构建复杂的客户端应用程序时。

    基于Vue3实现的仿小米商城项目源代码+项目详细文档

    - 小米商城项目的各个页面（如商品列表、商品详情、购物车、订单结算等）会被拆分为多个独立的Vue组件，每个组件负责一部分功能，这样有利于代码复用和团队协作。 5. **响应式设计**： - 项目可能采用了Flex布局...

    使用vue全家桶做的高仿知乎日报

    5. **组件化开发**：Vue.js的组件化思想是其强大之处，允许我们将UI拆分成可复用的组件，每个组件都有自己的独立逻辑和视图。在高仿知乎日报项目中，可以创建如文章列表、文章详情、评论区等组件，提高代码复用性和...

    Flash Builder4入门电子书(例子包)

    6. **Flex模块化开发**：如果包含模块化示例，会展示如何拆分大型应用为多个模块，以提高性能和维护性。 通过这个例子包，初学者可以逐步理解并实践Flash Builder 4中的关键概念和技术，如MXML和ActionScript的结合...

Magicbox
Global site tag (gtag.js) - Google Analytics