Use C language EasyX to create dynamic love background

Introduction

In the world of computer graphics, there are many ways to make a program's interface more attractive. In this blog, I will introduce to you how to use the EasyX graphics library to create a dynamic love background in C++. This is not just a simple animated effect, it also includes stars in the background, spinning hearts, and a beautiful background gradient.

Tool introduction: EasyX graphics library

EasyX is an easy-to-use C++ graphics library, especially suitable for beginners and developers who want to quickly add graphics to their applications. It provides a series of functions that can help you draw shapes, set colors and animate effects.

Design goals

Our goal is to create a dynamic heart that rotates in the background. The background will have a gradient from space blue to black, scattered with small stars of various colors.

image display

Start coding

Define the structure of stars

Each star has its coordinates, color and brightness. We use a structto represent:

struct Star {
    int x, y;
    COLORREF color;
    float intensity;
    float intensityChange;
};

3.2 Heart shape drawing function

We use parametric equations to draw the heart shape and add a rotation effect to it:

void DrawHeart(int x, int y, COLORREF color, float scale, float angle) {
    BeginBatchDraw();  // 开始批量绘制
    const int thickness = 2;  // 调整这个值来改变心形的粗细
    for (float t = 0; t < 2 * 3.14159; t += 0.01) {
        float x_cord = scale * (16 * pow(sin(t), 3));
        float y_cord = scale * -(13 * cos(t) - 5 * cos(2 * t) - 2 * cos(3 * t) - cos(4 * t));

        // 旋转
        float rotatedX = x_cord * cos(angle) - y_cord * sin(angle);
        float rotatedY = x_cord * sin(angle) + y_cord * cos(angle);

        for (int dx = -thickness; dx <= thickness; dx++) {
            for (int dy = -thickness; dy <= thickness; dy++) {
                putpixel(x + rotatedX + dx, y + rotatedY + dy, color);
            }
        }
    }
    EndBatchDraw();  // 结束批量绘制，并显示在前台
}

main function logic

In main()the function, we first initialize the EasyX graphics window. Next, we randomly generate a set of stars and store their properties. In the main loop, we draw the background gradient, stars and heart shapes, and achieve the dynamic effect of the heart shape.

Source code sharing

#include <graphics.h>
#include <conio.h>
#include <math.h>
#include <vector>

struct Star {
    int x, y;
    COLORREF color;
    float intensity;
    float intensityChange;
};


// 修改后的心形公式函数
void DrawHeart(int x, int y, COLORREF color, float scale, float angle) {
    BeginBatchDraw();  // 开始批量绘制
    const int thickness = 2;  // 调整这个值来改变心形的粗细
    for (float t = 0; t < 2 * 3.14159; t += 0.01) {
        float x_cord = scale * (16 * pow(sin(t), 3));
        float y_cord = scale * -(13 * cos(t) - 5 * cos(2 * t) - 2 * cos(3 * t) - cos(4 * t));

        // 旋转
        float rotatedX = x_cord * cos(angle) - y_cord * sin(angle);
        float rotatedY = x_cord * sin(angle) + y_cord * cos(angle);

        for (int dx = -thickness; dx <= thickness; dx++) {
            for (int dy = -thickness; dy <= thickness; dy++) {
                putpixel(x + rotatedX + dx, y + rotatedY + dy, color);
            }
        }
    }
    EndBatchDraw();  // 结束批量绘制，并显示在前台
}

int main() {
    // 初始化图形窗口
    initgraph(640, 480);
    setbkcolor(BLACK); // 设置背景色为黑色
    cleardevice();     // 清空屏幕

    // 创建星星
    const int numStars = 100;
    std::vector<Star> stars;
    for (int i = 0; i < numStars; i++) {
        Star star = {
            rand() % 640,
            rand() % 480,
            RGB(rand() % 256, rand() % 256, rand() % 256),
            (rand() % 100) / 100.0f,
            (rand() % 5 + 1) / 500.0f
        };
        stars.push_back(star);
    }

    float scale = 10;
    bool increase = true;
    COLORREF heartColor = RED;
    float angle = 0;
    BeginBatchDraw();  // 开始批量绘制

    while (!_kbhit()) { // 直到有键被按下
        cleardevice(); // 清空屏幕

        // 绘制渐变背景
        for (int i = 0; i < 480; i++) {
            float ratio = (float)i / 480;
            COLORREF bgColor = RGB(0, 0, ratio * 50);
            setlinecolor(bgColor);
            line(0, i, 640, i);
        }

        // 绘制星星
        for (auto& star : stars) {
            star.intensity += star.intensityChange;
            if (star.intensity > 1 || star.intensity < 0.5) {
                star.intensityChange = -star.intensityChange;
            }
            COLORREF modifiedColor = RGB(GetRValue(star.color) * star.intensity, GetGValue(star.color) * star.intensity, GetBValue(star.color) * star.intensity);
            putpixel(star.x, star.y, modifiedColor);
        }

        if (increase) {
            scale += 0.1;
        }
        else {
            scale -= 0.1;
        }

        if (scale > 15 || scale < 10) {
            increase = !increase;
        }

        // 改变心的颜色
        int r = GetRValue(heartColor);
        int g = GetGValue(heartColor);
        int b = GetBValue(heartColor);
        r = (r + 1) % 256;
        g = (g + 2) % 256;
        b = (b + 3) % 256;
        heartColor = RGB(r, g, b);

        DrawHeart(320, 240, heartColor, scale, angle);
        angle += 0.005; // 调整这个值来改变旋转速度

        Sleep(10);
        EndBatchDraw();  // 结束批量绘制，并显示在前台
    }
   
    closegraph();
    return 0;
}

result

When you run the above code, you will see a beautiful dynamic background with a spinning heart and a bunch of twinkling stars. By adjusting parameters, you can easily change the speed, color, and other properties of your animation.

Reference resources :