| <?xml version="1.0" encoding="utf-8"?> |
| <!-- |
| |
| Licensed to the Apache Software Foundation (ASF) under one or more |
| contributor license agreements. See the NOTICE file distributed with |
| this work for additional information regarding copyright ownership. |
| The ASF licenses this file to You under the Apache License, Version 2.0 |
| (the "License"); you may not use this file except in compliance with |
| the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| |
| --> |
| <s:Group xmlns:fc="com.flexcapacitor.controls.*" |
| xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:local="*" |
| xmlns:mx="library://ns.adobe.com/flex/mx" |
| xmlns:s="library://ns.adobe.com/flex/spark" |
| width="100%" |
| xmlns:utils="com.flexcapacitor.utils.*" |
| xmlns:handlers="com.flexcapacitor.handlers.*" |
| xmlns:supportClasses="com.flexcapacitor.effects.supportClasses.*" |
| creationComplete="group1_creationCompleteHandler(event)" > |
| |
| <fx:Script> |
| <![CDATA[ |
| import com.flexcapacitor.controller.Radiate; |
| import com.flexcapacitor.events.RadiateEvent; |
| import com.flexcapacitor.utils.InspectorUtils; |
| import com.flexcapacitor.utils.TypeUtils; |
| |
| import mx.collections.ArrayList; |
| import mx.core.IVisualElement; |
| import mx.core.UIComponent; |
| import mx.events.FlexEvent; |
| import mx.managers.SystemManager; |
| |
| import spark.components.Image; |
| import spark.components.supportClasses.GroupBase; |
| import spark.primitives.BitmapImage; |
| |
| public static const BASELINE:String = "baseline"; |
| public static const BOTTOM:String = "bottom"; |
| public static const HORIZONTAL_CENTER:String = "horizontalCenter"; |
| public static const LEFT:String = "left"; |
| |
| public static const PERCENT_HEIGHT:String = "percentHeight"; |
| public static const PERCENT_WIDTH:String = "percentWidth"; |
| public static const RIGHT:String = "right"; |
| public static const TOP:String = "top"; |
| public static const VERTICAL_CENTER:String = "verticalCenter"; |
| |
| public static const X:String = "x"; |
| public static const Y:String = "y"; |
| |
| [Bindable] |
| public var targetActualHeight:Number; |
| |
| [Bindable] |
| public var targetActualWidth:Number; |
| |
| [Bindable] |
| public var targetBottom:Number; |
| |
| [Bindable] |
| public var targetHeight:Number; |
| |
| [Bindable] |
| public var targetHorizontal:Number; |
| |
| [Bindable] |
| public var targetLeft:Number; |
| |
| [Bindable] |
| public var targetPercentHeight:Number; |
| |
| [Bindable] |
| public var targetPercentWidth:Number; |
| |
| [Bindable] |
| public var targetRight:Number; |
| |
| [Bindable] |
| public var targetTop:Number; |
| |
| [Bindable] |
| public var targetVertical:Number; |
| |
| [Bindable] |
| public var targetWidth:Number; |
| |
| [Bindable] |
| public var targetX:Number; |
| |
| [Bindable] |
| public var targetY:Number; |
| |
| |
| private var _target:DisplayObject; |
| private var _visualElement:IVisualElement; |
| |
| [Bindable] |
| public var isVisualElement:Boolean; |
| |
| /** |
| * Clears the target dimension variables which updates any element |
| * bound to them |
| * */ |
| public function clearTargetDimensions():void { |
| |
| if (_target) { |
| if (target is SystemManager) { |
| target.removeEventListener(Event.RESIZE, updateTargetOutline); |
| } |
| else { |
| _target.removeEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline); |
| if (_target.parent) { |
| _target.parent.removeEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline); |
| } |
| } |
| InspectorUtils.clearSelection(_target, systemManager); |
| } |
| |
| targetWidth = undefined; |
| targetHeight = undefined; |
| targetX = undefined; |
| targetY = undefined; |
| |
| targetTop = undefined; |
| targetBottom = undefined; |
| targetLeft = undefined; |
| targetRight = undefined; |
| targetVertical = undefined; |
| targetHorizontal = undefined; |
| targetPercentWidth = undefined; |
| targetPercentHeight = undefined; |
| |
| } |
| |
| /** |
| * Gets the current properties of the target and updates the properties inspector |
| * with those values |
| * */ |
| public function initializeProperties():void { |
| var bitmap:BitmapImage; |
| var image:Image; |
| |
| if (isVisualElement) { |
| constraintsContainer.enabled = true; |
| |
| // get constraints |
| targetTop = Number(element.top); |
| targetBottom = Number(element.bottom); |
| targetLeft = Number(element.left); |
| targetRight = Number(element.right); |
| targetVertical = Number(element.verticalCenter); |
| targetHorizontal = Number(element.horizontalCenter); |
| targetPercentWidth = Number(element.percentWidth); |
| targetPercentHeight = Number(element.percentHeight); |
| } |
| else { |
| constraintsContainer.enabled = false; |
| } |
| |
| if (target.width == 0 || target.height == 0) { |
| |
| if (target is BitmapImage) { |
| bitmap = BitmapImage(target); |
| targetWidth = bitmap.sourceWidth; |
| targetHeight = bitmap.sourceHeight; |
| targetActualWidth = bitmap.sourceWidth; |
| targetActualHeight = bitmap.sourceHeight; |
| } |
| else if (target is Image) { |
| image = Image(target); |
| targetWidth = image.sourceWidth; |
| targetHeight = image.sourceHeight; |
| targetActualWidth = image.sourceWidth; |
| targetActualHeight = image.sourceHeight; |
| } |
| } |
| else { |
| targetWidth = target.width; |
| targetHeight = target.height; |
| } |
| |
| targetX = target.x; |
| targetY = target.y; |
| |
| if (target is SystemManager) { |
| target.addEventListener(Event.RESIZE, updateTargetOutline, false, 0, true); |
| } |
| else { |
| target.addEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline, false, 0, true); |
| if (target.parent) { |
| target.parent.addEventListener(FlexEvent.UPDATE_COMPLETE, updateTargetOutline, false, 0, true); |
| } |
| } |
| |
| updateTargetDimensionsLayout(); |
| |
| } |
| |
| public function get target():Object { |
| return _target; |
| } |
| |
| public function get element():IVisualElement { |
| return _visualElement; |
| } |
| |
| [Bindable] |
| public function set target(value:Object):void { |
| |
| if (!(value is DisplayObject)) { |
| _target = null; |
| clearForm(); |
| clearTargetDimensions(); |
| return; |
| } |
| |
| clearForm(); |
| clearTargetDimensions(); |
| |
| _target = value as DisplayObject; |
| |
| if (value is IVisualElement) { |
| isVisualElement = true; |
| _visualElement = IVisualElement(value); |
| } |
| else { |
| isVisualElement = false; |
| _visualElement = undefined; |
| } |
| |
| if (value) { |
| initializeProperties(); |
| } |
| |
| updateTargetDimensionsLayout(); |
| |
| } |
| |
| public function update():void { |
| updateTargetDimensionsLayout(); |
| } |
| |
| /** |
| * Updates the target dimension layout inspector |
| * */ |
| public function updateTargetDimensionsLayout():void { |
| |
| // check if the layout panel has been created yet |
| if (target == null) { |
| return; |
| } |
| |
| // if target is a container we show the layout options |
| if (target is GroupBase) { |
| var layoutName:String = flash.utils.getQualifiedClassName(GroupBase(target).layout); |
| |
| for each (var item:Object in ArrayList(layoutLayoutComboBox.dataProvider).source) { |
| if (item.label == layoutName) { |
| layoutLayoutComboBox.selectedItem = item; |
| } |
| } |
| } |
| |
| // new values aren't always committed on the same frame |
| if (target.parent is UIComponent) { |
| UIComponent(target.parent).validateNow(); |
| } |
| else if (target is UIComponent) { |
| UIComponent(target).validateNow(); |
| } |
| |
| updateView(); |
| //callLater(updateView); |
| |
| } |
| |
| public function updateView():void { |
| |
| // update UI |
| updateXProperty(); |
| updateYProperty(); |
| |
| updateTopConstraint(); |
| updateBottomConstraint(); |
| updateLeftConstraint(); |
| updateRightConstraint(); |
| |
| updateHorizontalCenterConstraint(); |
| updateVerticalCenterConstraint(); |
| |
| updateWidthProperty(); |
| updateHeightProperty(); |
| |
| updateVisibleControls(); |
| |
| updateTargetOutline(); |
| |
| visibleCheckbox.selected = target.visible; |
| } |
| |
| protected function applyPropertiesToTargetHandler(event:Event):void { |
| if (event.currentTarget is ComboBox && event.currentTarget.selectedIndex != -1) { |
| TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.selectedItem.name, event.currentTarget.selectedItem.label, event.currentTarget.selectedItem.type); |
| } |
| |
| if (event.currentTarget is TextInput) { |
| TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.name, event.currentTarget.text); |
| } |
| |
| if (event.currentTarget is CheckBox) { |
| var value:Boolean = event.currentTarget.selected; |
| TypeUtils.applyProperty(DisplayObject(target), event.currentTarget.name, value, "Boolean"); |
| } |
| |
| updateTargetDimensionsLayout(); |
| } |
| |
| |
| /** |
| * Handles when a constraint checkbox is enabled or disabled |
| * */ |
| protected function constraintHandler(event:Event):void { |
| var enabled:Boolean = event.currentTarget.selected; |
| var constraint:String = event.currentTarget.id; |
| |
| constraint = constraint.split("Constraint")[0]; |
| |
| if (isVisualElement) { |
| if (enabled) { |
| convertToConstraint(constraint); |
| } |
| else { |
| convertFromConstraint(constraint); |
| } |
| } |
| } |
| |
| /** |
| * Convert constraint to property |
| * */ |
| protected function convertFromConstraint(constraint:String):void { |
| var focusComponent:UIComponent; |
| var enabled:Boolean = false; |
| var value:Object; |
| |
| // convert Right to X |
| if (constraint == RIGHT) { |
| element.right = undefined; // relying on flex |
| rightText.text = ""; |
| focusComponent = xText; |
| } |
| |
| // convert from Left to X |
| else if (constraint == LEFT) { |
| element.left = undefined; |
| leftText.text = ""; |
| focusComponent = xText; |
| } |
| |
| // convert from Bottom to Y |
| else if (constraint == BOTTOM) { |
| element.bottom = undefined; |
| bottomText.text = ""; |
| focusComponent = yText; |
| } |
| |
| // convert from Top to Y |
| if (constraint == TOP) { |
| element.top = undefined; |
| topText.text = ""; |
| focusComponent = yText; |
| } |
| |
| // convert from Vertical Center to Y |
| if (constraint == VERTICAL_CENTER) { |
| element.verticalCenter = undefined; |
| verticalCenterText.text = ""; |
| focusComponent = yText; |
| } |
| |
| // convert from Horizontal Center to X |
| if (constraint == HORIZONTAL_CENTER) { |
| value = Object(element.horizontalCenter); |
| element.horizontalCenter = undefined; |
| horizontalCenterText.text = ""; |
| value = String(target.parent.width / 2 - target.width / 2 + Number(value)); |
| target.x = Number(value); |
| focusComponent = xText; |
| } |
| |
| // convert from Baseline to Y |
| if (constraint == BASELINE) { |
| element.baseline = undefined; |
| value = String(target.y); |
| baselineText.text = ""; |
| focusComponent = yText; |
| } |
| |
| |
| // not sure of way to validate an IVisualElement |
| updateTargetDimensionsLayout(); |
| callLater(focusComponent.setFocus); |
| } |
| |
| /** |
| * Convert property value to constraint value |
| * NOTE: Does not take into account all options - could be incorrect |
| * */ |
| protected function convertToConstraint(constraint:String):void { |
| var value:String; |
| var enabled:Boolean = true; |
| var focusComponent:UIComponent; |
| |
| // convert from X to Right |
| if (constraint == RIGHT) { |
| value = String(Number(target.parent.width) - Number(target.width) - Number(target.x)); |
| focusComponent = rightText; |
| } |
| |
| // convert from X to Left |
| else if (constraint == LEFT) { |
| value = String(target.x); |
| focusComponent = leftText; |
| } |
| |
| // convert from Y to Bottom |
| else if (constraint == BOTTOM) { |
| value = String(Number(target.parent.height) - Number(target.height) - Number(target.y)); |
| focusComponent = bottomText; |
| } |
| |
| // convert from Y to Top |
| else if (constraint == TOP) { |
| value = String(target.y); |
| focusComponent = topText; |
| } |
| |
| // convert from Y to Vertical Center |
| else if (constraint == VERTICAL_CENTER) { |
| value = String(target.y - target.parent.height / 2 + target.height / 2); |
| focusComponent = verticalCenterText; |
| } |
| |
| // convert from X to Horizontal Center |
| else if (constraint == HORIZONTAL_CENTER) { |
| value = String(target.x - target.parent.width / 2 + target.width / 2); |
| focusComponent = horizontalCenterText; |
| } |
| |
| // convert from Y to Baseline |
| else if (constraint == BASELINE) { |
| value = String(target.y); |
| focusComponent = rightText; |
| } |
| |
| // not sure of way to validate an IVisualElement |
| target[constraint] = value; |
| updateTargetDimensionsLayout(); |
| callLater(focusComponent.setFocus); |
| |
| // we may need to take into account width and height and percentages |
| } |
| |
| /** |
| * Displays height value taking into account percent height |
| * */ |
| protected function displayCorrectHeight():void { |
| var isPercentHeight:Boolean; |
| |
| if (isVisualElement) { |
| isPercentHeight = Boolean(element.percentHeight); |
| } |
| |
| if (isPercentHeight) { |
| heightText.text = String(element.percentHeight) + "%"; |
| } |
| else { |
| heightText.text = String(target.height); |
| } |
| } |
| |
| /** |
| * Displays width value taking into account percent width |
| * */ |
| protected function displayCorrectWidth():void { |
| var isPercentWidth:Boolean; |
| |
| if (isVisualElement) { |
| isPercentWidth = Boolean(element.percentWidth); |
| } |
| |
| if (isPercentWidth) { |
| widthText.text = String(element.percentWidth) + "%"; |
| } |
| else { |
| widthText.text = String(target.width); |
| } |
| } |
| |
| /** |
| * Casts the value to the correct type |
| * NOTE: May not work for colors |
| * Also supports casting to specific class. use ClassDefinition as type |
| * returns instance of flash.utils.getDefinitionByName(className) |
| * */ |
| protected function getCorrectType(value:String, type:String):* { |
| if (type == "Boolean" && value.toLowerCase() == "false") { |
| return false; |
| } |
| else if (type == "Boolean" && value.toLowerCase() == "true") { |
| return true; |
| } |
| else if (type == "Number") { |
| if (value == null || value == "") { |
| return undefined |
| }; |
| return Number(value); |
| } |
| else if (type == "int") { |
| if (value == null || value == "") { |
| return undefined |
| }; |
| return int(value); |
| } |
| else if (type == "String") { |
| return String(value); |
| } |
| // TODO: Return color type |
| else if (type == "Color") { |
| return String(value); |
| } |
| else if (type == "ClassDefinition") { |
| if (value) { |
| var ClassDefinition:Class = flash.utils.getDefinitionByName(value) as Class; |
| return new ClassDefinition(); |
| } |
| return new Object(); |
| } |
| else { |
| return value; |
| } |
| } |
| |
| /** |
| * Returns true if left, right or horizontalCenter is set |
| * */ |
| protected function get hasHorizontalConstraints():Boolean { |
| var hasConstraints:Boolean; |
| |
| if (isVisualElement && (element.left || element.right || element.horizontalCenter)) { |
| hasConstraints = true; |
| } |
| |
| return hasConstraints; |
| } |
| |
| /** |
| * Returns true if top, bottom, verticalCenter or baseline is set |
| * */ |
| protected function get hasVerticalConstraints():Boolean { |
| var hasConstraints:Boolean; |
| |
| if (isVisualElement && (element.top || element.bottom || element.verticalCenter || element.baseline)) { |
| hasConstraints = true; |
| } |
| |
| return hasConstraints; |
| } |
| |
| /** |
| * Selects all the text in the text field |
| * */ |
| protected function selectInputText(event:Event):void { |
| TextInput(event.currentTarget).selectAll(); |
| } |
| |
| /** |
| * Sets the baseline constraint |
| * */ |
| protected function setBaselineConstraint(value:Object):void { |
| element.baseline = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the bottom constraint |
| * */ |
| protected function setBottomConstraint(value:Object):void { |
| element.bottom = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the horizontal center constraint |
| * */ |
| protected function setHorizontalCenterConstraint(value:Object):void { |
| element.horizontalCenter = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the left constraint |
| * */ |
| protected function setLeftConstraint(value:Object):void { |
| element.left = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the right constraint |
| * */ |
| protected function setRightConstraint(value:Object):void { |
| element.right = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the top constraint |
| * */ |
| protected function setTopConstraint(value:Object):void { |
| element.top = value ? value : undefined; |
| } |
| |
| /** |
| * Sets the vertical center constraint |
| * */ |
| protected function setVerticalCenterConstraint(value:Object):void { |
| element.verticalCenter = value ? value : undefined; |
| } |
| |
| /** |
| * Updates the display with the value of the baseline position |
| * */ |
| protected function updateBaselineConstraint():void { |
| var baselineValue:Object; |
| |
| if (!isVisualElement) { |
| baselineText.text = ""; |
| return; |
| } |
| |
| baselineValue = element.baseline; |
| |
| /** |
| * If baseline is set then set Y to nothing |
| * If baseline and bottom are set then set height to nothing |
| * If verticalCenter is set then set baseline to nothing |
| * Otherwise set baseline to nothing |
| * */ |
| if (baselineValue) { |
| baselineText.text = String(baselineValue); |
| |
| // baseline is set so do not display Y |
| yText.text = ""; |
| } |
| else { |
| baselineText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the bottom position |
| * */ |
| protected function updateBottomConstraint():void { |
| var bottomValue:Object; |
| |
| if (!isVisualElement) { |
| bottomText.text = ""; |
| return; |
| } |
| |
| bottomValue = element.bottom; |
| |
| /** |
| * If bottom is set then set Y to nothing |
| * If bottom and bottom are set then set height to nothing |
| * If verticalCenter is set then set bottom to nothing |
| * Otherwise set bottom to nothing |
| * */ |
| if (bottomValue) { |
| bottomText.text = String(bottomValue); |
| |
| // if top and bottom are set then hide height |
| if (element.top) { |
| heightText.text = ""; |
| } |
| |
| // bottom is set so do not display Y |
| yText.text = ""; |
| } |
| else { |
| bottomText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the height |
| * */ |
| protected function updateHeightProperty():void { |
| var isPercentHeight:Boolean; |
| |
| /** |
| * If visual element and top is set and bottom is set then do not display height |
| * */ |
| if (isVisualElement && element.top != null && element.bottom != null) { |
| heightText.text = ""; |
| } |
| else { |
| displayCorrectHeight(); |
| } |
| } |
| |
| /** |
| * Updates the display with the value of the left constraint |
| * */ |
| protected function updateHorizontalCenterConstraint():void { |
| var value:String; |
| var horizontalCenterValue:Object; |
| |
| if (!isVisualElement) { |
| horizontalCenterText.text = ""; |
| return; |
| } |
| |
| horizontalCenterValue = element.horizontalCenter; |
| |
| /** |
| * If left is set then set x to nothing |
| * If left and right are set then set width to nothing |
| * If horizontalCenter is set than set left and right to nothing |
| * Otherwise set left to nothing |
| * */ |
| if (horizontalCenterValue) { |
| horizontalCenterText.text = String(horizontalCenterValue); |
| |
| // left is set so do not display X |
| xText.text = ""; |
| } |
| else { |
| horizontalCenterText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the left constraint |
| * */ |
| protected function updateLeftConstraint():void { |
| var value:String; |
| var leftValue:Object; |
| |
| if (!isVisualElement) { |
| leftText.text = ""; |
| return; |
| } |
| |
| leftValue = element.left; |
| |
| /** |
| * If left is set then set x to nothing |
| * If left and right are set then set width to nothing |
| * If horizontalCenter is set than set left and right to nothing |
| * Otherwise set left to nothing |
| * */ |
| if (leftValue) { |
| leftText.text = String(leftValue); |
| |
| // if left and right are set then hide width |
| if (element.right) { |
| widthText.text = ""; |
| } |
| |
| // left is set so do not display X |
| xText.text = ""; |
| } |
| else { |
| leftText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the right position |
| * */ |
| protected function updateRightConstraint():void { |
| var value:String; |
| var rightValue:Object; |
| |
| if (!isVisualElement) { |
| rightText.text = ""; |
| return; |
| } |
| |
| rightValue = element.right; |
| |
| /** |
| * If horizontalCenter is set then set right to nothing |
| * If left and right are set then set width to nothing |
| * If horizontalCenter is set than set left and right to nothing |
| * Otherwise set right to nothing |
| * */ |
| if (rightValue) { |
| rightText.text = String(rightValue); |
| |
| // if left and right are set then hide width |
| if (element.left) { |
| widthText.text = ""; |
| } |
| |
| // right is set so do not display X |
| xText.text = ""; |
| } |
| else { |
| rightText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the top position |
| * */ |
| protected function updateTopConstraint():void { |
| var value:String; |
| var topValue:Object; |
| |
| if (!isVisualElement) { |
| topText.text = ""; |
| return; |
| } |
| |
| topValue = element.top; |
| |
| /** |
| * If top is set then set Y to nothing |
| * If top and bottom are set then set height to nothing |
| * If verticalCenter is set then set top to nothing |
| * Otherwise set top to nothing |
| * */ |
| if (topValue != null) { |
| topText.text = String(topValue); |
| |
| // if top and bottom are set then do not display height |
| if (element.bottom) { |
| heightText.text = ""; |
| } |
| |
| // top is set so do not display Y |
| yText.text = ""; |
| } |
| else { |
| topText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the display with the value of the vertical center position |
| * */ |
| protected function updateVerticalCenterConstraint():void { |
| var verticalCenterValue:Object; |
| |
| if (!isVisualElement) { |
| verticalCenterText.text = ""; |
| return; |
| } |
| |
| verticalCenterValue = element.verticalCenter; |
| |
| if (verticalCenterValue) { |
| verticalCenterText.text = String(verticalCenterValue); |
| |
| // vertical center is set so do not display Y |
| yText.text = ""; |
| } |
| else { |
| verticalCenterText.text = ""; |
| } |
| |
| } |
| |
| /** |
| * Updates the visibility of the outline in the contraint box |
| * */ |
| public function updateTargetOutline(event:Event=null):void { |
| InspectorUtils.drawSelection(target, systemManager); |
| } |
| |
| /** |
| * Updates the visibility of the rulers and text boxes in the contraints container |
| * and checks or unchecks the constraint checkboxes |
| * */ |
| protected function updateVisibleControls():void { |
| var visible:Boolean = true; |
| |
| topConstraint.selected = topRule.visible = topText.visible = (isVisualElement && element.top != null) ? visible : !visible; |
| |
| rightConstraint.selected = bottomRule.visible = bottomText.visible = (isVisualElement && element.bottom != null) ? visible : !visible; |
| |
| leftConstraint.selected = leftRule.visible = leftText.visible = (isVisualElement && element.left != null) ? visible : !visible; |
| |
| rightConstraint.selected = rightRule.visible = rightText.visible = (isVisualElement && element.right != null) ? visible : !visible; |
| |
| horizontalCenterConstraint.selected = horizontalCenterRule.visible = horizontalCenterText.visible = (isVisualElement && element.horizontalCenter != null) ? visible : !visible; |
| |
| verticalCenterConstraint.selected = verticalCenterRule.visible = verticalCenterText.visible = (isVisualElement && element.verticalCenter != null) ? visible : !visible; |
| |
| baselineConstraint.selected = baselineRule.visible = baselineText.visible = (isVisualElement && element.baseline != null) ? visible : !visible; |
| |
| // this throws an error, element is null, when target is system manager |
| // we should disable constraints if not supported |
| copyConstraints(constrainedTarget, element, 0); |
| } |
| |
| protected function copyConstraints(target:IVisualElement, source:IVisualElement, setValue:Object=null):void { |
| setValue = setValue!=null ? 1 : setValue; |
| |
| // this throws an error when target is system manager |
| // we should disable constraints if not supported |
| if (element == null) return; |
| |
| target.top = (element.top != null) ? setValue || element.top : undefined; |
| |
| target.bottom = (element.bottom != null) ? setValue || element.bottom : undefined; |
| |
| target.left = (element.left != null) ? setValue || element.left : undefined; |
| |
| target.right = (element.right != null) ? setValue || element.right : undefined; |
| |
| target.horizontalCenter = (element.horizontalCenter != null) ? setValue || element.horizontalCenter : undefined; |
| |
| target.verticalCenter = (element.verticalCenter != null) ? setValue || element.verticalCenter : undefined; |
| |
| target.baseline = (element.baseline != null) ? setValue || element.baseline : undefined; |
| |
| } |
| |
| /** |
| * Updates the display with the value of the width |
| * */ |
| protected function updateWidthProperty():void { |
| var isPercentWidth:Boolean; |
| |
| /** |
| * If left is set and right is set then set to nothing |
| * */ |
| if (isVisualElement && element.left != null && element.right != null) { |
| widthText.text = ""; |
| } |
| else { |
| displayCorrectWidth(); |
| } |
| } |
| |
| /** |
| * Updates the displayed with the value of the X position |
| * */ |
| protected function updateXProperty():void { |
| |
| /** |
| * If horizontalCenter is set then set to nothing |
| * If left is set then set to nothing |
| * If right is set then set to nothing |
| * */ |
| if (hasHorizontalConstraints) { |
| xText.text = ""; |
| } |
| else { |
| xText.text = String(target.x); |
| } |
| } |
| |
| /** |
| * Updates the display with the value of the Y position |
| * */ |
| protected function updateYProperty():void { |
| |
| /** |
| * If verticalCenter is set then set to nothing |
| * If top is set then set to nothing |
| * If bottom is set then set to nothing |
| * |
| * if int is 0 will it return false? if (target.top) vs if (target.top!=null) |
| * */ |
| if (hasVerticalConstraints) { |
| // hide Y text |
| yText.text = ""; |
| } |
| else { |
| yText.text = String(target.y); |
| } |
| |
| } |
| |
| public function clearForm():void { |
| xText.text = ""; |
| yText.text = ""; |
| |
| topText.text = ""; |
| leftText.text = ""; |
| rightText.text = ""; |
| bottomText.text = ""; |
| |
| topConstraint.selected = false; |
| leftConstraint.selected = false; |
| rightConstraint.selected = false; |
| bottomConstraint.selected = false; |
| |
| widthText.text = ""; |
| heightText.text = ""; |
| |
| xText.text = ""; |
| xText.text = ""; |
| xText.text = ""; |
| xText.text = ""; |
| xText.text = ""; |
| xText.text = ""; |
| xText.text = ""; |
| |
| visibleCheckbox.selected = false; |
| } |
| |
| public var radiate:Radiate = Radiate.instance; |
| protected function group1_creationCompleteHandler(event:FlexEvent):void {
|
| radiate.addEventListener(RadiateEvent.TARGET_CHANGE, targetChangeHandler);
|
| } |
| |
| protected function targetChangeHandler(event:RadiateEvent):void {
|
| target = event.selectedItem;
|
| } |
| |
| ]]> |
| </fx:Script> |
| |
| <fx:Declarations> |
| <handlers:EventHandler eventName="{FlexEvent.ENTER}" |
| targets="{[ |
| topText, |
| bottomText, |
| rightText, |
| leftText, |
| widthText, |
| heightText, |
| xText, |
| yText, |
| verticalCenterText, |
| horizontalCenterText, |
| baselineText]}" |
| keepEvent="true" |
| id="enterHandler"> |
| <supportClasses:ActionEffect > |
| <supportClasses:effectStart> |
| <![CDATA[ |
| applyPropertiesToTargetHandler(enterHandler.event); |
| //EffectEvent(event).effectInstance.finish(); |
| ]]> |
| </supportClasses:effectStart> |
| </supportClasses:ActionEffect> |
| </handlers:EventHandler> |
| |
| <handlers:EventHandler eventName="{FocusEvent.FOCUS_IN}" |
| targets="{[ |
| topText, |
| bottomText, |
| rightText, |
| leftText, |
| widthText, |
| heightText, |
| xText, |
| yText, |
| verticalCenterText, |
| horizontalCenterText, |
| baselineText]}" |
| keepEvent="true" |
| id="focusInEventHandler"> |
| |
| <supportClasses:ActionEffect > |
| <supportClasses:effectStart> |
| <![CDATA[ |
| selectInputText(focusInEventHandler.event); |
| ]]> |
| </supportClasses:effectStart> |
| </supportClasses:ActionEffect> |
| </handlers:EventHandler> |
| |
| |
| <handlers:EventHandler eventName="{MouseEvent.CLICK}" |
| targets="{[ |
| leftConstraint, |
| rightConstraint, |
| bottomConstraint, |
| topConstraint, |
| baselineConstraint, |
| horizontalCenterConstraint, |
| verticalCenterConstraint]}" |
| keepEvent="true" |
| id="clickHandler"> |
| |
| <supportClasses:ActionEffect > |
| <supportClasses:effectStart> |
| <![CDATA[ |
| constraintHandler(clickHandler.event); |
| ]]> |
| </supportClasses:effectStart> |
| </supportClasses:ActionEffect> |
| |
| </handlers:EventHandler> |
| |
| <s:SolidColorStroke id="stroke1" weight="1" color="#00AA00"/> |
| |
| </fx:Declarations> |
| |
| <!-- POSITIONING --> |
| <s:Group horizontalCenter="0" y="60"> |
| <s:TextInput id="heightText" |
| width="50" x="154" y="0" |
| name="height:Number"/> |
| <s:TextInput id="yText" |
| width="50" x="154" y="35" |
| name="y:Number"/> |
| <s:TextInput id="xText" |
| width="50" x="45" y="35" |
| name="x:Number"/> |
| <s:TextInput id="widthText" |
| width="50" x="44" y="0" |
| name="width:Number"/> |
| <s:RichText text="Height:" x="110" y="7" |
| tabFocusEnabled="false"/> |
| <s:RichText text="Width:" x="2" y="7" |
| tabFocusEnabled="false"/> |
| <s:RichText text="X:" x="26" y="42" |
| tabFocusEnabled="false"/> |
| <s:RichText text="Y:" x="138" y="42" |
| tabFocusEnabled="false"/> |
| </s:Group> |
| |
| |
| <!-- CONSTRAINTS PANEL --> |
| <s:BorderContainer id="constraintsContainer" |
| horizontalCenter="0" |
| y="149" |
| borderVisible="false"> |
| |
| <!-- CONSTRAINTS --> |
| <s:TextInput id="topText" |
| width="40" x="205" y="47" |
| name="top:style"/> |
| <s:TextInput id="verticalCenterText" |
| width="40" x="205" y="95" |
| name="verticalCenter:style"/> |
| <s:TextInput id="bottomText" |
| width="40" x="205" y="143" |
| name="bottom:style"/> |
| <s:TextInput id="baselineText" |
| width="40" x="205" y="165" |
| name="baseline:style"/> |
| |
| <s:TextInput id="rightText" |
| width="40" x="147" y="189" |
| name="right:style"/> |
| <s:TextInput id="horizontalCenterText" |
| width="40" x="99" y="189" |
| name="horizontalCenter:style"/> |
| <s:TextInput id="leftText" |
| width="40" x="50" y="189" |
| name="left:style"/> |
| |
| <s:CheckBox id="leftConstraint" |
| toolTip="Left" |
| x="64" y="8"/> |
| <s:CheckBox id="horizontalCenterConstraint" |
| toolTip="Horizontal Center" |
| x="114" y="8"/> |
| <s:CheckBox id="bottomConstraint" |
| toolTip="Bottom" |
| x="23" y="145"/> |
| <s:CheckBox id="topConstraint" |
| toolTip="Top" |
| x="23" y="48"/> |
| <s:CheckBox id="verticalCenterConstraint" |
| toolTip="Vertical Center" |
| x="23" y="97"/> |
| <s:CheckBox id="rightConstraint" |
| toolTip="Right" |
| x="162" y="8"/> |
| <s:CheckBox id="baselineConstraint" |
| toolTip="Baseline" |
| x="23" y="165"/> |
| |
| <!-- CONSTRAINTS PANEL BOX --> |
| <s:BorderContainer height="150" width="150" |
| x="44" y="31" |
| borderAlpha=".4"> |
| |
| <s:BorderContainer borderColor="#9E9E9E" |
| height="98" width="98" |
| x="25" y="25" |
| borderVisible="true" |
| borderWeight="2"> |
| |
| <s:Group id="constrainedTarget" |
| width="40" height="20"> |
| |
| <s:Rect width="100%" height="100%" |
| x="0" y="0"> |
| <s:fill> |
| <s:SolidColor color="gray"/> |
| </s:fill> |
| </s:Rect> |
| |
| </s:Group> |
| |
| </s:BorderContainer> |
| |
| <!-- HORIZONTAL --> |
| <s:Line id="topRule" |
| left="0" right="0" |
| top="25" |
| width="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| <s:Line id="verticalCenterRule" |
| left="0" right="0" |
| width="100%" |
| verticalCenter="0" |
| stroke="{stroke1}" |
| visible="false"/> |
| <s:Line id="bottomRule" |
| left="0" right="0" |
| bottom="25" |
| width="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| <s:Line id="baselineRule" |
| left="0" right="0" |
| bottom="4" |
| width="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| |
| <!-- VERTICAL --> |
| <s:Line id="leftRule" |
| bottom="0" left="25" |
| top="0" |
| height="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| <s:Line id="horizontalCenterRule" |
| bottom="0" horizontalCenter="0" |
| top="0" |
| height="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| <s:Line id="rightRule" |
| bottom="0" right="25" |
| top="0" |
| height="100%" |
| stroke="{stroke1}" |
| visible="false"/> |
| </s:BorderContainer> |
| |
| </s:BorderContainer> |
| |
| <s:Line left="23.5" right="23.5" |
| y="136" alpha=".5"> |
| <s:stroke> |
| <s:SolidColorStroke/> |
| </s:stroke> |
| </s:Line> |
| |
| <s:Line left="23.5" right="23.5" |
| y="40" alpha=".5"> |
| <s:stroke> |
| <s:SolidColorStroke/> |
| </s:stroke> |
| </s:Line> |
| |
| <s:Label backgroundColor="#FFFFFF" horizontalCenter="0" |
| text="Size and Position" y="35"/> |
| |
| <s:Label backgroundColor="#FFFFFF" horizontalCenter="0" |
| text="Constraints" y="131"/> |
| |
| <s:CheckBox id="visibleCheckbox" |
| label="Visible" x="10" y="5" |
| click="applyPropertiesToTargetHandler(event)" |
| name="visible"/> |
| |
| <s:ComboBox id="layoutLayoutComboBox" |
| horizontalCenter="0" |
| visible="false" width="250" y="376" |
| change="applyPropertiesToTargetHandler(event)" |
| focusOut="applyPropertiesToTargetHandler(event)"> |
| <s:dataProvider> |
| <mx:ArrayList> |
| <fx:Object label="" |
| name="layout" type="ClassDefinition"/> |
| <fx:Object label="spark.layouts::BasicLayout" |
| name="layout" type="ClassDefinition"/> |
| <fx:Object label="spark.layouts::HorizontalLayout" |
| name="layout" type="ClassDefinition"/> |
| <fx:Object label="spark.layouts::TileLayout" |
| name="layout" type="ClassDefinition"/> |
| <fx:Object label="spark.layouts::VerticalLayout" |
| name="layout" type="ClassDefinition"/> |
| </mx:ArrayList> |
| </s:dataProvider> |
| </s:ComboBox> |
| |
| </s:Group> |
