Coding & Programming/C, C++, SFML

[C/C++, SFML] 사이먼 게임(Simon Game) 만들기(Build a Simon Game)

mainCodes 2021. 4. 6. 10:02

안녕하세요 JollyTree입니다 (•̀ᴗ•́)و

 

오늘 주제는 그동안 SFML 관련 자료를 포스팅한 기본윈도우 출력, 타이머 구현, 캐릭터 및 배경 이미지, 폰트 출력 등의 내용들을 일부 종합 정리하고 처음 연재 시작할 때 계획했던 사이먼 게임의 개발 과정을 소개하려고 합니다.

 

게임이라고 할 정도로 거창하진 않고요. 3월 24일날 처음 SFML에 대한 연재를 시작하면서 사이먼 게임을 말씀드린 내용이 있어 정리하고자 합니다.

 

mainCodes's 사이먼 게임

사이먼 게임은 1978년 처음 세계에 알려진 이래 지금까지 판매되고 있는 정말 오랜된 게임으로 초창기 버전은  전자기기 형태로 출시되었다고 합니다. 70년대와 80년대는 대중 문화의 상징일 정도였다고 하니 정말 대단했던것 같습니다. 알고리즘 구현에 사용된 언어는 어셈블리어였으며 코드 대부분은 Charle Kapps란 분이 개발하였습니다.

 

검색 해보니 사이먼 게임 기기가 아직도 국내 인터넷 마켓에서 판매하고 있네요 ^^ 자세한 히스토리와 게임방법, 클론 들은 위키를 참고하세요. Wikipedia : Simon Game

 

게임 방법은 컴퓨터가 깜빡인 색 순서를 그대로 눌러주면 되는 정도로 아주 간단합니다.  다만 제일 처음에는 한 가지 색을 깜빡이지만 점점 많은 색을 깜빡이니 잘 기억했다가 컴퓨터가 깜빡인 색 순서대로 클릭을 해야합니다.

 

먼저 프로그램은 리소스 파일(이미지, 폰트)을 파일로 부터 읽고, 게임의 핵심이 되는 2x2 격자(배열)를 메모리에 그립니다. 해당 변수는 color_grid이구요. 2차원 배열을 이용하여 각 행열에 따라 컬러에 번호(0~3)를 지정합니다. 

 

■ 메인 화면과 2 x 2 격자 구성

 

    for (int i = 0; i < 2; i++)
    {
        for (int j = 0; j < 2; j++)
        {
            sprite_off[n].setTexture(tex_color_off);
            sprite_off[n].setTextureRect(IntRect(j * KEYPAD_BTN_WIDTH, i * KEYPAD_BTN_HEIGHT, 
                KEYPAD_BTN_WIDTH, KEYPAD_BTN_HEIGHT));
            color_grid[i][j] = n;

            sprite_on[n].setTexture(tex_color_on);
            sprite_on[n].setTextureRect(IntRect(j * KEYPAD_BTN_WIDTH, i * KEYPAD_BTN_HEIGHT, 
                KEYPAD_BTN_WIDTH, KEYPAD_BTN_HEIGHT));
            n++;
        }
    }

 

■ color_grid 인덱스에 따른 n 값 구성

 

빨간색은 n이 0, 녹색은 n의 값이 1, 파란색은 2, 노란색은 3에 해당됩니다. 전체 504 x 504의 화면 크기에서 현재 클릭한 마우스의 x, y 좌표를 구한 뒤 252로 나누어 배열의 인덱스를 통해 현재 저장된 n의 값을 구합니다.

 

     Vector2i pos = Mouse::getPosition(app);
     x = (pos.y - KEYPAD_START_Y) / KEYPAD_BTN_HEIGHT;
     y = (pos.x - KEYPAD_START_X) / KEYPAD_BTN_WIDTH;
     n =  color_grid[x][y] ;

타이머는 게임 시작 시간, 색의 깜박임 시간, 이미지 로테이션 시간 등에 사용하였고 그 외는 소소코드는 랜덤 번호 생성과 생성된 랜덤번호의 검사 코드 정도가 포함되어 있어 이해하는데 어려움은 없을 것 같습니다. 그래서 특별한 설명 없이 바로 전체 소스코드를 올립니다. 

 

■ 사이먼 게임 전체 소스코드(Example):

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
#include <SFML/Graphics.hpp>
#include <iostream>
#include <time.h>
 
using namespace std;
using namespace sf;
 
#define KEYPAD_START_X          0
#define KEYPAD_START_Y          0
#define TEXT_MSG_X              180.f
#define TEXT_MSG_Y              200.f
#define KEYPAD_BTN_WIDTH        252
#define KEYPAD_BTN_HEIGHT       252
 
string com_numbers = "";
int level = 1;
 
