C++代碼訓練營 | 經(jīng)典繪圖工具EasyX

EasyX簡介

EasyX

在學習C語言時,很多同學抱怨說C只能寫最簡單的Demo程序,通過printf在屏幕上打印字符來驗證代碼。這樣的編程很枯燥,一點沒覺得自己在設計軟件。

EasyX是針對C++的第三方圖形庫,通過它我們能夠在屏幕上繪制出自己喜歡的各種顏色的圖形。有了它,自己編寫好玩的小游戲不是夢哦。

使用EasyX有下面幾點要求:

  • 只能在Windows下使用
  • 建議使用Visual Studio作為IDE
  • 必須寫C++代碼(文件后綴名為cpp)

EasyX安裝

下載路徑

download

安裝

解壓下載目錄 EasyX_20151015(beta).zip 如下:

雙擊 setup.hta 文件

找到需要的VS版本點擊安裝即可。

PS:在解壓縮的文件中,有個EasyX_help.chm文件,它是EasyX的文檔,所有API的介紹都在里面。

作為一個軟件開發(fā)人員,閱讀文檔是最基本的技能,希望大家從現(xiàn)在開始培養(yǎng)自己這方面的能力。如果你通讀了這個文檔之后,相信你完全能夠自己完成在屏幕上畫出自己想要的圖案。

EasyX基本API

在EasyX的文檔中,有一節(jié)是“超簡單的使用預覽”,里面有這樣一段代碼。

#include <iostream>
#include <graphics.h>
#include <conio.h>

void main()
{
    initgraph(640, 480);   // 創(chuàng)建圖形界面
    circle(200, 200, 100); // 畫圓,圓心(200, 200),半徑 100
    getch();               // 按任意鍵繼續(xù)
    closegraph();          // 關(guān)閉圖形界面
}

這段代碼的執(zhí)行結(jié)果如下:

這個Demo程序?qū)崿F(xiàn)了在屏幕上畫一個圓形的功能。

1. 畫布的創(chuàng)建和銷毀

main函數(shù)中,第一行和最后一行代碼是創(chuàng)建和刪除圖形界面,這個圖形界面常常被叫做“畫布”。

  • initgraph()

創(chuàng)建畫布時,需要輸入目標窗口的長寬值。

  • closegraph()

和C語言中一樣,C++也強調(diào)代碼的對稱性,申請資源和釋放資源的代碼總是成對出現(xiàn)的。

2. 坐標系

在 EasyX 中,坐標分為:邏輯坐標和物理坐標。

我們這里只介紹邏輯坐標。

邏輯坐標是在程序中用于繪圖的坐標體系。

坐標默認的原點在屏幕的左上角,X 軸向右為正,Y 軸向下為正,度量單位是象素。

坐標的原點,方向和單位都可以通過特定函數(shù)修改。我們一般只采用默認設置。

3. 圓形繪制

circle這個函數(shù)用于畫圓。

void circle(
    int x,
    int y,
    int radius
);

參數(shù):

  • x
    圓的圓心 x 坐標。
  • y
    圓的圓心 y 坐標。
  • radius
    圓的半徑。

Demo程序中就是用這個函數(shù)繪制了一個圓心為(200, 200),半徑為100的圓形。

4. 直線繪制

這個函數(shù)用于畫線。還可以用 linerel 和 lineto 畫線。

void line(
    int x1,
    int y1,
    int x2,
    int y2
);

參數(shù)

  • x1
    線的起始點的 x 坐標。

  • y1
    線的起始點的 y 坐標。

  • x2
    線的終止點的 x 坐標。

  • y2
    線的終止點的 y 坐標。

5. 矩形繪制

這個函數(shù)用于畫空心矩形。

void rectangle(
    int left,
    int top,
    int right,
    int bottom
);

參數(shù)

  • left
    矩形左部 x 坐標。

  • top
    矩形上部 y 坐標。

  • right
    矩形右部 x 坐標。

  • bottom
    矩形下部 y 坐標。

6. 橢圓繪制

這個函數(shù)用于畫橢圓。

void ellipse(
    int left,
    int top,
    int right,
    int bottom
);

