flash翻书特效算法

  • 内容
  • 评论
  • 相关

这次分享一个翻书特效算法,是2年前做的,当年特别喜欢这个效果,就去研究了相关算法,大家可以试一下效果,左键拖动书脚可以翻页。http://www.ajexoop.com/demo/book/Book.html代码我也共享下吧,不过当时写的急,本来很多可以用算法解决的问题结果都用逻辑解决了,也就是说其实这个代码还可以精简。QQ图片20160520170607

package com.view
{
  import com.components.MovePageItem;
  import com.components.PageItem;
  import com.components.ShadowItem;
  
  import flash.display.Bitmap;
  import flash.display.BitmapData;
  import flash.display.MovieClip;
  import flash.display.Shape;
  import flash.display.Sprite;
  import flash.events.Event;
  import flash.events.MouseEvent;
  import flash.filters.DropShadowFilter;
  import flash.geom.Matrix;
  import flash.geom.Point;

  public class BookView extends BaseView
  {
   private var _bitmapList:Vector.<Bitmap>;
   /**页面宽度**/
   private var _pageWidth:Number;
   /**页面高度**/
   private var _pageHeight:Number;
   /**页面宽高的斜边**/
   private var _pageInclination:Number;
   /**整书长度**/
   private var _bookWidth:Number;
   /**整书宽度**/
   private var _bookHeight:Number;
   private var _pageIndex:int = 0;
   
   /**按钮容器**/
   private var _btnSprite:Sprite;
   /**左当前页**/
   private var _leftPage:PageItem;
   /**右当前页**/
   private var _rightPage:PageItem;
   /**左被遮罩页**/
   private var _maskLeftPage:PageItem;
   /**右被遮罩页**/
   private var _maskRightPage:PageItem;
   
   /**书本翻页按钮**/
   private var left_top:Sprite;
   private var left_botton:Sprite;
   private var right_top:Sprite;
   private var right_botton:Sprite;
   
   /**书本是被哪个按钮选中翻页的**/
   private var _type:int = -1;
   
   /**鼠标点**/
   private var mx:Number = mouseX;
   private var my:Number = mouseY;
   /**mf与eh的交点**/
   private var gx:Number;
   private var gy:Number;
   /**翻起后鼠标点与上或下边的连接点(me与mh必定是直角)**/
   private var ex:Number;
   private var ey:Number;
   /**翻起后鼠标点与左边或右边的连接点**/
   private var hx:Number;
   private var hy:Number;
   /**起翻点**/
   private var fx:Number;
   private var fy:Number;
   /**eh与上下边的交点**/
   private var jx:Number;
   private var jy:Number;
   /**j点到mh最短距离的交点**/
   private var dx:Number;
   private var dy:Number;
   /**与起翻点同边的终点**/
   private var kx:Number;
   private var ky:Number;
   /**与起翻点对边的终点**/
   private var lx:Number;
   private var ly:Number;
   
   /**约束值1:翻页鼠标点到书本中心线最近值**/
   private var restrain1:Number;
   /**约束值2:翻页鼠标点到书本中心线最远值**/
   private var restrain2:Number;
   
   /**弧度1:书本中心线最近值与书本夹角的弧度**/
   private var radian1:Number;
   /**弧度2:书本中心线最远值与书本夹角的弧度**/
   private var radian2:Number;
   /**页面翻动弧度**/
   private var radian3:Number;
   
   /**书本上中心点**/
   private var conUpPoint:Point;
   /**书本下中心点**/
   private var conDownPoint:Point;
   
   /**翻动页**/
   private var _browsePage:MovePageItem;
   
   private var _browsePageShadow:ShadowItem;
   
   private var _browseMiddleShadow:ShadowItem;
   
   /**上翻页遮罩**/
   private var _maskBrowse:Shape = new Shape();
   /**下翻页遮罩**/
   private var _maskPage:Shape = new Shape();
   
   private var _maskShadow:Shape = new Shape();
   
   /**被遮罩页容器**/
   private var _backItem:Sprite;
   /**当前页容器**/
   private var _pageCanvas:Sprite;
   
   private var _moveCanvas:Sprite;
   
   private var dropShadow:DropShadowFilter=new DropShadowFilter(0,165,0x000000,1,10,10,1.5,1);
   private var filtersArray:Array=new Array(dropShadow);
   
   private var _shadowType:String = ShadowItem.TYPE_LEFT;
   
   
   public function BookView()
   {
    super();
    this.addEventListener(Event.ADDED_TO_STAGE,addStageHandler);
    _pageWidth = _model.configInfoVo.bookList[_model.bookIndex].width;
    _pageHeight = _model.configInfoVo.bookList[_model.bookIndex].height;
    _pageInclination = Math.sqrt(_pageWidth*_pageWidth+_pageHeight * _pageHeight);
    _bookWidth = _pageWidth*2;
    _bookHeight = _pageHeight;
//    _browsePage  = new Bitmap(new BitmapData(_pageWidth,_pageHeight));
    _browsePage = new MovePageItem();
    _browsePageShadow = new ShadowItem();
    _browseMiddleShadow = new ShadowItem();
    conUpPoint = new Point(_pageWidth,0);
    conDownPoint = new Point(_pageWidth,_pageHeight);
    
    setPageList();
    setPageCanvas();
    changePage(_pageIndex);
    setClickBtn();
    
    this.addChild(_maskBrowse);
    this.addChild(_maskPage);
    this.addChild(_maskShadow);
   }
   
   
   
   private function addStageHandler(e:Event):void
   {
    this.removeEventListener(Event.ADDED_TO_STAGE,addStageHandler);
    stage.addEventListener(MouseEvent.MOUSE_UP,upHandler);
   }
   private function setPageList():void
   {
    _bitmapList = new Vector.<Bitmap>();
    for(var i:int = 0;i < _model.configInfoVo.bookList[_model.bookIndex].pageList.length;i++)
    {
     var bitmap:Bitmap = _resource.getResouce(_model.configInfoVo.bookList[_model.bookIndex].pageList[i]);
     bitmap.width = _model.configInfoVo.bookList[_model.bookIndex].width;
     bitmap.height = _model.configInfoVo.bookList[_model.bookIndex].height;
     _bitmapList.push(bitmap);
    }
   }
   private function setClickBtn():void
   {
    _btnSprite = new Sprite();
    this.addChild(_btnSprite);
    
    left_top = new Sprite();
    left_top.graphics.beginFill(0xff0000,0);
    left_top.graphics.drawRect(0,0,50,50);
    left_top.graphics.endFill();
    _btnSprite.addChild(left_top);
    left_top.x = 1;
    left_top.y = 1;//+1为了修复触摸时翻页成矩形的BUG
    
    left_botton = new Sprite();
    left_botton.graphics.beginFill(0xff0000,0);
    left_botton.graphics.drawRect(0,0,50,50);
    left_botton.graphics.endFill();
    _btnSprite.addChild(left_botton);
    left_botton.x = 1
    left_botton.y = _bookHeight - left_botton.height - 1;
    
    right_top = new Sprite();
    right_top.graphics.beginFill(0xff0000,0);
    right_top.graphics.drawRect(0,0,50,50);
    right_top.graphics.endFill();
    _btnSprite.addChild(right_top);
    right_top.x = _bookWidth - right_top.width;
    right_top.y = 1;
    
    right_botton = new Sprite();
    right_botton.graphics.beginFill(0xff0000,0);
    right_botton.graphics.drawRect(0,0,50,50);
    right_botton.graphics.endFill();
    _btnSprite.addChild(right_botton);
    right_botton.x = _bookWidth - right_top.width - 1;
    right_botton.y = _bookHeight - left_botton.height - 1;
    
    left_top.doubleClickEnabled = true;
    left_botton.doubleClickEnabled = true;
    right_top.doubleClickEnabled = true;
    right_botton.doubleClickEnabled = true;
    if(_pageIndex > 0)
    {
     left_top.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     left_top.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     left_top.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     left_top.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
     left_botton.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     left_botton.addEventListener(MouseEvent.MOUSE_OUT,outHandler)
     left_botton.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     left_botton.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    }
    if(_pageIndex < _bitmapList.length - 1)
    {
     right_top.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     right_top.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     right_top.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     right_top.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     right_botton.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    }
   }
   private function doubleClickHandler(e:MouseEvent):void
   {
    left_top.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    left_top.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    left_top.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    left_top.removeEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    left_botton.removeEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    right_top.removeEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    right_botton.removeEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    
    this.removeEventListener(Event.ENTER_FRAME,movePage);
    this.addEventListener(Event.ENTER_FRAME,turningHandler);
   }
   private function setPageCanvas():void
   {
    _maskLeftPage = new PageItem();
    _maskLeftPage.type = "left";
    _maskRightPage = new PageItem();
    _maskRightPage.type = "right";
    _maskRightPage.x = _pageWidth;
    
    _backItem = new Sprite();
    this.addChild(_backItem);
    _pageCanvas = new Sprite();
    this.addChild(_pageCanvas);
    _moveCanvas = new Sprite();
    this.addChild(_moveCanvas);
    _backItem.addChild(_maskLeftPage);
    _backItem.addChild(_maskRightPage);
    
    _leftPage = new PageItem();
    _leftPage.type = "left";
    _pageCanvas.addChild(_leftPage);
    _rightPage = new PageItem();
    _rightPage.type = "right";
    _pageCanvas.addChild(_rightPage);
    _rightPage.x = _pageWidth;
    _browseMiddleShadow.drawShadow(_shadowType,_pageWidth,_pageHeight);
    _pageCanvas.addChild(_browseMiddleShadow);
    _browseMiddleShadow.x = _pageWidth
    
    
//    _browsePage.filters = filtersArray;
    allPageMaskHandler();
    _pageCanvas.mask = _maskPage;
    this.addChild(_browsePageShadow);
   }
   private function changePage(pageNum:int):void
   {
    if(pageNum%2 == 1) pageNum += 1;
    _pageIndex = pageNum;
    trace(_pageIndex);
    if(pageNum <= 0)
    {
     _pageIndex = 0;
     _leftPage.clear();
     _rightPage.bitmap = _bitmapList[pageNum];
    }
    else if(pageNum >= _bitmapList.length)
    {
     _leftPage.bitmap = _bitmapList[pageNum - 1];
     _rightPage.clear();
     _pageIndex = _bitmapList.length;
    }
    else if(pageNum > 0 && pageNum < _bitmapList.length)
    {
     _leftPage.bitmap = _bitmapList[pageNum - 1];
     _rightPage.bitmap = _bitmapList[pageNum];
    }
    
   }
   private function downHandler(e:MouseEvent):void
   {
    _type = typeHandler(e.currentTarget);
    
    left_top.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    left_top.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    left_top.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    left_botton.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    right_top.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_DOWN,downHandler);
    right_botton.removeEventListener(MouseEvent.MOUSE_OUT,outHandler);
    
    this.addEventListener(Event.ENTER_FRAME,enterHandler);
    
   }
   /**计算是翻页还是复位**/
   private var pointX:Number;
   private var pointY:Number;
   private var boo:Boolean;
   private function upHandler(e:MouseEvent):void
   {
//    if(mouseX > _bookWidth || mouseY) return;
    if(Math.abs(mx - fx) > _pageWidth)
    {
     pointX = kx;
     pointY = ky;
     boo = true;
    }
    else
    {
     pointX = fx;
     pointY = fy;
     boo = false;
    }
    
    this.removeEventListener(Event.ENTER_FRAME,enterHandler);
    if(_type == -1) return;
    this.addEventListener(Event.ENTER_FRAME,movePage);
   }
   private function outHandler(e:MouseEvent):void
   {
    if(Math.abs(mx - fx) > _pageWidth)
    {
     pointX = kx;
     pointY = ky;
     boo = true;
    }
    else
    {
     pointX = fx;
     pointY = fy;
     boo = false;
    }
    this.addEventListener(Event.ENTER_FRAME,movePage);
    if(_moveCanvas.contains(_browsePage)) _moveCanvas.removeChild(_browsePage);
//    if(_backItem.contains(_maskLeftPage)) _backItem.removeChild(_maskLeftPage);
//    if(_backItem.contains(_maskRightPage)) _backItem.removeChild(_maskRightPage);
   }
   private function moveHandler(e:MouseEvent):void
   {
    _type = typeHandler(e.currentTarget);
    mx = mouseX;
    my = mouseY;
    
    if(_type == 0)
    {
     leftTopHandler();
    }
    else if(_type == 1)
    {
     leftBottonHandler();
    }
    else if(_type == 2)
    {
     rightTopHandler();
    }
    else if(_type == 3)
    {
     rightBottonHandler();
    }
    drawHandler();
   }
   /**还原初始状态**/
   private function restoreHandler():void
   {
    _maskBrowse.graphics.clear();
    _browsePageShadow.clear();
    _maskShadow.graphics.clear();
    
    if(_moveCanvas.contains(_browsePage)) _moveCanvas.removeChild(_browsePage);
    
    
    allPageMaskHandler();
    _type = -1;
    
    if(_pageIndex > 0)
    {
     left_top.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     left_top.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     left_top.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     left_top.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
     left_botton.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     left_botton.addEventListener(MouseEvent.MOUSE_OUT,outHandler)
     left_botton.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     left_botton.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    }
    if(_pageIndex < _bitmapList.length - 1)
    {
     right_top.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     right_top.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     right_top.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     right_top.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_DOWN,downHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_OUT,outHandler);
     right_botton.addEventListener(MouseEvent.MOUSE_MOVE,moveHandler);
     right_botton.addEventListener(MouseEvent.DOUBLE_CLICK,doubleClickHandler);
    }
    
    if(_pageIndex == 0)
    {
     _shadowType = ShadowItem.TYPE_LEFT;
    }
    else if(_pageIndex == _bitmapList.length)
    {
     _shadowType = ShadowItem.TYPE_RIGHT
    }
    else
    {
     _shadowType = ShadowItem.TYPE_MIDDLE;
    }
    
    _browseMiddleShadow.drawShadow(_shadowType,_pageWidth,_pageHeight);
   }
    
   private function enterHandler(e:Event):void
   {
    mx = mouseX;
    my = mouseY;
    
    
    particularHandler();
    drawHandler();
   }
   /**公式计算**/
   private function particularHandler():void
   {
    if(_type == 0)
    {
     restrain1 = Math.sqrt((conUpPoint.x - mx)*(conUpPoint.x - mx) + (conUpPoint.y - my)*(conUpPoint.y - my));
     restrain2 = Math.sqrt((mx - conDownPoint.x)*(mx - conDownPoint.x) + (my - conDownPoint.y)*(my - conDownPoint.y));
     radian1 = Math.atan2((conUpPoint.y - my),(conUpPoint.x - mx));
     radian2 = Math.atan2((conDownPoint.y - my),(conDownPoint.x - mx));
     if(restrain1 > _pageWidth && my > 0)
     {
      mx = _pageWidth - Math.cos(radian1) * _pageWidth;
      my = -Math.sin(radian1) * _pageWidth;
      
     }
     else if(restrain2 > _pageInclination)
     {
      //处理夹角BUG
      if(my  > - _pageHeight/(_pageWidth)*mx + _pageHeight*2)
      {
       mx = _bookWidth;
       my = 0;
      }
      else
      {
       mx = _pageWidth - Math.cos(radian2) * _pageInclination;
       my = _pageHeight - Math.sin(radian2) * _pageInclination;
      }
      
     }
     leftTopHandler();
     
    }
    else if(_type == 1)
    {
     restrain1 = Math.sqrt((conDownPoint.x - mx)*(conDownPoint.x - mx) + (conDownPoint.y - my)*(conDownPoint.y - my));
     restrain2 = Math.sqrt((mx - conUpPoint.x)*(mx - conUpPoint.x) + (my - conUpPoint.y)*(my - conUpPoint.y));
     radian1 = Math.atan2((conDownPoint.y - my),(conDownPoint.x - mx));
     radian2 = Math.atan2((conUpPoint.y - my),(conUpPoint.x - mx));
     if(restrain1 > _pageWidth && my < _pageHeight)
     {
      mx = _pageWidth - Math.cos(radian1) * _pageWidth;
      my = _pageHeight - Math.sin(radian1) * _pageWidth;
     }
     else if(restrain2 > _pageInclination)
     {
      if(my  < _pageHeight/(_pageWidth)*mx - _pageHeight)
      {
       mx = _bookWidth;
       my = _pageHeight;
      }
      else
      {
       mx = _pageWidth - Math.cos(radian2) * _pageInclination;
       my = -Math.sin(radian2) * _pageInclination;
      }
     }
     leftBottonHandler();
     
    }
    else if(_type == 2)
    {
     restrain1 = Math.sqrt((conUpPoint.x - mx)*(conUpPoint.x - mx) + (conUpPoint.y - my)*(conUpPoint.y - my));
     restrain2 = Math.sqrt((mx - conDownPoint.x)*(mx - conDownPoint.x) + (my - conDownPoint.y)*(my - conDownPoint.y));
     radian1 = Math.atan2((conUpPoint.y - my),(conUpPoint.x - mx));
     radian2 = Math.atan2((conDownPoint.y - my),(conDownPoint.x - mx));
     if(restrain1 > _pageWidth &&  my > 0)
     {
      
      mx = _pageWidth - Math.cos(radian1) * _pageWidth;
      my = -Math.sin(radian1) * _pageWidth;
     }
     else if(restrain2 > _pageInclination)
     {
      if(my > (_pageHeight/(_pageWidth)) * mx)
      {
       mx = 0;
       my = 0;
      }
      else
      {
       mx = _pageWidth - Math.cos(radian2) * _pageInclination;
       my = _pageHeight - Math.sin(radian2) * _pageInclination;
      }
     }
     rightTopHandler();
     
    }
    else if(_type == 3)
    {
     restrain1 = Math.sqrt((conDownPoint.x - mx)*(conDownPoint.x - mx) + (conDownPoint.y - my)*(conDownPoint.y - my));
     restrain2 = Math.sqrt((mx - conUpPoint.x)*(mx - conUpPoint.x) + (my - conUpPoint.y)*(my - conUpPoint.y));
     radian1 = Math.atan2((conDownPoint.y - my),(conDownPoint.x - mx));
     radian2 = Math.atan2((conUpPoint.y - my),(conUpPoint.x - mx));
     
     if(restrain1 > (_pageWidth) && my < _pageHeight)
     {
      mx = _pageWidth - Math.cos(radian1) * _pageWidth;
      my = _pageHeight - Math.sin(radian1) * _pageWidth;
     }
     else if(restrain2 > _pageInclination)
     {
      if(my < -(_pageHeight/(_pageWidth))*(mx-_pageWidth))
      {
       mx = 0;
       my = _pageHeight;
      }
      else
      {
       mx = _pageWidth - Math.cos(radian2) * _pageInclination;
       my = -Math.sin(radian2) * _pageInclination;
      }
     }
     
     rightBottonHandler();
    }
   }
   private function typeHandler(o:Object):int
   {
    var i:int = -1;
    switch(o)
    {
     case left_top:
      i = 0;
      break;
     case left_botton:
      i = 1;
      break;
     case right_top:
      i = 2;
      break;
     case right_botton:
      i = 3;
      break;
    }
    return i;
   }
   
   
   
   private function leftTopHandler():void
   {
    gx = mx/2;
    gy = my/2;
    ex = gx + gy*gy/gx;
    ey = 0;
    hx = gy == 0?mx:0;
    hy = gy == 0?_bookHeight:gy + gx*gx/gy;
    fx = 0;
    fy = 0;
    
    jx = (hy-_bookHeight)/hy*ex;
    jy = _bookHeight;
    
    dx = jx + jx/ex*(mx - ex);
    dy = _bookHeight + jx/ex*my;
    
    kx = _bookWidth;
    ky = 0;
    lx = _bookWidth;
    ly = _bookHeight;
    
   }
   private function rightTopHandler():void
   {
    gx = (mx + _bookWidth)/2;
    gy = my/2;
    ex = gx - gy*gy/(_bookWidth - gx);
    ey = 0;
    hx = gy == 0?mx:_bookWidth;
    hy = gy == 0?_bookHeight:gy + (_bookWidth - gx)*(_bookWidth - gx)/gy;
    fx = _bookWidth;
    fy = 0;
    
    jx = _bookWidth - (hy-_bookHeight)/hy*(_bookWidth - ex);
    jy = _bookHeight;
    
    dx = jx -(_bookWidth - jx)/(_bookWidth - ex)*(ex - mx);
    dy = _bookHeight + (_bookWidth - jx)/(_bookWidth - ex)*my;
    
    kx = 0;
    ky = 0;
    lx = 0;
    ly = _bookHeight;
   }
   private function leftBottonHandler():void
   {
    gx = mx/2;
    gy = (my + _bookHeight)/2;
    ex = gx + (_bookHeight - gy)*(_bookHeight - gy)/gx;
    ey = _bookHeight;
    hx = _bookHeight == gy?mx:0;
    hy = _bookHeight == gy?0:gy - gx*gx/(_bookHeight - gy);
    fx = 0;
    fy = _bookHeight;
    
    jx = hy/(hy-_bookHeight)*ex;
    jy = 0;
    
    dx = jx + jx/ex*(mx - ex);
    dy = - jx/ex*(_bookHeight - my);
    
    kx = _bookWidth;
    ky = _bookHeight;
    lx = _bookWidth;
    ly = 0;
   }
   private function rightBottonHandler():void
   {
    gx = (mx + _bookWidth)/2;
    gy = (my + _bookHeight)/2;
    ex = gx - (_bookHeight - gy)*(_bookHeight - gy)/(_bookWidth - gx);
    ey = _bookHeight;
    hx = _bookHeight == gy?mx:_bookWidth;
    hy = _bookHeight == gy?0:gy - (_bookWidth - gx)*(_bookWidth - gx)/(_bookHeight - gy);
    fx = _bookWidth;
    fy = _bookHeight;
    jx = _bookWidth - hy/(hy-_bookHeight)*(_bookWidth - ex)
    jy = 0;
    
    dx = jx -(_bookWidth - jx)/(_bookWidth - ex)*(ex - mx);
    dy = -(_bookWidth - jx)/(_bookWidth - ex)*(_bookHeight - my);
    
    kx = 0;
    ky = _bookHeight;
    lx = 0;
    ly = 0;
   }
   
   /**生成翻页**/
   private function drawHandler():void
   {
    _maskBrowse.graphics.clear();
    _maskPage.graphics.clear();
    _maskShadow.graphics.clear();
    _maskBrowse.graphics.beginFill(0xff0000);
    _maskPage.graphics.beginFill(0xffffff);
    _maskShadow.graphics.beginFill(0x00ff00);
    
    radian3 = Math.atan2((ey - my),(ex - mx));
    
    var index:int = _pageIndex;
    
    if(index%2 == 1) index += 1;
    if(index - 3 >= 0)
    {
     _maskLeftPage.bitmap = _bitmapList[index - 3];
    }
    else
    {
     
     _maskLeftPage.clear();
    }
    if(index + 2 < _bitmapList.length)
    {
     _maskRightPage.bitmap =  _bitmapList[index + 2];
    }
    else
    {
     
     _maskRightPage.clear();
    }
    
    
    if(_type == 0 || _type == 1)
    {
     if(index - 3 < 0)
     {
      _shadowType = ShadowItem.TYPE_LEFT;
     }
     else
     {
      _shadowType = ShadowItem.TYPE_MIDDLE;
     }
     if(!(_bitmapList[index - 2] is Bitmap)) return;
     _browsePage.setBitmap(_bitmapList[index - 2] as Bitmap);
     _browsePage.rotation = 0;//角度变为0防止因角度改变改变长宽比
     _browsePage.width = _bitmapList[index - 2].width;
     _browsePage.height = _bitmapList[index - 2].height;
     
    }
    else
    {
     if(index + 2 >= _bitmapList.length)
     {
      _shadowType = ShadowItem.TYPE_RIGHT
     }
     else
     {
      _shadowType = ShadowItem.TYPE_MIDDLE;
     }
     
     
     if(!(_bitmapList[index + 1] is Bitmap)) return;
     _browsePage.setBitmap(_bitmapList[index + 1] as Bitmap);
     _browsePage.rotation = 0;
     _browsePage.width = _bitmapList[index + 1].width;
     _browsePage.height = _bitmapList[index + 1].height;
    }
    
    
//    _browsePage.filters = filtersArray;
    
    _browsePage.x = mx;
    _browsePage.y = my;
    
    if(_type == 0)
    {
     _browsePage.rotation = 180 + radian3 * 180 / Math.PI;
     _browsePage.x -= Math.cos(180*Math.PI/180 + radian3) * _pageWidth;
     _browsePage.y -= Math.sin(180*Math.PI/180 + radian3) * _pageWidth;
     _browsePageShadow.scaleX = 1;
    }
    else if(_type == 1)
    {
     _browsePage.rotation =radian3 * 180 / Math.PI - 180;
     _browsePage.x -= Math.cos(radian3 - 90*Math.PI/180 - Math.atan(_pageWidth/_pageHeight)) *   Math.sqrt(_pageWidth*_pageWidth + _pageHeight*_pageHeight);
     _browsePage.y -= Math.sin(radian3 - 90*Math.PI/180 - Math.atan(_pageWidth/_pageHeight)) * Math.sqrt(_pageWidth*_pageWidth + _pageHeight*_pageHeight);
     _browsePageShadow.scaleX = -1;
    }
    else if(_type == 2)
    {
     _browsePage.rotation = radian3 * 180 / Math.PI;
     _browsePageShadow.scaleX = 1;
    }
    else if(_type == 3)
    {
     
     _browsePage.rotation = radian3 * 180 / Math.PI;
     _browsePage.x += Math.sin(radian3) * _pageHeight;
     _browsePage.y -= Math.cos(radian3) * _pageHeight;
     _browsePageShadow.scaleX = -1;
     
    }
    
    if(!_moveCanvas.contains(_browsePage)) _moveCanvas.addChildAt(_browsePage,0);
    _moveCanvas.mask = _maskBrowse;
    _browsePageShadow.mask = _maskShadow;
    if(mx <= 0)
    {
//     trace("mx < 0")
     
     if(_type == 0 || _type == 1)
     {
      _maskPage.graphics.moveTo(0,0);
      _maskPage.graphics.lineTo(_bookWidth,0);
      _maskPage.graphics.lineTo(_bookWidth,_bookHeight);
      _maskPage.graphics.lineTo(0,_bookHeight);
      _maskPage.graphics.lineTo(0,0);
      
      return;
     }
     else
     {
      _maskBrowse.graphics.moveTo(0,0);
      _maskBrowse.graphics.lineTo(_pageWidth,0);
      _maskBrowse.graphics.lineTo(_pageWidth,_pageHeight);
      _maskBrowse.graphics.lineTo(0,_pageHeight);
      _maskBrowse.graphics.lineTo(0,0);
      
      _maskPage.graphics.clear();
     }
     _maskShadow.graphics.moveTo(0,0);
     _maskShadow.graphics.lineTo(0,_bookHeight);
     _maskShadow.graphics.lineTo(_bookWidth,_bookHeight);
     _maskShadow.graphics.lineTo(_bookWidth,0);
     _maskShadow.graphics.lineTo(0,0);
    }
    else if(mx >= _bookWidth)
    {
//     trace("mx > mc.width")
     if(_type == 0|| _type == 1)
     {
      _maskBrowse.graphics.moveTo(_pageWidth,0);
      _maskBrowse.graphics.lineTo(_bookWidth,0);
      _maskBrowse.graphics.lineTo(_bookWidth,_pageHeight);
      _maskBrowse.graphics.lineTo(_pageWidth,_pageHeight);
      _maskBrowse.graphics.lineTo(_pageWidth,0);
      
      _maskPage.graphics.clear();
     }
     else
     {
      _maskPage.graphics.moveTo(0,0);
      _maskPage.graphics.lineTo(_bookWidth,0);
      _maskPage.graphics.lineTo(_bookWidth,_bookHeight);
      _maskPage.graphics.lineTo(0,_bookHeight);
      _maskPage.graphics.lineTo(0,0);
      return;
     }
     _maskShadow.graphics.moveTo(0,0);
     _maskShadow.graphics.lineTo(0,_bookHeight);
     _maskShadow.graphics.lineTo(_bookWidth,_bookHeight);
     _maskShadow.graphics.lineTo(_bookWidth,0);
     _maskShadow.graphics.lineTo(0,0);
    }
    else if(hy < 0 || hy > _pageHeight)
    {
     _maskBrowse.graphics.moveTo(mx,my);
     _maskBrowse.graphics.lineTo(dx,dy);
     _maskBrowse.graphics.lineTo(jx,jy);
     _maskBrowse.graphics.lineTo(ex,ey);
     _maskBrowse.graphics.lineTo(mx,my);
     
     _maskPage.graphics.moveTo(kx,ky);
     _maskPage.graphics.lineTo(ex,ey);
     _maskPage.graphics.lineTo(jx,jy);
     _maskPage.graphics.lineTo(lx,ly);
     _maskPage.graphics.lineTo(kx,ky);
     
     _maskShadow.graphics.moveTo(mx,my);
     _maskShadow.graphics.lineTo(dx,dy);
     _maskShadow.graphics.lineTo(jx,jy);
     _maskShadow.graphics.lineTo(fx,jy);
     _maskShadow.graphics.lineTo(fx,fy);
     _maskShadow.graphics.lineTo(ex,ey);
     _maskShadow.graphics.lineTo(mx,my);
     
     _browsePageShadow.drawShadow(_shadowType,Math.abs((Math.sqrt((ex - mx)*(ex - mx)+(ey-my)*(ey-my)) + Math.sqrt((dx - jx)*(dx - jx)+(dy-jy)*(dy-jy)))/2) + 4,_pageInclination);
     _browsePageShadow.rotation = Math.atan2(ey - jy,ex - jx)*180/Math.PI + 90;
    }
    else if(hy == 0 || hy == _pageHeight)
    {
     _maskBrowse.graphics.moveTo(mx,my);
     _maskBrowse.graphics.lineTo(hx,hy);
     _maskBrowse.graphics.lineTo(ex,hy);
     _maskBrowse.graphics.lineTo(ex,ey);
     _maskBrowse.graphics.lineTo(mx,my);
     
     _maskPage.graphics.moveTo(kx,ky);
     _maskPage.graphics.lineTo(ex,ey);
     _maskPage.graphics.lineTo(hx,hy);
     _maskPage.graphics.lineTo(lx,ly);
     _maskPage.graphics.lineTo(kx,ky);
     
     _maskShadow.graphics.moveTo(mx,my);
     _maskShadow.graphics.lineTo(hx,hy);
     _maskShadow.graphics.lineTo(fx,hy);
     _maskShadow.graphics.lineTo(fx,fy);
     _maskShadow.graphics.lineTo(ex,ey);
     _maskShadow.graphics.lineTo(mx,my);
     
     _browsePageShadow.drawShadow(_shadowType,Math.abs(ex - mx) + 4,_pageInclination);
     _browsePageShadow.rotation = Math.atan2(ey - hy,ex - ex)*180/Math.PI + 90;
    }
    else
    {
     _maskBrowse.graphics.moveTo(mx,my);
     _maskBrowse.graphics.lineTo(hx,hy);
     _maskBrowse.graphics.lineTo(ex,ey);
     _maskBrowse.graphics.lineTo(mx,my);
     
     _maskPage.graphics.moveTo(kx,ky);
     _maskPage.graphics.lineTo(ex,ey);
     _maskPage.graphics.lineTo(hx,hy);
     _maskPage.graphics.lineTo(hx,ly);
     _maskPage.graphics.lineTo(lx,ly);
     _maskPage.graphics.lineTo(kx,ky);
     
     _maskShadow.graphics.moveTo(mx,my);
     _maskShadow.graphics.lineTo(hx,hy);
     _maskShadow.graphics.lineTo(fx,fy);
     _maskShadow.graphics.lineTo(ex,ey);
     _maskShadow.graphics.lineTo(mx,my);
     
     _browsePageShadow.drawShadow(_shadowType,Math.abs((Math.sqrt((ex - mx)*(ex - mx)+(ey-my)*(ey-my)) + Math.sqrt((ex - hx)*(ex - hx)+(ey-hy)*(ey-hy)))/2) + 4,_pageInclination);
     _browsePageShadow.rotation = Math.atan2(ey - hy,ex - hx)*180/Math.PI + 90;
     
    }
    _browsePageShadow.x = ex;
    _browsePageShadow.y = ey;
    _maskBrowse.graphics.endFill();
    _maskPage.graphics.endFill();
   }
   /**全遮罩状态(未翻页状态)**/
   private function allPageMaskHandler():void
   {
    _maskPage.graphics.clear();
    _maskPage.graphics.beginFill(0x00ff00);
    _maskPage.graphics.drawRect(0,0,_bookWidth,_bookHeight);
    _maskPage.graphics.endFill();
   }
   private function movePage(e:Event=null):void
   {
    var moveRo:Number;
    
    moveRo = Math.atan2((pointY-my),(pointX - mx))
    
    var xMove:Number = Math.cos(moveRo) * 100;
    var yMove:Number = Math.sin(moveRo) * 100;
    if(Math.abs(mx - pointX) > 100)
    {
     mx += xMove;
     my += yMove;
    }
    else
    {
     mx = pointX;
     my = pointY;
     this.removeEventListener(Event.ENTER_FRAME,movePage);
     if(boo)
     {
      if(_type == 0 || _type == 1)
      {
       changePage(_pageIndex-2);
       
      }
      else
      {
       changePage(_pageIndex+1);
      }
     }
     restoreHandler();
     return;
    }
    particularHandler();
    drawHandler();
   }
   private function turningHandler(e:Event):void
   {
    if(_type == 0 || _type == 1)
    {
     mx += 80;
     my = _bookHeight;
     if(mx >= _bookWidth) 
     {
      this.removeEventListener(Event.ENTER_FRAME,turningHandler);
      changePage(_pageIndex-2);
      restoreHandler();
      return;
     }
    }
    else
    {
     mx -= 80;
     my = _bookHeight;
     if(mx <= 0) 
     {
      this.removeEventListener(Event.ENTER_FRAME,turningHandler);
      changePage(_pageIndex+1);
      restoreHandler();
      return;
     }
    }
    particularHandler();
    drawHandler();
   }
  }
}

评论

6条评论
  1. Gravatar 头像

    匿名 回复

    能不能改一个cjs的放到上面,表示看不懂 😥

  2. Gravatar 头像

    匿名 回复

    太难了

  3. Gravatar 头像

    匿名 回复

    请问可以告诉我们如何在An里面实现嘛

    • Gravatar 头像

      ajex 回复

      @匿名 先研究原理和算法,然后根据原理算法把我这个类改写成an可以接受的模式(比如canvas项目改成js,as3项目直接引用就可以了),然后把资源放进去,搞定。

  4. Gravatar 头像

    匿名 回复

    你好,这个效果的代码加在An里可以实现吗,是JS吗

    • Gravatar 头像

      ajex 回复

      @匿名 也可以 知道算法就行了

发表评论

电子邮件地址不会被公开。