使用Unity3DUGUI实现翻书效果

　　Unity3D运行截屏
　　提示：素材来源网络，侵权必删一、准备工作
　　1。新建Unity工程准备几张图片，新建一个文件夹放进去，然后把文件夹放在Resources文件夹下。
　　2。新建Hierarchy面板
　　如图二、使用步骤
　　1。新建UIBook脚本，挂在UIBook上
　　代码如下（示例）：usingSusingSystem。CusingUnityEnamespaceHKZ｛publicclassUIBook：MonoBehaviour｛组件privateRectTprivateSprite〔〕bookS存放所以的图片（书页）privateRectTransformclippingM引用summary正在翻页的书页的左面summaryprivateTheDraggingPageleftSideOfPsummary正在翻页的书页的右面summaryprivateTheDraggingPagerightSideOfPsummary左侧静止页面summaryprivatePageleftPsummary右侧静止页面summaryprivatePagerightPprivateDragPageBasedragPsummary数据类summaryprivateBookModelsbookM数据privateintcurrentLeftId；当前左边页数privatefloataniDuration0。5f；privateboolisDpublicintCurrentLeftId｛get｛returncurrentLeftId；｝set｛currentLeftIif（currentLeftId1）｛currentLeftId1；｝elseif（currentLeftIdbookSprites。Length1）｛currentLeftIdbookSprites。Length1；｝｝｝privatevoidStart（）｛CInitAddComponent（outcanvas）；初始化InitDate（canvas）；UpdateID（isDragging）；｝summary初始化，找到子项并添加相应的脚本（正在翻页，静态页面）summaryprivatevoidInitAddComponent（outCanvascanvas）｛rectGetComponentRectTransform（）；获取组件foreach（Canvascinrect。GetComponentsInParentCanvas（））｛if（c。isRootCanvas）｛｝｝clippingMaskrect。Find（ClippingMask）。GetComponentRectTransform（）；rightPagerect。Find（RightPage）。gameObject。AddComponentPage（）；leftPagerect。Find（LeftPage）。gameObject。AddComponentPage（）；rightSideOfPagerect。Find（RightSide）。gameObject。AddComponentTheDraggingPage（）；leftSideOfPagerect。Find（LeftSide）。gameObject。AddComponentTheDraggingPage（）；rect。Find（RightDragButton）。gameObject。AddComponentDragButton（）。Init（OnMouseDragRightPage，OnUpdatePage，OnEndDragRightPage）；rect。Find（LeftDragButton）。gameObject。AddComponentDragButton（）。Init（OnMouseDragLeftPage，OnUpdatePage，OnEndDragLeftPage）；rightPage。Init（GetSprite）；leftPage。Init（GetSprite）；rightSideOfPage。Init（GetSprite）；leftSideOfPage。Init（GetSprite）；｝privateSpriteGetSprite（intindex）｛if（index0indexbookSprites。Length）｛returnbookSprites〔index〕；｝｝summary初始化数据（加载图片，设置整个UIBook大小）summaryprivatevoidInitDate（Canvascanvas）｛bookModelsnewBookModels（）；创建并初始化bookSpritesResources。LoadAllSprite（Book）；加载所有的图片（书页）if（bookSprites。Length0）｛rect。sizeDeltanewVector2（bookSprites〔0〕。rect。width2，bookSprites〔0〕。rect。height）；设置UIBook大小｝CurrentLeftId1；isDfloatscaleFactor1；默认图片缩放比例为1if（canvas！null）｛scaleFactorcanvas。scaleF｝计算屏幕上书页的显示尺寸floatpageWidthrect。rect。widthscaleFactor2；；书页宽度floatpageHeightrect。rect。heightscaleF书页高度底边中心点的获取Vector3posrect。positionVector3。downpageHeight2；bookModels。BottomCenterWorld2LocalPos（pos）；右下角坐标posrect。positionVector3。downpageHeight2Vector3。rightpageWbookModels。RightCornerWorld2LocalPos（pos）；上边中心点的获取posrect。positionVector3。uppageHeight2；bookModels。TopCenterWorld2LocalPos（pos）；左下角坐标的获取posrect。positionVector3。downpageHeight2Vector3。leftpageWbookModels。LeftCornerWorld2LocalPos（pos）；floatwidthrect。rect。width2；floatheightrect。rect。每页的宽度bookModels。PageW对角线的计算bookModels。PageDiagonalMathf。Sqrt（Mathf。Pow（width，2）Mathf。Pow（height，2））；设置ClippingMask的大小clippingMask。sizeDeltanewVector2（bookModels。PageDiagonal，bookModels。PageDiagonalbookModels。PageWidth）；反转切面的轴心点Y值bookModels。ClippingPivotYbookModels。PageWidthclippingMask。sizeDelta。y；leftSideOfPage。InitShadow（newVector2（bookModels。PageDiagonal，bookModels。PageDiagonal））；rightSideOfPage。InitShadow（newVector2（bookModels。PageDiagonal，bookModels。PageDiagonal））；｝summary获取clippingMasksummaryreturnsreturnspublicRectTransformGetClippingMask（）｛returnclippingM｝summary世界坐标转换为local坐标summaryparamnameworldparamreturnsreturnsprivateVector3World2LocalPos（Vector3world）｛returnrect。InverseTransformPoint（world）；｝summaryLocal坐标转化世界坐标summaryparamnamelocalparamreturnsreturnspublicVector3Local2WorldPos（Vector3local）｛returnrect。TransformPoint（local）；｝privatevoidUpdateID（boolisDragging）｛if（isDragging）｛leftPage。IDCurrentLeftId；leftSideOfPage。IDCurrentLeftId1；rightSideOfPage。IDCurrentLeftId2；rightPage。IDCurrentLeftId3；｝else｛leftPage。IDCurrentLeftId；rightPage。IDCurrentLeftId1；｝｝开始拖动privatevoidOnMouseDragRightPage（）｛if（CurrentLeftIdbookSprites。Length1）｛isDdragPagenewDragRightPage（this，bookModels，leftSideOfPage，rightSideOfPage，rightPage。transform。position）；dragPage。BeginDragPage（World2LocalPos（Input。mousePosition））；UpdateID（isDragging）；｝｝privatevoidOnMouseDragLeftPage（）｛if（CurrentLeftId0）｛dragPagenewDragLeftPage（this，bookModels，rightSideOfPage，leftSideOfPage，leftPage。transform。position）；dragPage。BeginDragPage（World2LocalPos（Input。mousePosition））；isDCurrentLeftId2；UpdateID（isDragging）；｝｝持续拖动privatevoidOnUpdatePage（）｛if（isDragging）｛dragPage。UpdateDrag（）；｝｝结束拖动privatevoidOnEndDragRightPage（）｛if（isDragging）｛isDboolisLeftJudgeCornerIsLeft（）；dragPage。EndDragPage（（）AniEnd（isLeft））；｝｝结束拖动privatevoidOnEndDragLeftPage（）｛if（isDragging）｛isDboolisLeftJudgeCornerIsLeft（）；dragPage。EndDragPage（（）AniEnd（isLeft））；｝｝privateboolJudgeCornerIsLeft（）｛returnbookModels。CurrentPageCorner。xbookModels。BottomCenter。x；｝privatevoidAniEnd（boolisLeft）｛if（isLeft）｛CurrentLeftId2；｝｝summary获取点击位置summaryreturnsreturnspublicVector3GetClickPos（）｛if（isDragging）｛returnWorld2LocalPos（Input。mousePosition）；｝else｛returnbookModels。ClickP｝｝summary计算拖拽角的位置summaryparamnameclickparampublicVector3CulculateDraggingCorner（Vector3click）｛Vector3cornerVector3。cornerLimitBotomCenter（click）；returnLimitTopCenter（corner）；｝summary获取底边中心点summaryparamnameclickparamreturnsreturnsprivateVector3LimitBotomCenter（Vector3click）｛Vector3offsetclickbookModels。BottomCfloatradiansMathf。Atan2（offset。y，offset。x）；Vector3cornerLimitnewVector3（bookModels。PageWidthMathf。Cos（radians），bookModels。PageWidthMathf。Sin（radians））bookModels。BottomCfloatdistanceVector2。Distance（click，bookModels。BottomCenter）；if（distancebookModels。PageWidth）｛｝else｛returncornerL｝｝summary获取上边中心点summaryparamnameclickparamreturnsreturnsprivateVector3LimitTopCenter（Vector3corner）｛Vector3offsetcornerbookModels。TopCfloatradiansMathf。Atan2（offset。y，offset。x）；Vector3cornerLimitnewVector3（bookModels。PageDiagonalMathf。Cos（radians），bookModels。PageDiagonalMathf。Sin（radians））bookModels。TopCfloatdistanceVector2。Distance（corner，bookModels。TopCenter）；if（distancebookModels。PageDiagonal）returncornerL｝summary计算折叠线的角度数summaryparamnamecornerparamparamnamebookCornerparamreturnsreturnspublicfloatCulculateFoldAngle（Vector3corner，Vector3bookCorner，outVector3bottomCrossPoint）｛Vector3twoCornerCenter（cornerbookCorner）2；Vector3offsetbookCornertwoCornerCfloatrandiansMathf。Atan2（offset。y，offset。x）；floatoffsetXtwoCornerCenter。xoffset。yMathf。Tan（randians）；offsetXLimitOffsetX（offsetX，bookCorner，bookModels。BottomCenter）；bottomCrossPointnewVector3（offsetX，bookModels。BottomCenter。y）；offsetbottomCrossPointtwoCornerCreturnMathf。Atan（offset。yoffset。x）Mathf。Rad2Drandianstodegress｝privatefloatLimitOffsetX（floatoffsetX，Vector3bookCorner，Vector3bottomCenter）｛if（offsetXbottomCenter。xbottomCenter。xbookCorner。x）returnbottomCenter。x；if（offsetXbottomCenter。xbottomCenter。xbookCorner。x）returnbottomCenter。x；returnoffsetX；｝publicvoidFlipAni（Vector3target，ActiononComplete）｛StartCoroutine（PageAni（target，aniDuration，（）｛if（onComplete！null）｛onComplete（）；｝ResetDate（）；｝））；｝privatevoidResetDate（）｛UpdateID（isDragging）；leftSideOfPage。SetActiveState（false）；rightSideOfPage。SetActiveState（false）；｝privateIEnumeratorPageAni（Vector3target，floatduration，ActiononComplete）｛Vector3offset（targetbookModels。ClickPoint）floatsymbol（targetbookModels。ClickPoint）。x；yieldreturnnewWaitUntil（（）｛bookModels。ClickPointoffsetTime。deltaTdragPage。UpdateDrag（）；if（symbol0）｛returnbookModels。ClickPoint。xtarget。x；｝else｛returnbookModels。ClickPoint。xtarget。x；｝｝）；if（onComplete！null）｛onComplete（）；｝｝｝｝
　　2。新建BookModels脚本
　　代码如下（示例）：usingUnityEnamespaceHKZ｛publicclassBookModels｛summary一页的宽度summarypublicfloatPageWsummary对角线summarypublicfloatPageDsummary底边中心点summarypublicVector3BottomCsummary顶点中心点summarypublicVector3TopCsummary当前被拖动的书页顶点位置summarypublicVector3CurrentPageCsummary右边书页右下角顶点summarypublicVector3RightCsummary左边书页右下角顶点summarypublicVector3LeftCsummary当前点击的点summarypublicVector3ClickPsummary反转切面的轴心点Y值summarypublicfloatClippingPivotY；｝｝
　　3。新建DragButton脚本
　　代码如下（示例）：usingSusingUnityEusingUnityEngine。EventSnamespaceHKZ｛publicclassDragButton：MonoBehaviour，IBeginDragHandler，IDragHandler，IEndDragHandler｛privateActiononBeginDprivateActiononDprivateActiononEndDsummary初始化数据summaryparamnameonBeginDragparamparamnameonDragparamparamnameonEndDragparampublicvoidInit（ActiononBeginDrag，ActiononDrag，ActiononEndDrag）｛this。onBeginDragonBeginDthis。onDragonDthis。onEndDragonEndD｝summary开始拖动summaryparamnameeventDataparampublicvoidOnBeginDrag（PointerEventDataeventData）｛if（onBeginDrag！null）｛onBeginDrag（）；｝｝summary持续拖动summaryparamnameeventDataparampublicvoidOnDrag（PointerEventDataeventData）｛if（onDrag！null）｛onDrag（）；｝｝summary结束拖动summaryparamnameeventDataparampublicvoidOnEndDrag（PointerEventDataeventData）｛if（onEndDrag！null）｛onEndDrag（）；｝｝｝｝
　　4。新建DragLeftPage脚本
　　代码如下（示例）：usingUnityEnamespaceHKZ｛publicclassDragLeftPage：DragPageBase｛publicDragLeftPage（UIBookuIBook，BookModelsbookModels，TheDraggingPagefrontPage，TheDraggingPagebackPage，Vector3startPos）：base（uIBook，bookModels，frontPage，backPage，startPos）｛｝protectedoverrideVector3GetBookCorner（）｛returnbookModels。LeftC｝protectedoverrideVector2GetCilppingMaskPivot（）｛returnnewVector2（0，bookModels。ClippingPivotY）；｝protectedoverrideVector2GetPagePivot（）｛returnVector2。｝protectedoverrideVector3GetValidAngle（floatangle）｛returnVector3。forward（angle180）；｝｝｝
　　5。新建DragRightPage脚本
　　代码如下（示例）：usingUnityEnamespaceHKZ｛publicclassDragRightPage：DragPageBase｛publicDragRightPage（UIBookuIBook，BookModelsbookModels，TheDraggingPagefrontPage，TheDraggingPagebackPage，Vector3startPos）：base（uIBook，bookModels，frontPage，backPage，startPos）｛｝protectedoverrideVector3GetBookCorner（）｛returnbookModels。RightC｝protectedoverrideVector2GetCilppingMaskPivot（）｛returnnewVector2（1，bookModels。ClippingPivotY）；｝protectedoverrideVector2GetPagePivot（）｛returnVector2。｝protectedoverrideVector3GetValidAngle（floatangle）｛returnVector3。｝｝｝
　　6。新建IDragPage脚本
　　代码如下（示例）：usingSusingUnityEnamespaceHKZ｛publicinterfaceIDragPage｛voidBeginDragPage（Vector3point）；voidUpdateDrag（）；voidEndDragPage（Actioncomplete）；｝publicabstractclassDragPageBase｛privateUIBookuIBprotectedBookModelsbookMprivateTheDraggingPagefrontPprivateTheDraggingPagebackPprivateVector3startPprivateRectTransformclippingMpublicDragPageBase（UIBookuIBook，BookModelsbookModels，TheDraggingPagefrontPage，TheDraggingPagebackPage，Vector3startPos）｛this。uIBookuIBthis。bookModelsbookMthis。frontPagefrontPthis。backPagebackPthis。startPosstartPclippingMaskuIBook。GetClippingMask（）；｝summary开始拖拽summaryparamnamepointparampublicvoidBeginDragPage（Vector3point）｛设置中心点clippingMask。pivotGetCilppingMaskPivot（）；bookModels。ClickPfrontPage。BeginDragPage（startPos，GetPagePivot（））；backPage。BeginDragPage（startPos，GetPagePivot（））；｝protectedabstractVector2GetCilppingMaskPivot（）；protectedabstractVector2GetPagePivot（）；summary拖拽过程summarypublicvoidUpdateDrag（）｛bookModels。ClickPointuIBook。GetClickPos（）；backPage。SetParent（clippingMask，true）；frontPage。SetParent（uIBook。transform，true）；bookModels。CurrentPageCorneruIBook。CulculateDraggingCorner（bookModels。ClickPoint）；Vector3bottomCrossPointUpdateClippingMask（）；UpdateBackSide（bottomCrossPoint）；frontPage。SetParent（clippingMask，true）；frontPage。ResetShadowDate（）；frontPage。transform。SetAsFirstSibling（）；backPage。SetShadowFollow（clippingMask）；｝privateVector3UpdateClippingMask（）｛Vector3bottomCrossPfloatangleuIBook。CulculateFoldAngle（bookModels。CurrentPageCorner，GetBookCorner（），outbottomCrossPoint）；if（angle0）｛angleangle90；｝else｛angleangle90；｝clippingMask。eulerAnglesVector3。clippingMask。localPositionbottomCrossPreturnbottomCrossP｝protectedabstractVector3GetBookCorner（）；privatevoidUpdateBackSide（Vector3bottonCrossPoint）｛backPage。transform。positionuIBook。Local2WorldPos（bookModels。CurrentPageCorner）；Vector3offsetbottonCrossPointbookModels。CurrentPageCfloatangleMathf。Atan2（offset。y，offset。x）Mathf。Rad2DbackPage。transform。eulerAnglesGetValidAngle（angle）；｝protectedabstractVector3GetValidAngle（floatangle）；publicvoidEndDragPage（Actioncomplete）｛Vector3if（bookModels。CurrentPageCorner。xbookModels。BottomCenter。x）｛cornerbookModels。RightC｝else｛cornerbookModels。LeftC｝uIBook。FlipAni（corner，complete）；｝｝｝
　　7。新建Page脚本
　　代码如下（示例）：usingSusingUnityEusingUnityEngine。UI；namespaceHKZ｛publicclassPage：MonoBehaviour｛引用publicShadowShadow｛｝组件privateFuncint，SpritegetSprivateImageimgPprotectedRectT数据summary页数publicintID｛get｛｝set｛ChangeSprite（value）；｝｝summary初始化数据summaryparamnamegetSpriteparampublicvirtualvoidInit（Funcint，SpritegetSprite）｛rectGetComponentRectTransform（）；this。getSpritegetSimgPageGetComponentImage（）；Shadowtransform。GetChild（0）。gameObject。AddComponentShadow（）；｝summary赋值SpritesummaryparamnameidparamprivatevoidChangeSprite（intid）｛imgPage。spritegetSprite（id）；｝summary设置活跃状态summaryparamnameisActiveparampublicvoidSetActiveState（boolisActive）｛gameObject。SetActive（isActive）；｝summary设置父物体summaryparamnameparentparamparamnameworldPosStaysparampublicvoidSetParent（Transformparent，boolworldPosStays）｛transform。SetParent（parent，worldPosStays）；｝｝｝
　　8。新建Shadow脚本
　　代码如下（示例）：usingUnityEusingUnityEngine。UI；namespaceHKZ｛publicclassShadow：MonoBehaviour｛组件privateRectTprivateIprivateColordefaultColornewColor（1，1，1，0。5f）；summary初始化数据summaryparamnamesizeparampublicvoidInit（Vector2size）｛rectGetComponentRectTransform（）；imageGetComponentImage（）；rect。sizeD设置大小image。colordefaultC设置颜色｝summary设置shadow的位置summaryparamnametargetparampublicvoidSetShadowFollow（Transformtarget）｛transform。positiontarget。transform。rotationtarget。｝publicvoidResetShadowDate（）｛rect。anchoredPositionVector2。rect。localEulerAnglesVector2。｝｝｝
　　9。新建TheDraggingPage脚本
　　代码如下（示例）：usingSusingUnityEnamespaceHKZ｛publicclassTheDraggingPage：Page｛publicoverridevoidInit（Funcint，SpritegetSprite）｛base。Init（getSprite）；SetActiveState（false）；｝summary开始拖动summaryparamnameposparamparamnamepivotparampublicvoidBeginDragPage（Vector3pos，Vector2pivot）｛SetActiveState（true）；rect。transform。transform。eulerAnglesVector3。｝summary初始化Shadow的大小summaryparamnamesizeparampublicvoidInitShadow（Vector2size）｛Shadow。Init（size）；｝summary让shadow跟随书页summaryparamnametargetparampublicvoidSetShadowFollow（Transformtarget）｛Shadow。SetShadowFollow（target）；｝publicvoidResetShadowDate（）｛Shadow。ResetShadowDate（）；｝｝｝完结，如何？，翻书效果不错吧，快一键三连双击加关注。
　　效果图