EasyButtonX开发全程实录

0x00 简介

在 C++ 的开发中，我们不时会需要一些按钮来帮助我们获取用户的一些特定输入，比如在提示框中，使用按钮可以让用户无需从键盘输入“确定”。为了使用按钮，一般开发会使用 WinApp 的开发。但是 WinApp 的开发极为繁琐，甚至什么也不干，只是启动程序就需要写近 80 行代码。所以我们将开发一个简易的按钮组件“EasyButtonX”。

为了使用图形界面，我们使用 EasyX 进行开发。注意！使用 EasyButtonX 之前也需要安装 EasyX！

---

0x01 准备工作

这里，我们需要两个软件：EasyX 和 VisualStudio (不是VScode)，此处说明一下，建议以后使用我们的 EasyButtonX 时也用 VisualStudio 作为 IDE。

---

0x01.1 安装 VisualStudio

首先打开这个网址 https://visualstudio.microsoft.com/ ，下载 VisualStudio ，请下载 Community 版本 (旁边有一个 VisualStudioCode，不是那个)。

然后运行刚才下载的 VisualStudioSetup.exe ，等待一系列的配置以后，就会出现一个 VisualStudioInstaller ，我们在“可用”一栏里找到 VisualStudio Community 2022 ，选择安装，并安装所有与 C++ 有关的插件，不过有些大，大约 20 多个 G 吧，可以安装在 D: 盘上，但是 C: 盘仍然需要一些缓存的空间，大约 2G 左右。然后再等一会就好了 (PS: 中国古代历法中，一会是 10800 年)。

然后，我们就可以通过 VisualStudioInstaller 启动VisualStudio了。

---

0x01.2 安装EasyX

首先打开这个网址 https://easyx.cn/ ，下载EasyX安装包。

随后运行刚才下载的文件，点“下一步”，然后把所有可以安装的版本全部安装一遍 (反正也没多大，装了只有好处)。

---

至此，准备工作完成。

---

0x02 生成项目

首先，我们打开 VisualStudio (以下简称 VS)

点击“创建新项目”，选择“空项目”，然后项目名称填“EasyButtonX”，存储位置自定，并勾选“将解决方案和项目放在同一目录中”。

等待创建完成，我们依次点击 新建 -> 文件，在搜索框里填写“头文件”，选择“头文件(.h)”

至此，我们的文件创建完毕。

---

0x03 基本框架

由于这是一个按钮组件，我们定义创建按钮的语句为
Button 按钮名称(x坐标,y坐标,x方向的长度,y方向的长度,文本,文本颜色);
，以下就是一个例子：
Button Mybutton(200,200,100,50,(char *)"Hello,World!");

而这个“Button”实际上是一个类，也就是 class ，而 MyButton 后面的括号里的内容是构造函数。

所以，我们可以打出以下代码框架：

#include <easyx.h> //使用EasyX的库函数

class Button
{//声明 Button 类
private:
    //各种信息的存储
    int x, y, x_length, y_length;
	char* text;
	int textcolor;
	void press(void)
	{//按下的外表绘制
		
	}
	void init(void)
	{//初始状态绘制
		
	}
public:
    bool push = false; //表示是否按下
	void testpress(void)
	{//检测按下情况
		
	}
	Button(int x, int y, int x_length, int y_length, char* text, int textcolor)
	{//构造函数
        //全部赋值
		this->x = x;
		this->y = y;
		this->x_length = x_length;
		this->y_length = y_length;
		this->text = text;
		this->textcolor = textcolor;
        //绘制初始状态
		init();
	}
	~Button() {} //析构函数
};//不要忘了分号

---

0x04 功能实现

接下来，我们进行每一项功能的实现。

---

0x04.1 init() 函数实现

我们需要绘制一个矩形，表示按钮的边框，在按钮边框的上边和右边再加深阴影，并打印文本。

void init(void)
{
	setlinestyle(0, 4);//设置粗细为4，线条样式为 0 (普通线条)
    //外边框
	setlinecolor(0x8d8d8d);
	rectangle(x, y, x + x_length, y + y_length);
    //两条阴影
	setlinecolor(0xbababa);
	line(x + x_length - 3, y + 3, x + x_length - 3, y + y_length - 3);
	line(x + 3, y + 3, x + x_length - 3, y + 3);
    //打印文本
	settextcolor(textcolor);
	outtextxy(x + 3, y + (y_length / 2) - 7, text);
}

