代码写得很牛逼但UI界面却搞得很丑？来，杨工带你！

平时在MCU LCD上搞一些界面，太复杂太麻烦的，可能会上emwin，但是大部分需求都是拿到一副BMP的图，然后通过Image2Lcd生成一个C语言数组，接下来将数组复制到代码中，调用LCD显示图片的函数进行显示。

除了嵌入式系统的UI需求，平时我们也会在PC机上去开发一些上位机或者简单的APP，比如下面这两个以前我做来测试的工具：

这些界面给用户最直观的感觉，太丑了吧！至少得增加一些LOGO或者别的东西，让它看起来更符合人的审美设计，但是对于工程师而言，嗯！能做出来还是非常有成就感的！

经常逛Github的同伴肯定会发现，为什么别人做的开源软件那么炫，那些图标是怎么弄来的呢？

1、推荐一个我经常用的Iconfont

Iconfont-国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造,设计和前端开发的便捷工具

比如，我想找一个音量的图标，我只需要搜索音量，就能找到这么多图标啦！

选择图标配色、尺寸大小、图标格式，接下来就可以愉快的下载下来啦，完全免费

2、不会PS切图，拼图？来，我教你

很多嵌入式软件工程师都抱怨，哎，不懂PS呀，不会P图，其实对于我们嵌入式软件工程师而言，我们最关心的是显示图标的格式、尺寸大小，这就够了，至于显示在软件上的哪个位置，需要根据现实情况随时进行调节。

2.1 以PS做一个64*64音量图标为例

假设我的音量图标规格要求是64*64的，那么就这样来做：

(这是刚刚下载的)

首先新建一个PSD文件，然后输入宽度、高度分别为64、64像素，然后点确定

然后看到是这样的效果：

然后将音量用鼠标左键按住不动拖进来，根据框框调节在图标里显示的区域。

按住Shift键，然后鼠标拖动让图片能够等比缩放。图标做好了，接下来打开文件，然后选择存储为：

这时就可以保存为具体的图片格式啦。

只要是符合规范的图片，都可以通过存储为转换一下图像格式，常见的有JPG转BMP，PNG转BMP，JPG转PNG等等。

这里我转成了BMP格式。

如果要切图，那怎么办呢？

然后Ctrl+"+"将图标放大

选择裁剪区域

确定裁剪。

裁剪成功。

裁剪成功，当然也可以通过以下选项来修改图像大小和画图大小。

往期精彩

WIFI DTU产品设计与实现(基于STM32F103+QT配置上位机案例设计分享)

圆曾经的小车梦，造一台智能小车(三)之小车前进后退左右转基本框架

推荐三个我工作中经常使用的驱动大全wiki(建议收藏并转发让更多人知道！)

觉得本次分享的文章对您有帮助，随手点[在看]并转发分享，也是对我的支持。