游戏引擎Easy2D-教程-简单绘画-蜡笔(基于版本V2.1.14)

如果你还不了解Easy2D或者刚刚接触Easy2D，那么建议你前往Easy2D官网学习或者巩固一下自己的Easy2D基础概念：

        Easy2D 轻量级游戏开发框架 

也可以加入Easy2D群聊与群友一起讨论问题：

608406540

---

个人建议：

 如果想要写出属于自己的游戏，一定要多练习写代码，熟能生巧。不要怕bug，有bug就修，不会就search。

---

原理：

绘画的本质就是画直线，不过是检测的次数多了，就可以实现曲线的效果了。

---

正文：

1、首先，我们先生成一个类：

 2、将这个类取名为PrinterPen，以public方式继承Node类  (继承Node类是为了重载使用Node类内onUpdate函数，onUpdate每一帧都会被Easy2D调用)

 3、修改包含文件

为了方便后面的顺利进行，我们包含easy2d.h头文件，并使easy2d名空间标准化

修改后的头文件如下：

#pragma once
#include 
using namespace easy2d;

class PrinterPen :
    public Node
{
};

4、重载onUpdate

class PrinterPen :
    public Node
{
public:
    void onUpdate()override;
};

 5、添加变量，前面的原理我们已经说了，绘画的本质不过是画线，但是，怎么才能确定直线的两点坐标呢？当前鼠标的坐标好确定，关键是另一个坐标，对了，另一个坐标就是上一帧鼠标的坐标，所以我们可以用lastPoint(Point)变量来储存每一帧鼠标的坐标。又有一个问题，第一次绘画时的坐标怎么确定，我们可以在第一次绘画时不绘制直线，只保存鼠标坐标即可。另外我们用isJustPressed(bool)变量来标识状态

class PrinterPen
	:public Node
{
public:
    PrinterPen();

	void onUpdate()override;

private:
	Point lastPoint;

	bool isJustPressed;
};

 6、完善.cpp文件

首先我们完成构造函数

#include "PrinterPen.h"

PrinterPen::PrinterPen()
{
    lastPoint = {0,0};
    isJustPressed = false;
}

接下来实现onUpdate函数

void PrinterPen::onUpdate()
{
    //检测左键是否按下
	if (Input::isDown(MouseCode::Left))
	{
		if (isJustPressed)
		{
            //创建Line
			auto shape = ShapeNode::createLine(lastPoint, Input::getMousePos());
            //设置节点颜色为黑色
	        shape->setStrokeColor(Color::Black);
            //获取当前场景并加入节点
	        SceneManager::getCurrentScene()->addChild(shape);
		}
        //更新数据
		isJustPressed = true;
		lastPoint = Input::getMousePos();
	}
	else
	{
		isJustPressed = false;
	}
}

7、测试代码

在源.cpp文件中加入测试代码

#include 
using namespace easy2d;

#include "PrinterPen.h"

int main()
{
	if (Game::init("Printer",1200,800))
	{
		//Renderer::showFps();

		auto scene = gcnew Scene;
		SceneManager::enter(scene);

        auto pen = gcnew PrinterPen;
        scene->addChild(pen);

		Game::start();
	}
	Game::destroy();

	return 0;
}

8、优化代码

但是如果我们测试一下就会发现当鼠标左键按下且鼠标坐标不动时，仍在源源不断地生成节点，会严重影响性能，所以这个时候我们应该加入限制条件：

void PrinterPen::onUpdate()
{
    //检测左键是否按下
	if (Input::isDown(MouseCode::Left))
	{
		if (isJustPressed)
		{
            //加入限制条件-------------------------
            if(Input::getMousePos() != _lastPoint)
            {
                //创建Line
			    auto shape = ShapeNode::createLine(lastPoint, Input::getMousePos());
                //设置节点颜色为黑色
	            shape->setStrokeColor(Color::Black);
                //获取当前场景并加入节点
	            SceneManager::getCurrentScene()->addChild(shape);
            }
		}
        //更新数据
		isJustPressed = true;
		lastPoint = Input::getMousePos();
	}
	else
	{
		isJustPressed = false;
	}
}

这时我们再测试一次，完美！

9、Enjoy！

---

完整代码

Printer.h

#pragma once
#include 
using namespace easy2d;

class PrinterPen
	:public Node
{
public:
    PrinterPen();

	void onUpdate()override;

private:
	Point lastPoint;

	bool isJustPressed;
};

PrinterPen.cpp

#include "PrinterPen.h"

PrinterPen::PrinterPen()
{
    lastPoint = {0,0};
    isJustPressed = false;
}

void PrinterPen::onUpdate()
{
    //检测左键是否按下
	if (Input::isDown(MouseCode::Left))
	{
		if (isJustPressed)
		{
            //加入限制条件-------------------------
            if(Input::getMousePos() != _lastPoint)
            {
                //创建Line
			    auto shape = ShapeNode::createLine(lastPoint, Input::getMousePos());
                //设置节点颜色为黑色
	            shape->setStrokeColor(Color::Black);
                //获取当前场景并加入节点
	            SceneManager::getCurrentScene()->addChild(shape);
            }
		}
        //更新数据
		isJustPressed = true;
		lastPoint = Input::getMousePos();
	}
	else
	{
		isJustPressed = false;
	}
}

源.cpp

#include 
using namespace easy2d;

#include "PrinterPen.h"

int main()
{
	if (Game::init("Printer",1200,800))
	{
		//Renderer::showFps();

		auto scene = gcnew Scene;
		SceneManager::enter(scene);

        auto pen = gcnew PrinterPen;
        scene->addChild(pen);

		Game::start();
	}
	Game::destroy();

	return 0;
}

---

投票

你们希望我再出一期简单绘画的博客吗？请投出你手中珍贵的一票。