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.;
		/**页面宽度**/
		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.();
			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();
		}
	}
}

评论

4条评论
  1. Gravatar 头像

    匿名 回复

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

    • Gravatar 头像

      ajex 回复

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

  2. Gravatar 头像

    匿名 回复

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

    • Gravatar 头像

      ajex 回复

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

匿名进行回复 取消回复

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