破線で矩形を描く

umhr_hasen破線で矩形を描く。FlashIDE上の描画ツールでは破線の設定があるのに、スクリプトのlineStyleとかで設定できるわけではない。なので、自作しないといけない。

Get Adobe Flash player

▼Wonderfl
http://wonderfl.net/code/9a7dad1e87d1d5a27dbb9e0d2089b894db16cae3

▼ActionScript AS3(FP9)
[sourcecode language=”as3″]
/*
破線のShapeをつくるクラス
動かないけど、太さと色と点線のリズム(?)を変えられる。

参考
http://wonderfl.net/code/99368ea020d8f540aeebfefe47ce835d3dfbb354
* */

package
{
import flash.display.Sprite;
import flash.events.MouseEvent;
/**
* …
* @author umhr
*/
[SWF(backgroundColor="0xF0F8FF")]
public class Main extends Sprite {
private var _bl:BrokenLine;
private var _isMouseDown:Boolean;
public function Main():void {
_bl = new BrokenLine();
_bl.color = 0x0000FF;
_bl.size = 3;
_bl.rhythm = [3,3,8,3,8,3];
_bl.width = 100;
_bl.height = 120;
_bl.fillColor = 0xCCCCFF;
addChild(_bl);
stage.addEventListener(MouseEvent.MOUSE_DOWN,onMouseEvent);
stage.addEventListener(MouseEvent.MOUSE_UP,onMouseEvent);
stage.addEventListener(MouseEvent.MOUSE_MOVE,onMouseEvent);
}
private function onMouseEvent(e:MouseEvent):void{
if(e.type == MouseEvent.MOUSE_DOWN){
_isMouseDown = true;
_bl.x = stage.mouseX;
_bl.y = stage.mouseY;
_bl.width = _bl.height = 1;
}else if(_isMouseDown && (e.type == MouseEvent.MOUSE_UP || e.type == MouseEvent.MOUSE_MOVE)){
_bl.width = stage.mouseX-_bl.x;
_bl.height = stage.mouseY-_bl.y;
}
if(e.type == MouseEvent.MOUSE_UP){
_isMouseDown = false;
}
}
}
}

import flash.display.Shape;
import flash.events.Event;
import flash.geom.Rectangle;
class BrokenLine extends Shape{
//色
private var _color:int;
//線幅
private var _size:Number;
//破線のリズム
private var _rhythm:Array;
//内部計算用
private var _width:Number;
private var _height:Number;
private var _fillColor:int = -1;
public function BrokenLine(rhythm:Array = null,size:Number = 2,color:int = 0x000000,width:Number = 0,height:Number = 0){
_rhythm = rhythm?rhythm:[8,4,2,3];
_size = size;
_color = color;
_width = width;
_height = height;
draw();
};
private function draw():void{
if(_width == 0 || _height == 0){return};
this.graphics.clear();

//幅がマイナスでも描画できるように。
var rect:Rectangle = new Rectangle(0,0,_width,_height);
rect.x = Math.min(rect.width,0);
rect.y = Math.min(rect.height,0);
rect.width = Math.abs(rect.width);
rect.height = Math.abs(rect.height);

//描画
var max:Number = Math.max(rect.width,rect.height);
var tempNum:Number = 0;
var rhythmLength:int = Math.round(rhythm.length/2);
if (_fillColor > -1) {
this.graphics.beginFill(_fillColor);
this.graphics.drawRect(rect.x, rect.y, rect.width, rect.height);
this.graphics.endFill();
}
while (max > tempNum) {
for (var i:int = 0; i < rhythmLength; i++) {
var h:Number;
//縦線
if(rect.height > tempNum){
h = Math.min(rhythm[i*2],rect.height – tempNum);
this.graphics.beginFill(color);
this.graphics.drawRect(rect.x,rect.y+tempNum,size,h);
this.graphics.beginFill(color);
this.graphics.drawRect(rect.right-size,rect.bottom-(tempNum+h),size,h);
this.graphics.endFill();
}
//横線
if(rect.width > tempNum){
h = Math.min(rhythm[i*2],rect.width-tempNum);
this.graphics.beginFill(color);
this.graphics.drawRect(rect.x+tempNum,rect.y,h,size);
this.graphics.beginFill(color);
this.graphics.drawRect(rect.right-(tempNum+h),rect.bottom-size,h,size);
this.graphics.endFill();
}
tempNum += rhythm[i*2];
//破線のリズムが奇数個だった場合、最後の呼び出しはスキップ
if(rhythm.length > i*2+1){
tempNum += rhythm[i*2+1];
}
}
}
}
public function get fillColor():int{return _fillColor;}
public function set fillColor(value:int):void{
_fillColor = value;
draw();
}
public function get color():int{return _color;}
public function set color(value:int):void{
_color = value;
draw();
}
public function get rhythm():Array{return _rhythm;}
public function set rhythm(array:Array):void{
_rhythm = array;
draw();
}
public function get size():Number{return _size;}
public function set size(value:Number):void{
_size = value;
draw();
}
override public function set width(value:Number):void{
_width = value;
draw();
}
override public function set height(value:Number):void{
_height = value;
draw();
}
}
[/sourcecode]