參數(shù)

  • left
    橢圓外切矩形的左上角 x 坐標。

  • top
    橢圓外切矩形的左上角 y 坐標。

  • right
    橢圓外切矩形的右下角 x 坐標。

  • bottom
    橢圓外切矩形的右下角 y 坐標。

上面是幾個基本圖形的繪制方法,它們有個特點是畫出的都是空心的圖形。與之對應的是一組繪制帶有填充顏色圖形的接口。

fillcircle(), fillellipse(), fillrectangle()

它們的參數(shù)和畫空心的接口完全一樣,只不過使用前需要調(diào)用下面這個接口設置填充顏色。

setfillcolor()

下面我們來看看這些函數(shù)究竟能做什么。

EasyX實戰(zhàn)

上面這幅圖就是用EasyX實現(xiàn)的。哈哈,貌似有點丑, 不過假如你能獨立寫出這個功能,說明你已經(jīng)基本掌握了EasyX的用法。

提供一個代碼框架:

#include <iostream>
#include <graphics.h>

void main()
{
    initgraph(800, 600);

    // Add your code

    closegraph(); 
} 

這里請先自己思考一下,不要急往下看。

(... 15分鐘過去了 ...)

分析

這幅圖主要是由圓形、橢圓形、矩形和直線組成的,這幾個形狀的API我們都已經(jīng)介紹過了。我們只要按順序把它們畫在屏幕上就好了。

代碼實現(xiàn)

在C++工程的main.cpp文件中輸入下面代碼。

#include <iostream>
#include <graphics.h>
#include <conio.h>

void main()
{
    initgraph(800, 600);

    // 記錄當前填充顏色
    COLORREF save_color = getfillcolor();

    // 繪制矩形框
    rectangle(50, 50, 550, 550);

    // 畫空心圓
    circle(200, 150, 50);
    circle(400, 150, 50);
    
    // 畫空心橢圓    
    ellipse(100, 100, 500, 300);
    
    // 填充橢圓內(nèi)的綠色部分
    setfillcolor(GREEN);
    floodfill(300, 200, getlinecolor());
    
    // 填充一個白色的橢圓
    setfillcolor(WHITE);
    fillellipse(200, 210, 400, 290);

    // 填充一個綠色的矩形
    setfillcolor(GREEN);
    fillrectangle(150, 300, 450, 500);

    // 畫一條直線
    line(300, 500, 300, 550);

    // 按任意鍵繼續(xù)
    getch();

    // 恢復填充顏色
    setfillcolor(save_color);

    closegraph(); 
} 

好了,按一下Ctrl + F5,是不是看到效果了?

對大多數(shù)人來說,橢圓內(nèi)部的不規(guī)則的綠色面積應該是最難實現(xiàn)的,floodfill()這個函數(shù)就是幫助我們將一個點所在的封閉范圍內(nèi)全部用填充顏色涂掉。除了設置點坐標之外還要輸入這個封閉區(qū)域邊框的顏色。

這里需要強調(diào)的是,在初始化畫布之后,我們獲取了當前的填充顏色,在繪制完成后又把當前填充顏色恢復到了我們程序執(zhí)行之前的狀態(tài)。

這個習慣非常重要,就是要讓我們的程序在運行過之后,系統(tǒng)環(huán)境沒有任何變化。否則在未來負責的工程中,很可能因為某個模塊亂改系統(tǒng)設置產(chǎn)生很多不必要的bug。

好了,現(xiàn)在是不是比較有成就感呢?

由于EasyX的使用會貫穿于我們這個系列的項目中,因此這里就不過多介紹了,后面用到了新內(nèi)容我們再講。

如果,你對某個函數(shù)的用法還不是很了解,那么 “快去看文檔 ... 去看文檔 ... 看文檔 ... 文檔 ...”

我是天花板,讓我們一起在軟件開發(fā)中自我迭代。
如有任何問題,歡迎與我聯(lián)系。


上一篇:C++代碼訓練營 | 鳥槍終于換炮了
下一篇:C++代碼訓練營 | 繪制星空

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,327評論 6 537
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 98,996評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,316評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,406評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,128評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 55,524評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,576評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 42,759評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,310評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 41,065評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,249評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,821評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,479評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,909評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,140評論 1 290
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,984評論 3 395
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,228評論 2 375

推薦閱讀更多精彩內(nèi)容