(AS3)利用BitmapData.draw对位图进行翻转缩放操作
<p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">Sprite对象有2个关于缩放的属性scaleX、scaleY，分别是缩放x轴和y轴。</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">看下面代码：</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><div class="cnblogs_code" style="margin-top: 5px; margin-bottom: 5px; padding: 5px; background-color: rgb(245, 245, 245); border: 1px solid rgb(204, 204, 204); overflow: auto; color: rgb(0, 0, 0); font-size: 12px; font-family: "Courier New" !important;"><div class="cnblogs_code_toolbar" style="margin-top: 5px;"><span class="cnblogs_code_copy" style="padding-right: 5px; line-height: 1.5 !important;"><a title="复制代码" style="color: rgb(6, 129, 186); text-decoration-line: underline; border: none !important;"><img src="https://common.cnblogs.com/images/copycode.gif" alt="复制代码" style="max-width: 900px; height: auto;"></a></span></div><div><span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> c:Sprite = new Sprite;<br>c.x = 200;<br>addChild(c);<br><br><span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> s:Sprite = new Sprite;<br>s.graphics.beginFill(0xff0000);<br>s.graphics.drawRect(0,0,100,100);<br>s.graphics.endFill();<br>s.graphics.beginFill(0x00ff00);<br>s.graphics.drawRect(100,0,100,100);<br>s.graphics.endFill();<br>c.addChild(s);<br><br><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">//</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">s.scaleX = -1;</span></div><div class="cnblogs_code_toolbar" style="margin-top: 5px;"><span class="cnblogs_code_copy" style="padding-right: 5px; line-height: 1.5 !important;"><a title="复制代码" style="color: rgb(6, 129, 186); text-decoration-line: underline; border: none !important;"><img src="https://common.cnblogs.com/images/copycode.gif" alt="复制代码" style="max-width: 900px; height: auto;"></a></span></div></div><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">下图分别是注释和没注释最后一句代码的运行结果：</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"><img src="https://images.cnblogs.com/cnblogs_com/yili16438/QQ%E6%88%AA%E5%9B%BE20120427163705.jpg" width="441" height="186" alt="" style="border: 0px; max-width: 900px; height: auto;"><img src="https://images.cnblogs.com/cnblogs_com/yili16438/QQ%E6%88%AA%E5%9B%BE20120427163722.jpg" width="459" height="177" alt="" style="border: 0px; max-width: 900px; height: auto;"><br></p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">把注释去掉可以发现，该对象已经水平翻转了一下，不过看过来却好像坐标往左移了200个像素，实际上只是像素变了，坐标并没有变。</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">不过这里可以发现，当把scaleX会水平翻转，那scaleY会怎么样呢？没错，是垂直翻转了！</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">由此为基础，使用BitmapData.draw，配合Matrix，就可以实现一个位图或者对象的水平翻转和垂直翻转，下面是实现代码：</p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><div class="cnblogs_code" style="margin-top: 5px; margin-bottom: 5px; padding: 5px; background-color: rgb(245, 245, 245); border: 1px solid rgb(204, 204, 204); overflow: auto; color: rgb(0, 0, 0); font-size: 12px; font-family: "Courier New" !important;"><div class="cnblogs_code_toolbar" style="margin-top: 5px;"><span class="cnblogs_code_copy" style="padding-right: 5px; line-height: 1.5 !important;"><a title="复制代码" style="color: rgb(6, 129, 186); text-decoration-line: underline; border: none !important;"><img src="https://common.cnblogs.com/images/copycode.gif" alt="复制代码" style="max-width: 900px; height: auto;"></a></span></div><div>package org.easily.utils<br>{<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">import</span> flash.display.BitmapData;<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">import</span> flash.geom.Matrix;<br><br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">public</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">class</span> BitmapDataUtils<br> {<br> <span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">//</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">水平翻转一个位图</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;"><br></span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">public</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">static</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">function</span> flipHorizontal(bmpData:BitmapData, transparent:<span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">Boolean</span> = <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">true</span>, fillColor:uint = 0):BitmapData<br> {<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> matrix:Matrix = new Matrix();<br> matrix.a = -1;<br> matrix.tx = bmpData.width;<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> bmpData_:BitmapData = new BitmapData(bmpData.width, bmpData.height, transparent, fillColor);<br> bmpData_.draw(bmpData, matrix);<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">return</span> bmpData_;<br> }<br> <br> <span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">//</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">垂直翻转一个位图</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;"><br></span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">public</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">static</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">function</span> flipVertical(bmpData:BitmapData, transparent:<span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">Boolean</span> = <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">true</span>, fillColor:uint = 0):BitmapData<br> {<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> matrix:Matrix = new Matrix();<br> matrix.d = -1;<br> matrix.ty = bmpData.height;<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> bmpData_:BitmapData = new BitmapData(bmpData.width, bmpData.height, transparent, fillColor);<br> bmpData_.draw(bmpData, matrix);<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">return</span> bmpData_;<br> }<br> <br> <span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">//</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;">缩放位图</span><span style="color: rgb(0, 128, 0); line-height: 1.5 !important;"><br></span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">public</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">static</span> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">function</span> scaleBitmapData(bmpData:BitmapData, scaleX:<span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">Number</span>, scaleY:<span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">Number</span>):BitmapData<br> {<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> matrix:Matrix = new Matrix();<br> matrix.scale(scaleX, scaleY);<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">var</span> bmpData_:BitmapData = new BitmapData(scaleX * bmpData.width, scaleY * bmpData.height, <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">true</span>, 0);<br> bmpData_.draw(bmpData, matrix);<br> <span style="color: rgb(0, 0, 255); line-height: 1.5 !important;">return</span> bmpData_;<br> }<br> }<br>}</div><div class="cnblogs_code_toolbar" style="margin-top: 5px;"><span class="cnblogs_code_copy" style="padding-right: 5px; line-height: 1.5 !important;"><a title="复制代码" style="color: rgb(6, 129, 186); text-decoration-line: underline; border: none !important;"><img src="https://common.cnblogs.com/images/copycode.gif" alt="复制代码" style="max-width: 900px; height: auto;"></a></span></div></div><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);"> </p><p style="margin: 10px auto; color: rgb(102, 102, 102); font-family: Arial, 微软雅黑, 宋体, sans-serif; font-size: 12px; background-color: rgb(221, 221, 221);">最后一个缩放位图的方法适用于等比例缩放一个对象，位图引擎里面应该也有类似的实现。</p><p></p>
页:
[1]