python图形用户界面（六）：可视化给图片添加上文字

本系列课程是针对无基础的，争取用简单明了的语言来讲解，学习前需要具备基本的电脑操作能力，准备一个已安装python环境的电脑。如果觉得好可以分享转发，有问题的地方也欢迎指出，在此先行谢过。

前言

之前在图形处理系列课程中，讲过如何给图片添加上文字，尽管通过程序设定，已经可以实现文本自动居中的效果，人的需求是会不断变的，我们有时候可能并不想只放在中间，而是想要放到图片的任意一个位置，用原来的方法改一改坐标也是可以实现的，不过会非常麻烦。如果可以可视化的操作，让我们自己调整文字到我们想要的位置，那应该非常方便。

今天就来介绍如何自己设计一个可以进行可视化操作，给图片添加上文字的方法。

可视化的核心其实就是让可视化的操作变化对应转化成实际变化，简单点说，可视化时我们操作移动文字到左上角了，如何让实际生成的图片的文字也在左上角？比如可视化时我们x,y各减小100，实际要达到这种效果，我们就需要进行一个对应的转化了，因为二者的坐标系统可能不一致，可能我们需要x,y各增大200。

我们操作的时候移动文字位置了，这里只是给我们看的，如果直接就生成图片，其实得到的结果并没有变化；要想将这种移动变化转化成实际的移动，我们需要计算二者的转换关系，在生成的时候直接就将这种数值关系对应的实际变化中就实现了对应的效果。

效果展示

支持更改画布大小和更改背景色，可以选择保存图片的类型（png和jpg)。

支持字体的修改，文字内容，颜色，大小，显示位置。

如果不用默认的背景图，也可以自己选择图片，同样支持上面的功能。

实现思路：

1.功能构思。

画布：使用一个标签，支持大小和背景更改（使用滑动控件和单行输入框）

图片选择：使用一个按钮和一个标签

文本内容：使用一个标签，支持大小，字体类型，颜色，显色位置。（使用滑动控件，字体下拉框控件和单行输入框）

保存：使用一个按钮和一个下拉框。

2.UI布局设计。

功能较多，整个界面也比较大，这里显示的不完成，总体就是分为左右两侧布局，左侧里面采用垂直布局，里面的每一个小功能采用的是水平布局。右侧其实里面有两个标签，分别用来显示图片和文字内容的。

3.转换界面为python文件代码

利用pyside2-uic将ui文件转换成py文件。

4.初始化界面

5.功能实现。

其实整体功能实现并不难，主要分为了几个大部分，画布区改变响应，画布区里面显示的其实是图片，所以这里imgNew专门用来生成图片的，textChange用来实现文本内容和样式的改变，selectImg用来选择图片，最后一个saveImg用来生成保存图片用的。