//Generate random number
int generate_random_number()
{
    com_numbers.clear();
    srand((unsigned int)time(NULL));
    for (int i = 0; i < level; i++
        com_numbers += to_string(rand() % 4);
 
#if 0
    cout << "-----------------------------------------" << endl;
    cout << "[ COM]Level:" << level << " Random Number:" << comNumbers << endl;
    cout << "-----------------------------------------" << endl;
#endif
 
    return 0;
}
 
// function for display text
int print_text(Text& textMsg, Font& font, int size,
    float x, float y, const Color& color, const Color& outColor, string p)
{
    textMsg.setFont(font);
    textMsg.setCharacterSize(size);
    textMsg.setPosition(x, y);
    textMsg.setFillColor(color);
    textMsg.setOutlineColor(outColor);
    textMsg.setString(p);
 
    return 0;
}
 
int main()
{
    Texture tex_color_off, tex_color_on;
    Sprite sprite_off[5], sprite_on[5], sprite_start_logo;
    Font font_level, font_message;
    Text text_level, text_message;
 
    string input_numbers = "";
    int levelLoop = 0;
 
    int x = 0, y = 0, n = 0;
    int color_grid[2][2= { 0 };
    int xx=0, yy=0;
 
    Clock clock;
 
    float number_order = 0, delay_number_order = 1.5;  //inerval for show each color
    float game_start = 0, delay_game_start = 3.0;      //wait for game start
    float ready = 0, delay_ready = 2.0;                //Show "Ready, Go" message for 2 seconds
    float rotate_time = 0;
 
    string level_string = "Level : " + to_string(level);
    string message_string = "Ready, Go!";
    bool isgamestart = false;
    int index = 0;
 
    RenderWindow app(VideoMode(504504), "Remember It - https://maincodes.tistory.com/");
    app.setFramerateLimit(60);
 
    //Load resources from files
    if (tex_color_off.loadFromFile("resources/colors_off.png"== false)
    {
        cout << "loadFromeFile err" << endl;
        return -1;
    }
 
    if (tex_color_on.loadFromFile("resources/colors_on.png"== false)
    {
        cout << "loadFromeFile err" << endl;
        return -1;
    }
 
 
    if(font_level.loadFromFile("resources/BinggraeMelona.ttf"== false)
    {
        cout << "loadFromeFile err" << endl;
        return -1;
    }
 
    if(font_message.loadFromFile("resources/DS-DIGIB.ttf"== false)
    {
        cout << "loadFromeFile err" << endl;
        return -1;
    }
 
    //Set logo
    sprite_start_logo.setTexture(tex_color_off);
    sprite_start_logo.setOrigin(sf::Vector2f(tex_color_off.getSize()) / 2.f);
    sprite_start_logo.setPosition(sprite_start_logo.getOrigin());
 
 
    print_text(text_level, font_level, 3010.f, 10.f,
        Color::White, Color::White, level_string);
    print_text(text_message, font_message, 30, TEXT_MSG_X, TEXT_MSG_Y,
        Color::White, Color::White, message_string);
 
     //Init. Color pad & Color grid
    for (int i = 0; i < 2; i++)
    {
        for (int j = 0; j < 2; j++)
        {
            sprite_off[n].setTexture(tex_color_off);
            sprite_off[n].setTextureRect(IntRect(j * KEYPAD_BTN_WIDTH, i * KEYPAD_BTN_HEIGHT, 
                KEYPAD_BTN_WIDTH, KEYPAD_BTN_HEIGHT));
            color_grid[i][j] = n;
 
            sprite_on[n].setTexture(tex_color_on);
            sprite_on[n].setTextureRect(IntRect(j * KEYPAD_BTN_WIDTH, i * KEYPAD_BTN_HEIGHT, 
                KEYPAD_BTN_WIDTH, KEYPAD_BTN_HEIGHT));
            n++;
        }
    }
 
    generate_random_number();
 
    while (app.isOpen())
    {
        float time = clock.getElapsedTime().asSeconds();
        clock.restart();
        number_order += time;
        game_start += time;
        ready += time;
        rotate_time += time;
 
        Event event;
 
        while (app.pollEvent(event)) {
            if (event.type == Event::EventType::Closed)
                app.close();
        }
 
        if (event.type == Event::MouseButtonPressed)
        {
            if (event.key.code == Mouse::Left)
            {
                if (isgamestart == true)
                {
                    Vector2i pos = Mouse::getPosition(app);
                    x = (pos.y - KEYPAD_START_Y) / KEYPAD_BTN_HEIGHT;
                    y = (pos.x - KEYPAD_START_X) / KEYPAD_BTN_WIDTH;
                    n = color_grid[x][y];
                    cout << "[USER]Pressed:: x=" << y << " y = " << x << " n=" << n << endl;
 
                    //Save input numbers
                    if (input_numbers.length() < level)
                        input_numbers += to_string(n);
 
                    //Pressed effect
                    for (int i = 0; i < 10; i++) {
                        sprite_on[n].setPosition(
                            (float)((y)*KEYPAD_BTN_WIDTH) + KEYPAD_START_X,
                            (float)KEYPAD_START_Y + ((x)*KEYPAD_BTN_HEIGHT));
 
                        app.draw(sprite_on[n]);
                        app.display();
                    }
                }
            }
            else  //Pressed Mouse right button
                isgamestart = true;
        }
 
        if (input_numbers.length() == level)
        { 
            if (com_numbers == input_numbers)
            {
                input_numbers.clear();
                level++;
 
                level_string = "Level : " + to_string(level) + " | Correct :)";
                print_text(text_level, font_level, 3010.f, 10.f,
                    Color::White, Color::White, level_string);
            }
            else {
                level_string = "Level : " + to_string(level) + " | Wrong :(";
                print_text(text_level, font_level, 3010.f, 10.f,
                    Color::White, Color::White, level_string);
 
                input_numbers.clear();
            }
 
            generate_random_number();
 
            game_start = 0;
            levelLoop = 0;
            clock.restart();
            number_order += time;
        }
 
        app.clear(Color::White);
 
        if (isgamestart == false)
        {
            sprite_start_logo.setRotation(rotate_time * 100);
            app.draw(sprite_start_logo);
 
            level_string = "Press Mouse Right button to start.";
            print_text(text_message, font_message, 3010.f, TEXT_MSG_Y,
                Color::White, Color::White, level_string);
 
            game_start = 0;  
            number_order = 0;
        }
        else {
            //draw color grid
            for (int i = 0; i < 2; i++) {
                for (int j = 0; j < 2; j++) {
                    int n = color_grid[i][j];
                    sprite_off[n].setPosition(
                        (float)j * KEYPAD_BTN_WIDTH + KEYPAD_START_X,
                        (float)KEYPAD_START_Y + (i * KEYPAD_BTN_HEIGHT));
                    app.draw(sprite_off[n]);
                }
            }
 
            //Remove "Ready, Go ! message after 2 seconds
            if (ready > delay_ready) {
                print_text(text_message, font_message, 30, TEXT_MSG_X, TEXT_MSG_Y,
                    Color::White, Color::White, "");
            }
 
            //Game Start after 3.0 seconds
            if (game_start > delay_game_start)  
            {
                //Show the sprite_on image every 1 second each color
                if (number_order > delay_number_order)
                {
                    if (levelLoop < level)
                    {
                        index = (com_numbers.at(levelLoop)) - '0';
                        cout << "[ COM]Pressed idx = " << index << endl;
                        switch (index)
                        {
                            case 0:  xx = 0; yy = 0;  break;
                            case 1:  xx = 1; yy = 0;  break;
                            case 2:  xx = 0; yy = 1;  break;
                            case 3:  xx = 1; yy = 1;  break;
                        }
 
                        //Press effect
                        for (int i = 0; i < 15; i++)
                        {
                            sprite_on[index].setPosition(
                                (float)((xx)*KEYPAD_BTN_WIDTH) + KEYPAD_START_X,
                                (float)KEYPAD_START_Y + ((yy)*KEYPAD_BTN_HEIGHT));
                            app.draw(sprite_on[index]);
                            app.display();
                        }
 
                        levelLoop++;
                    }
                    number_order = 0;
                }
            }
        }
        app.draw(text_level);
        app.draw(text_message);
        app.display();
    }
 
    return 0;
}
 
cs

 

실행결과(Output):

 

 

사이버 게임 소스코드에 사용된 기본 윈도우 출력, 마우스, 이미지 처리, 개체 충돌 등, SFML에 대한 기본 설명과 예제는 여기 mainCodes 블로그에 설명되어 있으니 참고하세요. 

 

[C/C++, SFML] 1. SFML 프로그래밍 시작

[C/C++, SFML] 2. SFML 라이브러리 소개 및 Visual Studio 2019 설정

[C/C++, SFML] 3. 기본 윈도우(RenderWindow) 출력하기

[C/C++, SFML] 4. 타이머(Timer) 구현하기

[C/C++, SFML] 5. 캐릭터, 배경 등 이미지(Texture, Sprite) 출력하기

[C/C++, SFML] 6. 폰트(font) 파일 읽고 화면에 출력하기(Font, Text)

[C/C++, SFML] 7. 오디오(음악, 효과음) 파일 읽고 재생하기(SoundBuffer, Sound)

[C/C++, SFML] 8. 마우스 이벤트(Event) 및 상태(State) 처리하기

[C/C++, SFML] 9. 엔티티(Sprite, Text, Share 등) 위치, 로테이션, 스케일 등 모양 바꾸기

[C/C++, SFML] 10. 키보드 이벤트(Event) 및 상태(State) 처리하기

[C/C++, SFML] 11. 개체(Shape, Sprite) 충돌(Collision) 감지하기



상 JollyTree였습니다 (•̀ᴗ•́)و