android绘图canvas的sava、restore、rotate以及若干有关问题，canvas绘图的理解

2012-06-21

android绘图canvas的sava、restore、rotate以及若干问题，canvas绘图的理解不知道是我的理解能力有问题还是怎

android绘图canvas的sava、restore、rotate以及若干问题，canvas绘图的理解

不知道是我的理解能力有问题还是怎么回事，网上有很多举例说明的，我都看不懂，理解不能，而楼下还有很多的人说一目了然浅显易懂。纠结了N久，决定自己来理解一番，做个记录。

所有的操作都是通过canvas来实现的，这个的意思是说，平移、旋转、放大缩小的操作，都是直接操作canvas来实现。canvas就是一般理解的画布。导致理解错误的根源就是这里。

经常看到这样的代码：

<img src="//img.reader8.net/uploadfile/jiaocheng/2014018/2602/2014012612024515153.jpg" alt="android绘图canvas的sava、restore、rotate以及若干有关问题，canvas绘图的理解"><br></p><p><strong>还有一个问题，图上方块的位置和代码里面的貌似也不一样，这个后面再说</strong></p><p><strong><br></strong></p><p>        然后试验了几次之后我发现，画图的canvas和显示没关系，而这个canvas又只影响你画图。</p><p>        意思就是，画图，实际上是画在这个canvas定义的范围和规则下，但是显示在屏幕上，如下图：</p><p><img src="//img.reader8.net/uploadfile/jiaocheng/2014018/2602/2014012612024515154.jpg" alt="android绘图canvas的sava、restore、rotate以及若干有关问题，canvas绘图的理解"><br><br></p><p>蓝色的是手机屏幕边框，红色的是一个全屏的canvas</p><p><br></p><p><img src="//img.reader8.net/uploadfile/jiaocheng/2014018/2602/2014012612024515155.jpg" alt="android绘图canvas的sava、restore、rotate以及若干有关问题，canvas绘图的理解"><br></p><p><br></p><p>        当canvas旋转30度之后，其实成了这个样子，但是你绘制的图形还是只能在canvas内，并且坐标是按照canvas旋转之前来的，也就是左上角坐标仍然是（0，0），右下角的坐标仍然是（width，height）。</p><p>        也就是说，你按照（100，100，150，150）画出来的rect需要旋转30度之后，才是你看到的效果，这就是上面那个坐标看上去好像不对的原因。</p><p><br></p><p><strong>忘记个重要的事情，这个canvas只是定义了画图的规则，范围，但是其实图是画在屏幕上的，所以最开始那个2个rect谁该旋转的问题就解决了。</strong></p><p><strong><br></strong></p><p><strong><br></strong></p><p>        那么save和restore的问题也就好解决了，save只是save了当前这个canvas的状态，和已经画出来的图形无关，restore就是取出最近一次save的canvas的状态，仍然不影响图形。</p><p><br></p><p><br></p><p><br></p><p>        还有一个涉及到的问题就是，如下面旋转canvas之后的图，那么这个时候画在canvas之外的图形会怎么处理保存，试验了之后发现，由显示控件截取。</p><p>        也就是说如果我画在一个bitmap上，那么这个bitmap的边界就是能显示的最大范围</p> </p><div class="aged2"><script type="text/javascript">a("article_content_down");</script></div>
 </div>
<div id="pagebox" >
<a href="/jiaocheng/android/" target="_blank">查看更多</a>
<A href="/jiaocheng/20120731/1425992.html" title="【2012.04.22 Android每天一练】注册广播有几种方式，这些方式有何优缺点">下一篇</A></div>
<div id="MainLeftll">
<div id="MainLeftllToolbar">本文网址：<a href="https://www.reader8.net/jiaocheng/20120621/1425995.html">https://www.reader8.net/jiaocheng/20120621/1425995.html</a></div>
<div class="related"><span class="relatedIco1">读书人精选</span>
<ul class="relatedList">
</ul>
</div>
<div class="aged3"><script type="text/javascript">a("article_content_down2");</script></div>
<div class="aged3a"><script type="text/javascript">a("article_content_down3");</script></div>
</div>
</div>
<!-- 文章正文左边结束 -->
<!-- 文章正文右边开始 -->
<div class="leftbox_r">
<div class="aged4"><script type="text/javascript">a("article_right_up");</script></div> 
<div class="Rtitle">
<span class="Rtitle_text">热点排行</span></div>
<div class="RContl">
<ul>
<li><a href="/jiaocheng/20140103/1433032.html" target="_blank">Android之联系人处置</a></li>
<li><a href="/jiaocheng/20131101/1394034.html" target="_blank">Android中Is library配置的功用</a></li>
<li><a href="/jiaocheng/20120522/1442511.html" target="_blank">前辈：TextView中的URL超链接显示有关问</a></li>
<li><a href="/jiaocheng/20120522/1388186.html" target="_blank">ubuntu下编译opencore出现有关问题</a></li>
<li><a href="/jiaocheng/20130402/1393312.html" target="_blank">Android 卡通框架详解</a></li>
<li><a href="/jiaocheng/20120902/1451786.html" target="_blank">android sdk adt装配的一些经验-又是吐血</a></li>
<li><a href="/jiaocheng/20120809/1441892.html" target="_blank">progressDialog的有关问题</a></li>
<li><a href="/jiaocheng/20130915/1431163.html" target="_blank">求指教ZAKER类似WinPhone界面是如何做的</a></li>
<li><a href="/jiaocheng/20120925/1398395.html" target="_blank">android phoneGap 静态页面中简略的数据</a></li>
<li><a href="/jiaocheng/20120910/1441813.html" target="_blank">android异步加载和资料资源类型</a></li>
</ul>
</div>
<div class="aged7"><script type="text/javascript">a("article_right_up2");</script></div>
<!-- 文章正文右边结束 -->
</div>
<!--主体结束-->
<script type="text/javascript">a("article_down_up");</script>
<script type="text/javascript">a("foot");</script>
<script type="text/javascript">a("article_down_up2");</script>
<!--主体结束-->
<div style="display:none"> 
<!--百度统计代码--> 
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?d6151f323a57d16696165e47eee86d53";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</div> 
<script type="text/javascript">a("allbt");</script>
</body>
</html>