minimalcomps を使ってコンポーネントを作ってみた
minimalcomps を使ってコンポーネントを作ってみた
InputTextAndHSlider ( InputText と HSlider のセット )
ClearColorPanel ( 透明度も指定できるパネル )
SlidePanel ( スライド機能付き ClearColorPanel )
InputTextEx ( InputText に change Event を付加、Event メタデータタグを付加 )
HSliderEx ( HSlider に Event メタデータタグを付加 )
@author tkinjo
/**
* Copyright tkinjo ( http://wonderfl.net/user/tkinjo )
* MIT License ( http://www.opensource.org/licenses/mit-license.php )
* Downloaded from: http://wonderfl.net/c/ghfH
*/
package
{
import flash.display.*;
import flash.events.*;
[SWF(width="465", height="465", backgroundColor="0xffffff", frameRate="60")]
/**
* minimalcomps を使ってコンポーネントを作ってみた
*
* InputTextAndHSlider ( InputText と HSlider のセット )
* ClearColorPanel ( 透明度も指定できるパネル )
* SlidePanel ( スライド機能付き ClearColorPanel )
*
* InputTextEx ( InputText に change Event を付加、Event メタデータタグを付加 )
* HSliderEx ( HSlider に Event メタデータタグを付加 )
*
* @author tkinjo
*/
public class Main extends Sprite
{
private var stageWidth:Number = stage.stageWidth;
private var stageHeight:Number = stage.stageHeight;
private var configPanel:SlidePanel;
private var gridNumInputTextAndHSlider:InputTextAndHSlider;
public function Main()
{
setComponent();
}
private function setComponent():void {
configPanel = new SlidePanel( 0, 0, stageWidth, 36 );
addChild( configPanel );
// gridNumInputTextAndHSlider
gridNumInputTextAndHSlider = new InputTextAndHSlider( configPanel, 10, 10, "gridNum" );
gridNumInputTextAndHSlider.label.width = 50;
gridNumInputTextAndHSlider.inputText.width = 30;
gridNumInputTextAndHSlider.round = 0;
gridNumInputTextAndHSlider.value = 10;
gridNumInputTextAndHSlider.hSlider.width = 330;
gridNumInputTextAndHSlider.addEventListener(Event.CHANGE, function( event:Event ):void {
draw();
} );
draw();
}
private function draw():void {
graphics.clear();
graphics.lineStyle( 1, 1, 0.1 );
var gridNum:int = gridNumInputTextAndHSlider.value;
for ( var i:int = 0; i < gridNum + 1; i++ ) {
graphics.moveTo( 0, stageHeight / gridNum * i );
graphics.lineTo( stageWidth, stageHeight / gridNum * i );
graphics.moveTo( stageWidth / gridNum * i, 0 );
graphics.lineTo( stageWidth / gridNum * i, stageHeight );
}
}
}
}
import com.bit101.components.*;
import flash.display.*;
import flash.events.*;
import flash.text.*;
import org.libspark.betweenas3.BetweenAS3;
import org.libspark.betweenas3.easing.Cubic;
class LabelEx extends Label {
/**
* Dispatched after a control value is modified, unlike the textInput event, which is dispatched before the value is modified.
* @eventType flash.events.Event.CHANGE
*/
[Event(name = "change", type = "flash.events.Event")]
/**
* ...
* @eventType com.bit101.components.Component.DRAW
*/
[Event(name = "draw", type = "com.bit101.components.Component")]
private var textField:TextField;
public function LabelEx(parent:DisplayObjectContainer = null, xpos:Number = 0, ypos:Number = 0, text:String = ""):void
{
super(parent, xpos, ypos, text);
}
/**
* Initializes the component.
*/
override protected function init():void
{
super.init();
setSize(100, 16);
}
/**
* Creates and adds the child display objects of this component.
*/
override protected function addChildren():void
{
super.addChildren();
for ( var i:uint = 0; i < numChildren; i++ ) {
var child:DisplayObject = getChildAt( i );
if ( child is TextField ) {
textField = child as TextField;
break;
}
}
}
}
class InputTextEx extends InputText {
/**
* Dispatched after a control value is modified, unlike the textInput event, which is dispatched before the value is modified.
* @eventType flash.events.Event.CHANGE
*/
[Event(name = "change", type = "flash.events.Event")]
/**
* ...
* @eventType com.bit101.components.Component.DRAW
*/
[Event(name = "draw", type = "com.bit101.components.Component")]
private var textField:TextField;
public function InputTextEx(parent:DisplayObjectContainer = null, xpos:Number = 0, ypos:Number = 0, text:String = "", defaultHandler:Function = null)
{
super( parent, xpos, ypos, text, defaultHandler );
}
/**
* Creates and adds child display objects.
*/
override protected function addChildren():void
{
super.addChildren();
for ( var i:uint = 0; i < numChildren; i++ ) {
var child:DisplayObject = getChildAt( i );
if ( child is TextField ) {
textField = child as TextField;
break;
}
}
textField.autoSize = TextFieldAutoSize.LEFT;
}
protected override function onChange(event:Event):void
{
super.onChange( event );
dispatchEvent( event );
}
}
class HSliderEx extends HSlider {
/**
* Dispatched after a control value is modified, unlike the textInput event, which is dispatched before the value is modified.
* @eventType flash.events.Event.CHANGE
*/
[Event(name = "change", type = "flash.events.Event")]
/**
* ...
* @eventType com.bit101.components.Component.DRAW
*/
[Event(name = "draw", type = "com.bit101.components.Component")]
public function HSliderEx(parent:DisplayObjectContainer = null, xpos:Number = 0, ypos:Number = 0, defaultHandler:Function = null):void
{
super(parent, xpos, ypos, defaultHandler);
}
}
class InputTextAndHSlider extends Sprite {
/**
* Dispatched after a control value is modified, unlike the textInput event, which is dispatched before the value is modified.
* @eventType flash.events.Event.CHANGE
*/
[Event(name = "change", type = "flash.events.Event")]
/**
* label
*/
public function get label():Label {
return _label;
}
private var _label:Label;
/**
* inputText
*/
public function get inputText():InputTextEx {
return _inputText;
}
private var _inputText:InputTextEx;
/**
* hSlider
*/
public function get hSlider():HSliderEx {
return _hSlider;
}
private var _hSlider:HSliderEx;
/**
* round
*/
public var round:int = 2;
/**
* value
*/
public function get value():Number {
return _value;
}
public function set value( tempValue:Number ):void {
hSlider.value = tempValue;
_value = Math.round( hSlider.value * Math.pow( 10, round ) ) / Math.pow( 10, round );
if ( !isNaN( value ) )
inputText.text = value.toString();
dispatchEvent( new Event( Event.CHANGE ) );
}
private var _value:Number;
/**
*
* @param parent
* @param xpos
* @param ypos
* @param text
*/
public function InputTextAndHSlider(parent:DisplayObjectContainer=null, xpos:Number=0, ypos:Number=0, text:String = ""):void
{
parent.addChild( this );
x = xpos;
y = ypos;
// label
_label = new LabelEx( this, 0, 0, text );
// inputText
_inputText = new InputTextEx( this );
inputText.restrict = "-0-9.";
updateInputTextPosition( label );
// hSlider
_hSlider = new HSliderEx( this );
hSlider.backClick = true;
updateHSliderPosition( inputText );
// hSlider eventlistener
label.addEventListener(Event.RESIZE, function( event:Event ):void {
updateInputTextPosition( label );
} );
// inputText eventlistener
inputText.addEventListener(Event.CHANGE, function( event:Event ):void {
value = parseFloat( inputText.text );
} );
inputText.addEventListener(Component.DRAW, function( event:Event ):void {
updateHSliderPosition( inputText );
} );
inputText.addEventListener(FocusEvent.FOCUS_OUT, function( event:FocusEvent ):void {
if ( isNaN( value ) )
inputText.text = "0";
} );
// hSlider eventlistener
hSlider.addEventListener(Event.CHANGE, function( event:Event ):void {
value = hSlider.value;
} );
}
/**
*
* @param component
*/
private function updateInputTextPosition( component:DisplayObject ):void {
inputText.y = component.y + ( component.height - inputText.height ) / 2;
inputText.x = ( component.x + component.width ) + ( inputText.y - component.y );
}
/**
*
* @param component
*/
private function updateHSliderPosition( component:Component ):void {
hSlider.y = component.y + ( component.height - hSlider.height ) / 2;
hSlider.x = ( component.x + component.width ) + ( hSlider.y - component.y );
}
}
class ClearColorPanel extends Sprite {
private var _backgroundColor:Number;
public function get backgroundColor():Number { return _backgroundColor; }
public function set backgroundColor(value:Number):void
{
_backgroundColor = value;
draw();
}
private var _backgroundAlpha:Number;
public function get backgroundAlpha():Number { return _backgroundAlpha; }
public function set backgroundAlpha(value:Number):void
{
_backgroundAlpha = value;
draw();
}
private var _width:Number;
public override function get width():Number { return _width; }
public override function set width(value:Number):void
{
_width = value;
draw();
}
private var _height:Number;
public override function get height():Number { return _height; }
public override function set height(value:Number):void
{
_height = value;
draw();
}
public function ClearColorPanel( x:Number = 0, y:Number = 0, width:Number = 0, height:Number = 0, alpha:Number = 1, backgroundColor:int = 0, backgroundAlpha:Number = 0.1 ) {
this.x = x;
this.y = y;
_width = width;
_height = height;
this.alpha = alpha;
_backgroundColor = backgroundColor;
_backgroundAlpha = backgroundAlpha;
draw();
}
public function draw():void {
graphics.clear();
graphics.beginFill( backgroundColor, backgroundAlpha );
graphics.drawRect( 0, 0, width, height );
graphics.endFill();
}
}
class SlidePanel extends Sprite {
private var panel:ClearColorPanel;
private var openCloseSwitchButton:PushButton;
private var open:Boolean;
public override function set width(value:Number):void
{
super.width = value;
panel.width = value;
openCloseSwitchButton.x = width - 20;
}
public override function set height(value:Number):void
{
super.height = height;
panel.height = value;
}
public function SlidePanel( x:Number = 0, y:Number = 0, width:Number = 0, height:Number = 0, alpha:Number = 1, backgroundColor:int = 0, backgroundAlpha:Number = 0.1 ) {
this.x = x;
this.y = y;
panel = new ClearColorPanel( 0, 0, width, height, alpha, backgroundColor, backgroundAlpha );
super.addChild( panel );
openCloseSwitchButton = new PushButton(super, width - 20, 0);
super.addChild( openCloseSwitchButton );
openCloseSwitchButton.width = 20;
openCloseSwitchButton.addEventListener(MouseEvent.CLICK, openCloseSwitchButtonClickHandler );
openCloseSwitchButton.label = "-";
open = true;
}
private function openCloseSwitchButtonClickHandler( event:MouseEvent ):void {
// hide
if ( open )
show();
// show
else
hide();
}
private function show():void {
open = false;
openCloseSwitchButton.label = "+";
BetweenAS3.tween(panel, {y: -panel.height}, null, 0.5, Cubic.easeInOut ).play();
}
private function hide():void {
open = true;
openCloseSwitchButton.label = "-";
BetweenAS3.tween(panel, { y: 0 }, null, 0.5, Cubic.easeInOut ).play();
}
override public function addChild(child:DisplayObject):DisplayObject
{
return panel.addChild(child);
}
override public function addChildAt(child:DisplayObject, index:int):DisplayObject
{
return panel.addChildAt(child, index);
}
}