<<  浅谈flex 自定义组件 | 首 页 | wxsr 45度地图编辑器 总结  >>

  • 2009-04-24

    自适应窗口组件

    版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
    http://wxsr.blogbus.com/logs/38426889.html

    发现自带的没有这个组件自己就写了一个简单的，后来才发现第三方有写这个，看来是白写了，下边开源下源码

    有兴趣的可以自己看看 一共就5个文件 ResizeWindow.as是住文件，继承的是TitleWindow

     ResizeWindow.mxml是flex的组件界面直接用就可以了。如果想扩展的可以自己扩展下

    支持拖拉，大小拖动

    --------------------------------ResizeWindow.mxml----------------------------

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Canvas 
     xmlns:wxsr="com.components.resizeWindow.*"
      xmlns:mx="http://www.adobe.com/2006/mxml" width="200" height="200">
     <wxsr:ResizeWindow width="100%" x="0" y="0" height="100%" showCloseButton="true">
     
     </wxsr:ResizeWindow>
    </mx:Canvas>

    -------------------------------------ResizeWindow.as---------------------------------------

     package com.components.resizeWindow
    {
     import flash.events.Event;
     import flash.events.MouseEvent;
     import flash.events.TimerEvent;
     import flash.geom.Point;
     import flash.geom.Rectangle;
     import flash.utils.Timer;
     
     import mx.containers.TitleWindow;
     import mx.effects.Move;
     import mx.effects.Resize;
     import mx.events.MoveEvent;
     import mx.events.TweenEvent;

     public class ResizeWindow extends TitleWindow
     {
      public static const RESIZE:String='resize'
      private var bounds:Rectangle
      public var scaleGrid:ScaleGrid
      private var timer:Timer
      private var _isResize:Boolean=false
      private var _resizeType:String
      private var moveing:Boolean=false
      public var minMax:Boolean=false
      
      public function ResizeWindow()
      {
      super();
      this.showCloseButton=true
      this.timer=new Timer (30)
      this.timer.addEventListener(TimerEvent.TIMER,timerFunc)
      this.isPopUp=true
      this.scaleGrid=new ScaleGrid
       
      //this.scaleGrid.visible=false
      this.scaleGrid.addEventListener(ResizeWindowEvent.RESIZE,resizeFunc)
       
      this.addEventListener(Event.ADDED_TO_STAGE,addedFunc,false,0,true)
       
       
      }
      public function ableResize(bool:Boolean):void
      {
      this.scaleGrid.visible=bool
      }
      public function get isResize():Boolean
      {
      return this._isResize
      }
      public function get resizeType():String
      {
      return this._resizeType
      }
      
      private function timerFunc(event:TimerEvent):void
      {
      if(this._isResize)
      {
      this.moveing=false
      this.removeEventListener(MoveEvent.MOVE,moveFunc)
      var point:Point=new Point(this.parent.parent.mouseX,this.parent.parent.mouseY)
       
      switch (this.resizeType)
      {
       
      case ResizeWindowEvent.TOP_LEFT:
      if(point.x>this.x+this.width-this.scaleGrid.minWidth)point.x=this.x+this.width-this.scaleGrid.minWidth
      if(point.y>this.y+this.height-this.scaleGrid.minHeight)point.y=this.y+this.height-this.scaleGrid.minHeight
      this.scaleGrid.resizeTopLeft(point)
       
      break;
      case ResizeWindowEvent.TOP:
      if(point.y>this.y+this.height-this.scaleGrid.minHeight)point.y=this.y+this.height-this.scaleGrid.minHeight
      this.scaleGrid.resizeTop(point)
      break;
      case ResizeWindowEvent.TOP_RIGHT:
      if(point.y>this.y+this.height-this.scaleGrid.minHeight)point.y=this.y+this.height-this.scaleGrid.minHeight
      this.scaleGrid.resizeTopRight(point)
      break;
      case ResizeWindowEvent.LEFT:
      if(point.x>this.x+this.width-this.scaleGrid.minWidth)point.x=this.x+this.width-this.scaleGrid.minWidth
      this.scaleGrid.resizeLeft(point)
      break;
      case ResizeWindowEvent.RIGHT:
      if(point.x<this.x+this.scaleGrid.minWidth)point.x=this.x+this.scaleGrid.minWidth;
      if(point.y<this.y+this.scaleGrid.minHeight)point.y=this.y+this.scaleGrid.minHeight;
      this.scaleGrid.resizeRight(point)
      break;
      case ResizeWindowEvent.BOUTTON_LEFT:
       
      if(point.x>this.x+this.width-this.scaleGrid.minWidth)point.x=this.x+this.width-this.scaleGrid.minWidth
       
      this.scaleGrid.resizeBouttonLeft(point)
      break;
      case ResizeWindowEvent.BOUTTON:
       
      this.scaleGrid.resizeBoutton(point)
      break;
      case ResizeWindowEvent.BOUTTON_RIGHT:
      if(point.x<this.x+this.scaleGrid.minWidth)point.x=this.x+this.scaleGrid.minWidth;
      if(point.y<this.y+this.scaleGrid.minHeight)point.y=this.y+this.scaleGrid.minHeight;
      this.scaleGrid.resizeBouttonRight(point)
      break;
       
      }
      }
      }
      private function mouseUpFunc(event:MouseEvent):void
      {
       
      if(!this.moveing&&this.isResize){
       
      this._isResize=false
      var resize:Resize=new Resize(this)
      resize.duration=100
      resize.heightTo=this.scaleGrid.rect.height
      resize.widthTo=this.scaleGrid.rect.width
      resize.play()
      var move:Move=new Move(this)
      move.duration=80
      move.xTo=this.scaleGrid.rect.topLeft.x//-this.scaleGrid.top.height*1.5//-this.scaleGrid.top.width
      move.yTo=this.scaleGrid.rect.topLeft.y//-this.scaleGrid.top.height*1.5//-this.scaleGrid.top.width
      move.play()
      resize.addEventListener(TweenEvent.TWEEN_END,endFunc)
      this.timer.stop()
      }
      moveing=false
       
      }
      private function endFunc(event:TweenEvent):void
      {
      moveing=true
      event.target.removeEventListener(TweenEvent.TWEEN_END,endFunc)
      this.scaleGrid.graphics.clear()
       
      this.dispatchEvent(new Event (RESIZE))
      this.addEventListener(MoveEvent.MOVE,moveFunc)
      var time:Timer=new Timer(50)
      time.addEventListener(TimerEvent.TIMER,updataAfterMove)
      time.start()
       
      }
      private function updataAfterMove(event:TimerEvent):void
      {
      var t:Timer=event.currentTarget as Timer
      if(t.currentCount>2){
      t.stop()
      t.removeEventListener(TimerEvent.TIMER,updataAfterMove)
      }
      this.resize()
      this.scaleGrid.graphics.clear()
      }
      
      private function resizeFunc(event:ResizeWindowEvent):void
      {
      this.moveing=false
      this._resizeType=event.resizeType
      this._isResize=true
      this.timer.start()
       
      }
      
      
      
      private function addedFunc(event:Event):void
      {
       
      this.stage.addChild(scaleGrid)
      this.stage.addEventListener(MouseEvent.MOUSE_UP,mouseUpFunc)
      this.addEventListener(MoveEvent.MOVE,moveFunc)
       
      this.addEventListener(Event.ENTER_FRAME,enterFrameFunc)
      }
      private function moveFunc(event:MoveEvent):void
      {
      
       
      this.resize()
      this.scaleGrid.graphics.clear()
       
      }
      private function fitSize(rect:Rectangle):void
      {
      this.x=rect.x
      this.y=rect.y
      this.width=rect.width
      this.height=rect.height
       
      }
      private var num:int=1
      private function enterFrameFunc(event:Event):void
      {
       
      this.bounds!=null?this.resize():''
      if(this.num>=2){
       
      event.target.removeEventListener(Event.ENTER_FRAME,enterFrameFunc)
      }
      this.bounds=this.getBounds(this.parent)
      this.num++
      this.scaleGrid.graphics.clear()
      //this.scaleGrid.visible=true
       
      }
      public function resize():void
      {
      var rect:Rectangle=this.getBounds(this.parent.parent)
      rect.width=this.width
      rect.height=this.height
      rect.y=y//+this.scaleGrid.top.height*1.5
      rect.x=x//+this.scaleGrid.top.height*1.5
      this.scaleGrid.resize(rect)
      this.dispatchEvent(new Event (RESIZE))
      }
      
      
      
     }
    }

     

     脚本长了点还有3个文件 回复里继续

     


    历史上的今天：


    随机文章：

    新博客 2007-09-27

    收藏到：Del.icio.us




    Tag：flex,自适应，表情
    引用地址：
    吾系衰人/sai 发表于14:51:55 | 编辑 | 继续话题 | 转发 | 分享　0

    评论

  • 我都是用FlexLib的,在这之前也有这个冲动
    望月狼 | 发表于2009-08-19 11:27:11 [回复]
  • 楼下的是因为你没有设置好命名空间 你需要 添加 xmlns:wxsr=”这个组件的路径“你才能调用到组件的
    张明光 / 吾系衰人 | 发表于2009-06-05 10:41:36 [回复]
  • 你好，我是新手，急需要用这个控件，我按照你写的 去调试了 老报错，报这个错 请帮忙看下 错误信息：
    Could not resolve <wxsr:ResizeWindow> to a component implementation. ，不晓得这个组件怎么用的，我是把你的 4个as文件都新建一下， 在按照你上面写的建立一个ResizeWindow.mxml 文件 在运行这个页面就报以上错误，麻烦楼主看下 帮下忙 感激不尽。
    boy1268 | 发表于2009-06-02 13:59:09 [回复]
  • ----------------------------------ScaleGrid-------------------------------------------

    package com.components.resizeWindow
    {
    import flash.display.Sprite;
    import flash.events.MouseEvent;
    import flash.geom.Point;
    import flash.geom.Rectangle;

    public class ScaleGrid extends Sprite
    {


    public var rect:Rectangle
    private var box:Sprite
    public var top:ResizeCell
    public var boutton:ResizeCell
    public var left:ResizeCell;
    public var right:ResizeCell
    public var top_left:ResizeCell
    public var top_right:ResizeCell
    public var boutton_left:ResizeCell
    public var boutton_right:ResizeCell
    public var minWidth:Number=100
    public var minHeight:Number=100



    public function ScaleGrid()
    {
    confIt()
    }


    public function resize(rect:Rectangle):void
    {
    //if(rect.bottomRight.x<=rect.topLeft.x&&rect.bottomRight.y<=rect.topLeft.y>100){
    resizeing(rect)
    //}

    //this.boutton_right.x=this.
    }

    private function resizeing(rect:Rectangle):void
    {
    this.rect=rect
    this.top_left.x=this.rect.topLeft.x
    this.top_left.y=this.rect.topLeft.y;
    this.top_left.rect=new Rectangle(this.top_left.x,this.top_left.y,this.top_left.width,this.top_left.height)


    this.top.x=this.rect.topLeft.x+this.rect.width/2-this.top.width/2
    this.top.y=this.rect.topLeft.y;
    this.top.rect=new Rectangle(this.top.x,this.top.y,this.top.width,this.top.height)

    this.top_right.x=this.rect.topLeft.x+this.rect.width-this.top_right.width
    this.top_right.y=this.rect.topLeft.y;
    this.top_right.rect=new Rectangle(this.top_right.x,this.top_right.y,this.top_right.width,this.top_right.height)

    this.left.x=this.rect.topLeft.x
    this.left.y=this.rect.topLeft.y+this.rect.height/2-this.left.height/2;
    this.left.rect=new Rectangle(this.left.x,this.left.y,this.left.width,this.left.height)

    this.right.x=this.rect.topLeft.x+this.rect.width-this.right.width
    this.right.y=this.rect.topLeft.y+this.rect.height/2-this.right.height/2;
    this.right.rect=new Rectangle(this.right.x,this.right.y,this.right.width,this.right.height)

    this.boutton_left.x=this.rect.topLeft.x
    this.boutton_left.y=this.rect.topLeft.y+this.rect.height-this.boutton_left.height
    this.boutton_left.rect=new Rectangle(this.boutton_left.x,this.boutton_left.y,this.boutton_left.width,this.boutton_left.height)

    this.boutton.x=this.rect.topLeft.x+this.rect.width/2-this.boutton.width/2
    this.boutton.y=this.rect.topLeft.y+this.rect.height-this.boutton.height
    this.boutton.rect=new Rectangle(this.boutton.x,this.boutton.y,this.boutton.width,this.boutton.height)

    this.boutton_right.x=this.rect.topLeft.x+this.rect.width-this.boutton_right.width
    this.boutton_right.y=this.rect.topLeft.y+this.rect.height-this.boutton_right.height
    this.boutton_right.rect=new Rectangle(this.boutton_right.x,this.boutton_right.y,this.boutton_right.width,this.boutton_right.height)


    this.graphics.clear()
    this.graphics.lineStyle(1)
    this.graphics.moveTo(this.rect.topLeft.x,this.rect.topLeft.y)
    this.graphics.lineTo(this.rect.bottomRight.x,this.rect.topLeft.y)
    this.graphics.lineTo(this.rect.bottomRight.x,this.rect.bottomRight.y)
    this.graphics.lineTo(this.rect.topLeft.x,this.rect.bottomRight.y)
    this.graphics.lineTo(this.rect.topLeft.x,this.rect.topLeft.y)

    }

    public function resizeTop(top:Point):void
    {
    top.y-=this.top.height*.5
    var tmp:Rectangle=new Rectangle(this.rect.x,top.y,this.rect.width,this.rect.height+this.rect.topLeft.y-top.y)
    doResize(tmp)
    }
    public function resizeTopLeft(topLeft:Point):void
    {
    topLeft.y-=this.top.height*.5
    var x:Number=topLeft.x
    var y:Number=topLeft.y
    var width:Number=this.rect.width+this.rect.left-topLeft.x
    var height:Number=this.rect.height+this.rect.topLeft.y-topLeft.y

    var tmp:Rectangle=new Rectangle(x,y,width,height)
    doResize(tmp)
    }
    public function resizeTopRight(topRight:Point):void
    {
    var tmp:Rectangle=new Rectangle(this.rect.x,topRight.y,Math.abs(this.rect.topLeft.x-topRight.x),this.rect.bottomRight.y-topRight.y)
    doResize(tmp)
    }
    public function resizeLeft(left:Point):void
    {
    var tmp:Rectangle=new Rectangle(left.x,rect.y,this.rect.width+this.rect.left-left.x,this.rect.height)
    doResize(tmp)
    }
    public function resizeRight(right:Point):void
    {
    var tmp:Rectangle=new Rectangle(this.rect.x,rect.y,Math.abs(this.rect.topLeft.x-right.x),this.rect.height)
    doResize(tmp)
    }
    public function resizeBoutton(boutton:Point):void
    {
    boutton.y+=this.top.height*.5
    var tmp:Rectangle=new Rectangle(this.rect.x,rect.y,this.rect.width,rect.height+boutton.y-rect.bottomRight.y)
    doResize(tmp)
    }
    public function resizeBouttonLeft(bouttonLeft:Point):void
    {
    bouttonLeft.y+=this.top.height*.5
    var tmp:Rectangle=new Rectangle(bouttonLeft.x,rect.y,this.rect.width+this.rect.left-bouttonLeft.x,rect.height+bouttonLeft.y-rect.bottomRight.y)
    doResize(tmp)
    }
    public function resizeBouttonRight(bouttonRight:Point):void
    {
    bouttonRight.y+=this.top.height*.5
    var tmp:Rectangle=new Rectangle(this.rect.x,rect.y,this.rect.width+bouttonRight.x-rect.bottomRight.x,rect.height+bouttonRight.y-rect.bottomRight.y)
    doResize(tmp)

    }


    private function doResize(tmp:Rectangle):void
    {
    tmp.width<this.minWidth?tmp.width=minWidth:''
    tmp.height<this.minHeight?tmp.height=this.minHeight:''

    this.rect=tmp
    this.resize(this.rect)

    }


    private function confIt():void
    {
    this.box=new Sprite

    this.top_left=new ResizeCell
    this.top=new ResizeCell
    this.top_right=new ResizeCell

    this.left=new ResizeCell
    this.right=new ResizeCell

    this.boutton_left=new ResizeCell
    this.boutton=new ResizeCell
    this.boutton_right=new ResizeCell

    this.box.addChild(this.top_left)
    this.box.addChild(this.top)
    this.box.addChild(this.top_right)
    this.box.addChild(this.left)
    this.box.addChild(this.right)
    this.box.addChild(this.boutton_left)
    this.box.addChild(this.boutton)
    this.box.addChild(this.boutton_right)
    this.addChild(this.box)
    this.rect=new Rectangle

    this.top_left.addEventListener(MouseEvent.MOUSE_DOWN,top_left_Click)
    this.top.addEventListener(MouseEvent.MOUSE_DOWN,top_Click)
    this.top_right.addEventListener(MouseEvent.MOUSE_DOWN,top_right_Click)
    this.left.addEventListener(MouseEvent.MOUSE_DOWN,left_Click)
    this.right.addEventListener(MouseEvent.MOUSE_DOWN,right_Click)
    this.boutton_left.addEventListener(MouseEvent.MOUSE_DOWN,boutton_left_Click)
    this.boutton.addEventListener(MouseEvent.MOUSE_DOWN,boutton_Click)
    this.boutton_right.addEventListener(MouseEvent.MOUSE_DOWN,boutton_right_Click)


    }
    private function createEvent(target:ResizeCell,type:String):void
    {
    var e:ResizeWindowEvent=new ResizeWindowEvent(ResizeWindowEvent.RESIZE)
    e.rect=target.rect
    e.resizeType=type
    this.dispatchEvent(e)
    }
    private function top_left_Click(event:MouseEvent):void
    {

    createEvent(this.top_left,ResizeWindowEvent.TOP_LEFT)
    }
    private function top_Click(event:MouseEvent):void
    {
    createEvent(this.top,ResizeWindowEvent.TOP)
    }
    private function top_right_Click(event:MouseEvent):void
    {
    createEvent(this.top_right,ResizeWindowEvent.TOP_RIGHT)
    }
    private function left_Click(event:MouseEvent):void
    {
    createEvent(this.left,ResizeWindowEvent.LEFT)
    }
    private function right_Click(event:MouseEvent):void
    {
    createEvent(this.right,ResizeWindowEvent.RIGHT)
    }
    private function boutton_left_Click(event:MouseEvent):void
    {
    createEvent(this.boutton_left,ResizeWindowEvent.BOUTTON_LEFT)
    }
    private function boutton_Click(event:MouseEvent):void
    {
    createEvent(this.boutton,ResizeWindowEvent.BOUTTON)
    }
    private function boutton_right_Click(event:MouseEvent):void
    {
    createEvent(this.boutton_right,ResizeWindowEvent.BOUTTON_RIGHT)
    }

    }
    }


    ----------------------------------------ResizeCell.as--------------------------------

    package com.components.resizeWindow
    {
    import flash.display.BitmapData;
    import flash.display.DisplayObject;
    import flash.display.Loader;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.geom.Rectangle;
    import flash.net.URLRequest;

    public class ResizeCell extends Sprite
    {
    public var rect:Rectangle

    public function ResizeCell(w:Number=15,h:Number=15)
    {
    this.drawGrid(w,h)
    }
    public function set icon(source:Object):void
    {
    if(source as Class)
    {
    this.addChild(new source)
    }else if(source as String)
    {
    var loader:Loader=new Loader
    loader.load(new URLRequest(String(source)))
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadeeFunc,false,0,true)
    }

    }
    private function loadeeFunc(event:Event):void
    {
    var load:DisplayObject= event.target.loader as DisplayObject
    load.width=this.rect.width
    load.height=this.rect.height
    var bmd:BitmapData=new BitmapData(this.rect.width,this.rect.height,true,0)
    bmd.draw(load)
    this.graphics.clear()
    this.graphics.beginBitmapFill(bmd)
    this.graphics.drawRect(0,0,this.rect.width,this.rect.height)
    this.graphics.endFill()
    this.rect=new Rectangle(0,0,this.rect.width,this.rect.height)
    }
    public function drawGrid(width:Number=15,height:Number=15):void
    {
    this.graphics.clear()
    this.graphics.beginFill(0,.1)
    this.graphics.drawRect(0,0,width,height)
    this.graphics.endFill()
    this.rect=new Rectangle(0,0,width,height)
    }
    }
    }





    ----------------------------------------ResizeWindowEvent.as---------------------------



    package com.components.resizeWindow
    {
    import flash.events.Event;
    import flash.geom.Rectangle;

    public class ResizeWindowEvent extends Event
    {
    public static const TOP:String='top'
    public static const TOP_LEFT:String='top_left'
    public static const TOP_RIGHT:String='top_right'
    public static const LEFT:String='left'
    public static const RIGHT:String='right'

    public static const BOUTTON:String='boutton'
    public static const BOUTTON_LEFT:String='boutton_left'
    public static const BOUTTON_RIGHT:String='boutton_right'
    public static const RESIZE:String='resize'
    public var rect:Rectangle
    public var resizeType:String
    public function ResizeWindowEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
    {
    super(type, bubbles, cancelable);
    }

    }
    }

    张明光 / 吾系衰人 | 发表于2009-04-24 15:01:42 [回复]