多种方式绘制简单的作废章
作废章是常用的长方形印章，其形式如下图所示（图片来自参考文献1）。印章的形式很简单，就是红色方框内显示作废两个字，其实在网上百度长方形印章的话，可以搜索出很多类似形式的印章，区别仅在于尺寸不同及印章内容不同。
本文梳理之前学过的C#的GDI+、html的canvas、python的turtle及html的div标签等知识，列出上述四种编程方式的作废章绘制形式。
C#的GDI+
采用GDI+绘制边框的话，直接调用DrawRectangle即可，但是绘制文字的话可以采用两种方法。一种是直接绘制文字，直接调用DrawString绘制文本，这种方式需要调整文本字体大小以符合边框尺寸，另一种是先固定字体，将文本转成图片，然后用DrawImage方式将带文本的图片绘制到边框内。这两种方式的绘图效果及代码如下所示：
Graphics g = e.Graphics;Font f = new Font("楷书", 20, FontStyle.Bold);string text = "作 废";Size s = g.MeasureString(text, f).ToSize();Bitmap img = new Bitmap(s.Width + 1,s.Height + 1);using(Graphics imgG=Graphics.FromImage(img)){using(StringFormat sf=new StringFormat()){sf.Alignment = StringAlignment.Far;sf.LineAlignment = StringAlignment.Center;imgG.DrawString(text, f, Brushes.Red, new RectangleF(0, 0, img.Width, img.Height), sf);} }using(Pen p=new Pen(Brushes.Red,5)){g.DrawRectangle(p, new Rectangle(50, 50, 96, 39));g.DrawString(text, f, Brushes.Red, new Rectangle(50, 50, 96, 39));g.DrawRectangle(p, new Rectangle(50, 150, 96, 39));g.DrawImage(img, new Rectangle(53, 154, 90, 35)); }
html的canvas
canvas的绘图思路主要是调用strokeRect和fillText函数绘制边框和内容，需要注意的是文本对齐的设置方式，这点详见参考文献4。绘制代码及效果如下图所示：
DOCTYPE html>
<html><head><meta charset="utf-8"/><script>window.onload=function(){var cnv=document.getElementById("canvas");var cxt=cnv.getContext("2d");cxt.strokeStyle="red";cxt.lineWidth=4;cxt.strokeRect(20,20,96,39);cxt.font="bold 35px 楷体";cxt.fillStyle="red";cxt.textBaseline = "top";cxt.fillText("作 废",20,20);}script>head><body><canvas id="canvas" width="200" height="100" style="border:1px dashed gray;">canvas>body>
html>
python的turtle
采用tkinter中的canvas组件可以绘制作废章，不过最近在学turtle的基本用法，想着用turtle实现更简单。绘制代码及效果如下图所示：
import turtleturtle.color('red')
turtle.pensize(5)
turtle.penup()
turtle.goto(-50,50)
turtle.pendown();
turtle.forward(96)
turtle.right(90);
turtle.forward(39)
turtle.right(90);
turtle.forward(96)
turtle.right(90);
turtle.forward(39)turtle.penup()
turtle.goto(-40,15)
turtle.pendown();
turtle.write("作 废",align="left",font=("楷体", 22, "bold"))turtle.hideturtle()
turtle.done()
html的div
不编写代码，使用html的div和span标签，通过CSS设置来配成作废章的样式（CSS的东西确实搞不太懂，主要参照参考文献5设置的文本对齐）。html代码及效果如下图所示：
.border{position: absolute;left: 50px;top: 50px;width: 96px;height: 39px;border: 4px solid red;
}#content{color : red;font-size:30px;font-weight:bold;font-family: 楷体;margin: 0 auto;display: table;
}<div class="border"><span id="content">作 废span>
div>
参考文献
[1]https://item.jd.com/1684454184.html#none
[2]https://www.runoob.com/w3cnote/html5-canvas-intro.html
[3]https://codepen.io/
[4]https://www.twle.cn/l/yufei/canvas/canvas-basic-text-textbaseline.html
[5]https://www.cnblogs.com/HtmlDuck/p/16258806.html
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！