---

0x04.2 press() 函数实现

其实代码和 init() 函数差不多，只是颜色不同，没有文字修改而已。

void press(void)
{
	setlinestyle(0, 4);//设置粗细为4，线条样式为 0 (普通线条)
    //外边框
	setlinecolor(0xbababa);
	rectangle(x, y, x + x_length, y + y_length);
    //两条阴影
	setlinecolor(0x8d8d8d);
	line(x + x_length - 3, y + 3, x + x_length - 3, y + y_length - 3);
	line(x + 3, y + 3, x + x_length - 3, y + 3);
}

---

0x04.3 testpress() 函数实现

这个函数我们需要首先获取一个鼠标的动作，然后再判断是否是左键、是否在按钮区域中点击等，如果是，那么就修改按钮外观和 push 变量的值。

void testpress(void)
{
	if (MouseHit())//判断是否有关于鼠标的信息
	{
		MOUSEMSG msg = GetMouseMsg();//获取鼠标信息
		if (msg.uMsg == WM_LBUTTONDOWN)//如果是左键
		{
			if (msg.x > x && msg.x < x + x_length && msg.y>y && msg.y < y + y_length)//如果在按钮里点击的
			{
                //修改值
				press();
				push = true;
				while (msg.uMsg != WM_LBUTTONUP)//等待鼠标抬起
				{
					msg = GetMouseMsg();
				}
			}
			else if (push == true)init(), push = false;
		}
		else if (push == true)init(), push = false;
	}
	else if (push == true)init(), push = false;
}

不过我们发现，这样写会报错，原因是 MouseHit() 等函数未定义！

这是为什么呢？因为这些函数其实 easyx.h 并没有包含这个函数，我们需要导入一些额外的头文件。

这里我们导入的 windows.h 在 linux 环境下并不能使用，不过不用担心，easyx 本身也只能在 windows 下使用，所以并不影响我们的开发。

在程序的最前面添加以下代码：

#include <easyx.h>
#include <stdio.h>
#include <windows.h>
#include <graphics.h>

这样就好啦！

---

0x05 完成啦！

至此，我们的 EasyButtonX 就开发到这里啦，各位读者也可以自行更新出其它功能呢！

~ 完结散花 ヾ(◍°∇°◍)ﾉﾞ ~

---

附录 完整代码

如果自己写不出来的话，可以看看这个代码，或者去看看 项目地址

#include <easyx.h>
#include <stdio.h>
#include <windows.h>
#include <graphics.h>

class Button
{
private:
	int x, y, x_length, y_length;//Start x,start y,x 's length,y 's length
	char* text;//Button 's text
	int textcolor;
	void press(void)
	{//This function is draw this Button
		setlinestyle(0, 4);
		setlinecolor(0xbababa);
		rectangle(x, y, x + x_length, y + y_length);
		setlinecolor(0x8d8d8d);
		line(x + x_length - 3, y + 3, x + x_length - 3, y + y_length - 3);
		line(x + 3, y + 3, x + x_length - 3, y + 3);
	}
	void init(void)
	{
		setlinestyle(0, 4);
		setlinecolor(0x8d8d8d);
		rectangle(x, y, x + x_length, y + y_length);
		setlinecolor(0xbababa);
		line(x + x_length - 3, y + 3, x + x_length - 3, y + y_length - 3);
		line(x + 3, y + 3, x + x_length - 3, y + 3);
		settextcolor(textcolor);
		outtextxy(x + 3, y + (y_length / 2) - 7, text);
	}
public:
	bool push = false;
	void testpress(void)
	{
		if (MouseHit())
		{
			MOUSEMSG msg = GetMouseMsg();
			if (msg.uMsg == WM_LBUTTONDOWN)
			{
				if (msg.x > x && msg.x < x + x_length && msg.y>y && msg.y < y + y_length)
				{
					press();
					push = true;
					while (msg.uMsg != WM_LBUTTONUP)
					{
						msg = GetMouseMsg();
					}
				}
				else if (push == true)init(), push = false;
			}
			else if (push == true)init(), push = false;
		}
		else if (push == true)init(), push = false;
	}
	Button(int x, int y, int x_length, int y_length, char* text, int textcolor)
	{//This function is init this button
		this->x = x;
		this->y = y;
		this->x_length = x_length;
		this->y_length = y_length;
		this->text = text;
		this->textcolor = textcolor;
		init();
	}
	~Button() {}
};