1.2.7Py编程学习之创建画布

1.2.7Py编程学习之创建画布大家都觉得之前那些都很乏味吧？确实，那些缺少了多变的色彩与形式！谁人不想生活丰富多彩呢？还记得吗，appuifw这个模块可以为我们提供三种基本的界面，今天终于等来了画布界面，开始了一片多姿多彩的新天地。好的，就先让我们先学着去开辟自己的第一片天地--创建一块画布！有了画布，才能绘出精彩嘛！来吧，让我们看一段简单的代码！#代码开始#importappuifwimportgraphicsappuifw.app.screen='large'appuifw.app.body=canvas=appuifw.Canvas()canvas.clear(0xff00ee)#代码结束#讲解：如果你在之前的章节中显示出过人的天赋，那么这个是无需多解释的！然而我还是要解释清楚，因为这是大家学习，而不是个人学习！废话挺多的哦，sorry！呵呵！appuifw中的画布界面需要graphics模块的辅助，即画布界面依赖于graphics模块才得以显示，graphics这个模块是专门处理有关图像方面的工作的，以后我会介绍的！所以一开始我们就引入了两个模块：appuifw和graphics！接着：appuifw.app.screen='large'这个很早就讲解过了，是设定屏幕大小的，这里设为large(大屏)！再接着：appuifw.app.body=canvas=appuifw.Canvas()这句设定了程序的主体，为画布界面(canvas翻译为中文就是“画布”的意思)，中间插入了一个canvas，是用来描述画布用的。如果你不打算描述画布，那就直接写成：appuifw.app.body=appuifw.Canvas()并且去掉后面剩下的内容！但这样系统会使用缺省值(即默认值)，默认画布的颜色为白色！这样多单调啊，所以我选择了描述画布：canvas.clear(0xff00ee)这句代码使画布的颜色变成了如截图所示的颜色！其中0xff00ee为颜色代码！clear翻译为中文是“清除”的意思！整句代码用Py语言翻译的意思是：用0xff00ee所代表的颜色去清除画布！你可以想象得出，那样整张画布的颜色不就变成了0xff00ee所代表的颜色了吗？在这里着重说一下0xff00ee这种格式的颜色代码！大家知道，背投电视机屏幕上的各种不同的色彩都是由红、绿、蓝这三种颜色混合出来的！这里的原理也一样，0xff00ee中的0x之后的数字或英文字母就是颜色代码的决定部分！两个f代表红色色深，两个0代表绿色色深，两个e代表蓝色色深！字母可以从a到f中去取(即a,b,c,d,e,f)，ff是最深的色，数字可以任意取，即0~9！总的来说，0x之后的6位中的每一位可以从a~f和0~9任意选择搭配！另外还有一种有效的颜色表示方法，还记得我之前制作的那个颜色代码查看器吗？在使用方法里我告诉大家记下三组数字，在这里我要讲的就是由三组数字组成的颜色代码！举个例子(128,200,238)。注意括号里面的三个数字就行了，每个数字可以从0~255中去取，在这里128代表红色色深，200代表绿色色深，238代表蓝色色深！最深色为255！如果是黑色(0,0,0)可以略写为0！这样你就可以按照这个原理去搭配你要的颜色代码！下面给出几种有效的颜色代码(具体颜色我就不清楚咯，乱搭配的！)：0xe2d4f80x0269370xabcdef0xff00aa(12,61,198)无效的颜色代码表示：0wff00ee不是以0x开头0xff00eg字母g超范围0xff00eef多了最后一位f，0x后只能有6位0xff00*e不能含有符号(-1,128,280)#-1和280都超范围了(0~255)(12,e*,64)不能用字母或符号代替数字(12,128,280,46)很明显，多了一组数字(12,128)少了一组数字结合本节例子使用示例：canvas.clear(0x0f0e0f)canvas.clear((128,128,128))截图#随缘情恋#供麦友学习之用importappuifwimportgraphicsappuifw.app.screen='large'appuifw.app.body=canvas=appuifw.Canvas()canvas.clear(0xff00ee)1.2.8Py编程学习之图形处理上一节我们学习了如何去创建一块画布！画布本来的作用就是让我们在上面去描绘我们想要的图像的，所以我们这一节就来学习在画布上面处理图像的技巧！示例代码有点长(建议麦友在查看时采用全文查看的方式浏览)，但原理绝对是简单的，有很多代码句是在重复着一个类似的方法，所以请给点耐心，别让表面的假像迷惑了！好了，代码开始了哦！#代码开始#importappuifwimportgraphics#引入所需模块defm(x):returnx.decode('utf-8')#定义中文编码方式appuifw.app.screen='large'#设定屏幕大小appuifw.app.body=canvas=appuifw.Canvas()#设定程序界面主体img=graphics.Image.new((176,208))#在画布上重新绘制一张大小为176*208的图像img.clear(0)#用黑色清除上述新图像img.text((45,20),m('随缘情恋'),0x0000ff,u'LatinBold12')#写字img.point((15,15),0xff0000,width=30,fill=0xff0000)#画圆img.polygon((10,160,10,100,50,130),0x004000,width=0.5,fill=0xff00ee)#画三角形img.rectangle((5,40,50,80),0x004000,width=0.6,fill=0xffff00)#画矩形img.line((60,160,60,60,160,10),0xaa00ee,width=5)#画线段img.ellipse((70,85,100,145),0xffff00,width=2,fill=0x3ff3e9)画椭圆img.pieslice((110,50,150,120),0,1.9,0xee0f0f,width=1,fill=0x925909)#画扇形img.arc((110,130,150,200),-0.5,2.9,0x0943861,width=2)#画弧线defredraw(rect):+canvas.blit(IMG)#将上面画好的图复制到画布上面redraw(())#让系统不停地重画#代码结束#讲解：引入所需模块，定义中文编码方式，设置程序界面主体后，就开始了绘图工作！先是：img=graphics.Image.new((176,208))如注释，这个方法是在画布上重新绘制一张大小为176*208的图像，当然，你也可以画其它大小的图片，我的N70屏幕大小是176*208，我想画全屏，所以选择了176*208！新画好这张图后，就将其等价于img(等价于其他你喜欢的名字也无所谓)，在下面你看到的很多img，指的就是这一张176*208大小的图片。接着：img.clear(0)我用黑色抹除了上述新图像(其实就是将上面新建的图片擦黑，0是黑色的代码)接着：img.text((45,20),m('随缘情恋'),0x0000ff,u'LatinBold12')这句代码表示在新图上写字。先来介绍一下在Py编程中的坐标表示！学过数学中的函数的人都知道，函数图像是有原点的，py中的坐标原点(0,0)是定义在屏幕的左上角的，向右为横坐标，依次递增，向下为纵坐标，依次递增！N70屏幕大小是176*208，那么屏幕右下角的坐标表示就是(176,208)。清楚了这个后，再看回头！img.text(…)的意思是在img这张图上写字，括号里的是相应的参数！有哪些参数呢？看好了：img.text(文字放置的坐标,文字内容,颜色,所用字体)参考例码，一个个参数对照起来怎么用！同样地，除了写文字，还有：画圆：img.point(…)画三角形：img.polygon(…)画矩形：img.rectangle(…)画线段：img.line(…)画椭圆：img.ellipse(…)画扇形：img.pieslice(…)画弧线：img.arc(…)那么这些他们各自都有些什么参数呢？下面是使用格式及方法：写字：img.text(文字坐标,文字内容,颜色,字体)使用注意：1、文字位置只需给出一个始坐标。2、文字要定义好编码方式。3、一定要为文字选好字体，否则只会显示口口。画圆：img.point(圆心坐标,边框颜色,直径,填充颜色)使用注意：1、可忽略填充颜色(即不进行填充)！画三角形：img.polygon(三个坐标,颜色,边框粗细，填充颜色)使用注意：1、必需给出三个坐标，如(10,60,20,2,80,100)，从左向右，每两个为一组，三角形有三个顶点嘛！2、可忽略填充颜色！画矩形：img.rectangle(坐标,边框颜色,边框粗细，填充颜色)使用注意：1、坐标要给出两组，如(10,20,50,60)，从左向右，每两个为一组！分别表示矩形左上角坐标，矩形右下角坐标。2、可忽略填充颜色！画线段：img.line(坐标,颜色,线段粗细)使用注意：1、必需给出至少两组坐标，分别表示线段起点坐标，终点坐标！如果给出两组以上的坐标，就画折线！画椭圆：img.ellipse(坐标,边框颜色,边框粗细,填充颜色)使用注意：1、必需给出两组坐标，分别表示椭圆外切矩形左上角坐标及右下角坐标！2、可忽略填充颜色！画扇形：img.pieslice(坐标,开始方向角,结束方向角,边框颜色,边框粗细,填充颜色)使用注意：1、必需给出两组坐标，这两个坐标其实是用来画出一个椭圆的，扇形就从这个椭圆中分割出来的！2、谈到方向角，学过高中数学单位圆中的弧度角的人会很容易理解。没学过的呢？我给出方向角范围，你们可以改变方向角去体验一下用法！0-水平向右，π/2-垂直向下，π-水平向左，-π/2-垂直向下！选择方向角时就从-π/2到3π/2取好了，其中π约等于3.14！2、填充颜色可忽略！画弧线：img.arc(坐标，开始方向角，结束方向角，弧线颜色，弧线粗细)使用注意：1、坐标定义与画扇形的一样，弧线是从一个椭圆的边框中去截取的！上面只是构建了一幅画的内容了而已，但他还不能在新建的img上显示，所以紧接着定义了一个函数，其主块内容是：canvas.blit(IMG)在之前的创建画布章节中，我们知道appuifw.app.body=canvas=appuifw.Canvas()中的canvas是用来描述画布的！blit()这个方法是将一张图复制到画布上！blit(IMG)就是将img这幅图复制到画布上！为什么defredraw(rect)括号中多了rect？不是很懂，照做！定义了这个函数后，如果只是redraw()，那么系统只会复制一次img到画布上！想要他不断地复制，就redraw(())！正如你所见，这篇贴够长的了！停！不懂就留言吧！本节示例代码下载#随缘情恋#供麦友学习之用importappuifwimportgraphicsdefm(x):returnx.decode('utf-8')appuifw.app.screen='large'appuifw.app.body=canvas=appuifw.Canvas()img=graphics.Image.new((176,208))img.clear(0)img.text((45,20),m('随缘情恋'),0x0000ff,u'LatinBold12')img.point((15,15),0xff0000,width=30,fill=0xff0000)img.polygon((10,160,10,100,50,130),0x004000,width=0.5,fill=0xff00ee