祁少杰

摘要：隨著現(xiàn)代化教育背景下新型電教設(shè)備的興起以及交互式電子黑板逐漸普及，現(xiàn)有的圖形繪制系統(tǒng)因其依賴輸入設(shè)備、繪制方式煩瑣等問(wèn)題，無(wú)法滿足課堂教學(xué)應(yīng)用場(chǎng)景中存在的諸多需求。為了解決此現(xiàn)狀，開發(fā)基礎(chǔ)教學(xué)圖形繪制系統(tǒng)，從程序設(shè)計(jì)到應(yīng)用開發(fā)的角度闡述此系統(tǒng)的細(xì)節(jié)與創(chuàng)新，改善現(xiàn)代化教學(xué)中圖形教學(xué)的現(xiàn)狀，提升課堂教學(xué)質(zhì)量。

關(guān)鍵詞：現(xiàn)代化教育;電教設(shè)備;交互式電子黑板;圖形繪制;課堂教學(xué)

中圖分類號(hào)：TP311.1;TP399? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2022）12-0007-03

開放科學(xué)（資源服務(wù)）標(biāo)識(shí)碼（OSID）：

1 引言

當(dāng)前，隨著計(jì)算機(jī)網(wǎng)絡(luò)及顯示設(shè)備的快速發(fā)展，交互式電子黑板以其圖文并茂、簡(jiǎn)單易用等優(yōu)點(diǎn)在教育教學(xué)中逐漸被廣泛地應(yīng)用。而圖形繪制作為傳統(tǒng)教學(xué)中不可或缺的一環(huán)，它在電子黑板應(yīng)用中的表現(xiàn)也尤為重要[1-2]。隨著電子黑板的普及以及教師對(duì)于電子黑板應(yīng)用的深入，市場(chǎng)與用戶對(duì)電子黑板繪圖功能也提出來(lái)更多更高的要求。一方面是對(duì)于各類幾何圖形的繪制，如何更加快速精確、節(jié)約時(shí)間，另一方面是如何滿足實(shí)際教學(xué)場(chǎng)景的繪制需求。

一個(gè)符合老師使用習(xí)慣、符合數(shù)學(xué)邏輯、操作簡(jiǎn)便快捷的圖形繪制系統(tǒng)，可以大大減少教師在圖形繪制時(shí)花費(fèi)的時(shí)間，提升板書的整潔程度，大大提升學(xué)生在課堂上知識(shí)接受。

2 系統(tǒng)功能設(shè)計(jì)

2.1 需求分析

1）電子黑板輸入方式單一，圖形繪制僅依靠觸摸筆，為此通過(guò)垂直位移判定和停頓時(shí)間判定，實(shí)現(xiàn)一次落筆繪制。

2）圖形繪制點(diǎn)位刻畫不清，繪制方式單一，不合數(shù)學(xué)邏輯，為此采用多種繪制方式，位置刻畫圖形，特征點(diǎn)控制。

3）教師為多個(gè)班級(jí)教課，教學(xué)內(nèi)容重復(fù)，圖形反復(fù)繪制，為此提供圖形保存與打開功能，一次繪制，反復(fù)使用。

2.2 系統(tǒng)目標(biāo)功能

實(shí)現(xiàn)一款基于位圖的圖形選擇移動(dòng)及多方式繪制的圖形繪制系統(tǒng)，系統(tǒng)功能包含：日常教學(xué)圖形的多種方式的繪制，圖形選擇及移動(dòng)，已繪制圖形的保存，對(duì)已有圖片資源的加載呈現(xiàn)[3]。

3 系統(tǒng)功能實(shí)現(xiàn)

3.1 圖形繪制

圖形繪制作為理科類課程重要的教學(xué)內(nèi)容，如何快速準(zhǔn)確繪制所需圖形是至關(guān)重要的。本節(jié)主要討論日常教學(xué)所涉及圖形的各自的繪制方式及其實(shí)現(xiàn)方案，使圖形繪制過(guò)程合乎數(shù)學(xué)原理、靈活、簡(jiǎn)單快捷，符合教師繪制習(xí)慣;可以繪制出各種比例角度的圖形;圖形美觀、精確，滿足教師的日常圖形教學(xué)[4]。

1）實(shí)時(shí)繪制思路

通過(guò)異或處理，使得同一位置的重復(fù)繪制會(huì)相互抵消，顯示為空。以此為起點(diǎn)，如圖1所示，讓鼠標(biāo)或畫筆的每一次移動(dòng)，都去抵消舊圖，記錄點(diǎn)位，繪制新圖，以此來(lái)達(dá)到實(shí)時(shí)繪制的效果[5]。

通過(guò)實(shí)時(shí)繪制，可以保證教師在繪制過(guò)程中時(shí)刻通過(guò)調(diào)整畫筆來(lái)修改所繪制的圖形，圖形實(shí)時(shí)更新，每一次移動(dòng)，都可以精確地控制圖形的成像，方式簡(jiǎn)單快捷，對(duì)圖形的繪制控制直觀。

2）點(diǎn)位固定方式

傳統(tǒng)的繪制方法例如Word中的形狀繪制和Windows自帶畫圖應(yīng)用中的諸多圖形繪制，均是采用單次點(diǎn)擊加滑動(dòng)的方式，來(lái)實(shí)現(xiàn)使用鼠標(biāo)簡(jiǎn)單繪制圖形的需求。這種繪制方式的優(yōu)點(diǎn)在于繪制圖形簡(jiǎn)單便捷，不需要提前學(xué)習(xí)便可快速上手，對(duì)于對(duì)圖形細(xì)節(jié)、精度要求較低的使用場(chǎng)景而言，較為合適。

而在實(shí)際的教學(xué)應(yīng)用場(chǎng)景中，教師更加希望圖形繪制方式便捷，符合教學(xué)需求，并且繪制出的圖形靈活多樣。而這種需求在缺乏除畫筆之外的輸入設(shè)備的條件下，則對(duì)日常教學(xué)圖形的繪制方式。提出了較高要求。如何在有限且又盡可能少的操作內(nèi)完成繪制，點(diǎn)位的固定方式是必須要討論的問(wèn)題。為此提出了兩種新的點(diǎn)位固定方式。

①垂直位移判定

垂直位移判定方法通過(guò)判定鼠標(biāo)的垂直位移距離，當(dāng)超過(guò)某個(gè)閾值后，即可固定點(diǎn)位與圖形。垂直位移判定方法適用于一些有水平或垂直線段的圖形繪制過(guò)程中，實(shí)現(xiàn)簡(jiǎn)單但應(yīng)用卻極為方便，擴(kuò)展了圖形的繪制思路。

②時(shí)間停頓判定

時(shí)間停頓判定則是通過(guò)停頓的方式來(lái)固定點(diǎn)位，當(dāng)畫筆停頓滿足一定時(shí)間后，即可固定點(diǎn)位，判定流程如圖2所示。時(shí)間停頓的方法突破了垂直位移判定中水平或垂直的限制，使一次落筆所能繪制的圖形更加豐富，搭配垂直位移判定方法，也使圖形的多樣化繪制成為可能。

3）簡(jiǎn)單平面圖形繪制方案

平面圖形繪制是圖形繪制的基礎(chǔ)功能，雖然圖形構(gòu)成簡(jiǎn)單，但日常使用仍有許多需求，這些使用最為頻繁的圖形，往往被人忽略了其繪制方式的多樣性以及在日常教學(xué)中的繪制需求。

以三角形為例，在設(shè)計(jì)過(guò)程中將三角形大致歸為了兩類，一類為三邊中任意一邊平行于橫向坐標(biāo)軸，這類三角形在實(shí)際場(chǎng)景中的使用和出現(xiàn)頻率最高;另一類為任意三角形，它包含第一類三角形。

根據(jù)第一類三角形的一邊平行于橫向坐標(biāo)軸的特性，使用垂直位移判定的方法，以落筆點(diǎn)為平行邊的起始端點(diǎn)，平行移動(dòng)至此邊的另一端點(diǎn)，這個(gè)過(guò)程中圖形以一條直線呈現(xiàn)。而后上下移動(dòng)，使畫筆的垂直位移量超出一定閾值，三角形的第二個(gè)端點(diǎn)被固定，三角形開始呈現(xiàn)，此時(shí)的畫筆控制三角形的最后一個(gè)端點(diǎn)，直至抬筆，圖形固定，三角形繪制成功。如果對(duì)底邊的固定不滿意，可以使畫筆靠近底邊一定范圍內(nèi)，重新確定第二個(gè)端點(diǎn)，或是在此時(shí)抬筆，則直線消失，圖形繪制的痕跡消除，此時(shí)可以快速重新開始繪制。

當(dāng)繪制的三角形要求為任意角度的三角形時(shí)，那么可以采用第二種繪制方式，相較于通過(guò)垂直位移判定來(lái)固定第二個(gè)點(diǎn)位，時(shí)間停頓判定的方法所固定的第二個(gè)點(diǎn)位更加地靈活，通過(guò)在指定位置停頓一段時(shí)間，即可固定第二個(gè)點(diǎn)，打破了第二個(gè)點(diǎn)只能在水平方向上的限制，實(shí)現(xiàn)三角形的任意角度繪制。

4）函數(shù)圖形繪制方案

函數(shù)圖形作為中學(xué)中出現(xiàn)最為頻繁的教學(xué)圖形，也是程序設(shè)計(jì)中的重要一環(huán)。

[C=（yd-ym）1（xm-xd）]? ? ? ? ? ? ? ? ? ? ? ? ? ? ?（1）

指數(shù)函數(shù)的繪制通過(guò)兩點(diǎn)來(lái)確定，分別為指數(shù)函數(shù)的特殊點(diǎn)（0，1）點(diǎn)和函數(shù)上任意一點(diǎn)，對(duì)應(yīng)落筆點(diǎn)[xd]與抬筆點(diǎn)[xm]。根據(jù)繪制過(guò)程中記錄的特征點(diǎn)，為圖形繪制劃分區(qū)域，在區(qū)域內(nèi)通過(guò)橫向坐標(biāo)不斷累加計(jì)數(shù)參數(shù)，將參數(shù)代入函數(shù)公式，實(shí)現(xiàn)計(jì)數(shù)參數(shù)在縱坐標(biāo)上的函數(shù)投影，形成諸多點(diǎn)位，如公式（2）與（3）所示，使相鄰點(diǎn)位相連，此時(shí)圖像由多段線段組成，圖形呈現(xiàn)。隨著點(diǎn)數(shù)的增多，圖像會(huì)逐漸光滑，且連續(xù)性良好。對(duì)于控制點(diǎn)位的選取，時(shí)刻遵循控制點(diǎn)位于函數(shù)圖形上，且與函數(shù)的數(shù)學(xué)特性點(diǎn)相關(guān)聯(lián)。

[xi=xd-β*（xm-xd）+i*（2β+1）*（xm-xd）/α? ? ?0≤i≤α]

（2）

[yi=（xi-xd）|xi-xd|C（xi-xd）+yd]? ? ? ? ? ? ? ? ? ? ? ? ? ? （3）

公式（2）中的均分參數(shù)[α]為繪制時(shí)函數(shù)顯示的分割精度，[α]越大，函數(shù)越光滑，但計(jì)算量也越大，控制參數(shù)[β]為繪制時(shí)畫筆的控制程度和函數(shù)的顯示范圍，[β]越大，代表繪制函數(shù)時(shí)控制的函數(shù)段越小，顯示的函數(shù)越多，[β]越小，則反之。通過(guò)調(diào)整[α]均分參數(shù)和[β]控制參數(shù)，可以達(dá)到最合適的函數(shù)圖形繪制效果。

5）立體圖形繪制方案

立體圖形繪制時(shí)，主要需要解決的問(wèn)題包括為了嚴(yán)格按照一次落筆完成繪制的原則而對(duì)立體圖形繪制時(shí)的繪制方式進(jìn)行探索與設(shè)計(jì);以及同一圖形的不同方向不同階段繪制導(dǎo)致的圖像虛實(shí)線問(wèn)題。

以四棱柱為例，四棱柱第一階段通過(guò)垂直位移判定繪制出平行四邊形，對(duì)應(yīng)四棱柱的底面，第二階段為停頓等待圖形消失，而后任意移動(dòng)確定四棱柱的高度。而虛實(shí)線的判定則需要結(jié)合繪制過(guò)程中點(diǎn)位信息從而對(duì)不同情況做出判定，以此決定點(diǎn)位間的虛實(shí)情況。圖5為實(shí)際的繪制過(guò)程。

3.2 圖形選定

為實(shí)現(xiàn)圖形的移動(dòng)，首先需要解決的問(wèn)題是如何選中圖形，以及通過(guò)怎樣的邏輯來(lái)判定選中。

針對(duì)圖形的選定問(wèn)題，當(dāng)圖形繪制成功后，會(huì)為每個(gè)圖形確定一個(gè)矩形范圍，如圖6所示。這個(gè)范圍會(huì)用最小的矩形面積來(lái)將圖形全部包裹在內(nèi)，如圖6所示。當(dāng)點(diǎn)擊移動(dòng)功能并落筆在圖形的矩形范圍內(nèi)時(shí)，即可選定圖形。這種方式不僅操作簡(jiǎn)單直觀，且所需的計(jì)算與存儲(chǔ)代價(jià)都極小。

3.3 圖形移動(dòng)

圖形移動(dòng)包括了圖形選定、移動(dòng)、數(shù)據(jù)存儲(chǔ)和數(shù)據(jù)更新等一系列的操作，當(dāng)經(jīng)歷了圖形選定后，程序確定了唯一的圖形序號(hào)，這個(gè)序號(hào)指向了在內(nèi)存中存儲(chǔ)的一系列點(diǎn)位。

通過(guò)捕捉鼠標(biāo)的坐標(biāo)輸入，采用記錄落筆點(diǎn)和計(jì)算畫筆移動(dòng)距離，確定了圖形的移動(dòng)距離。將內(nèi)存中的點(diǎn)位信息讀取并與移動(dòng)距離相加，便是此刻圖形的實(shí)際位置。將這些實(shí)際位置輸入到圖形的繪制函數(shù)中，對(duì)應(yīng)不同的點(diǎn)位對(duì)圖形進(jìn)行繪制-抵消-再次繪制的操作，每次鼠標(biāo)的移動(dòng)都是對(duì)數(shù)據(jù)的一次更改，以及對(duì)圖形序號(hào)對(duì)應(yīng)的繪制函數(shù)的一次調(diào)用，直至抬筆瞬間，將更改后的數(shù)據(jù)更新至內(nèi)存，整個(gè)圖形移動(dòng)的過(guò)程結(jié)束。

3.4 數(shù)據(jù)存儲(chǔ)

存儲(chǔ)數(shù)據(jù)的載體，均選用了可變的二維數(shù)組，以最小的內(nèi)存代價(jià)來(lái)實(shí)現(xiàn)對(duì)圖形的存儲(chǔ)。N表示目前已繪制的圖形總數(shù)，當(dāng)新的圖形被繪制時(shí)，數(shù)組大小動(dòng)態(tài)改變，確保內(nèi)存空間的有效利用。

圖8為數(shù)據(jù)存儲(chǔ)結(jié)構(gòu)圖，其中：tuxid[N]用來(lái)標(biāo)記圖形序號(hào)并記錄圖形的繪制順序。tuxcshu1[2，N]至tuxcshu4[2，N]四個(gè)數(shù)組用來(lái)記錄圖形在繪制過(guò)程中生成的關(guān)鍵點(diǎn)位。tuxcshu5[2，N]和tuxcshu6[2，N]兩個(gè)數(shù)組用來(lái)在抬筆時(shí)記錄每個(gè)圖形的最小矩形范圍。tuxcshu7[2，N]數(shù)組用來(lái)為每一個(gè)圖形定義一個(gè)特征點(diǎn)，在圖形移動(dòng)時(shí)的選定判定使用。

3.5 圖形保存與打開

點(diǎn)擊保存文件即可自動(dòng)將繪制好的圖形保存至桌面，點(diǎn)擊打開圖標(biāo)并在文件選擇界面選擇圖片后，通過(guò)在指定位置點(diǎn)擊以確定圖片將要呈現(xiàn)在板面上的中心位置，而后移動(dòng)來(lái)調(diào)整圖片的大小呈現(xiàn)，從而實(shí)現(xiàn)圖片打開功能，以支持的可打開并呈現(xiàn)在板面上的圖片類型包括BMP格式和JPG格式。

通過(guò)對(duì)圖形保存和打開功能的相互配合使用，較為合適地解決了教師在多個(gè)教室反復(fù)繪制相同的問(wèn)題，使教師可以在一次繪制后，多處使用，節(jié)約了教師教學(xué)時(shí)間的同時(shí)，也讓優(yōu)秀教學(xué)資源的分享變得更為方便快捷。

4 結(jié)束語(yǔ)

看似簡(jiǎn)單的基礎(chǔ)教學(xué)圖形繪制系統(tǒng)，要想讓其在新興電教設(shè)備中加以應(yīng)用，真正被教師所使用被學(xué)生所接受，仍然有許多問(wèn)題需要解決。一款實(shí)用性強(qiáng)的教學(xué)圖形繪制系統(tǒng)，在克服傳統(tǒng)黑板繪制圖形煩瑣、耗時(shí)、依賴教具等問(wèn)題的同時(shí)，更加速了交互式電子黑板的推廣與應(yīng)用，推動(dòng)智慧教室建設(shè)以及現(xiàn)代化教學(xué)的腳步。

參考文獻(xiàn)：

[1] 李新宇.課堂教學(xué)中交互白板的應(yīng)用層次分析[J].中國(guó)電化教育，2005（3）：51-54.

[2] 郭娟.數(shù)字圖像在多媒體課件中的應(yīng)用研究[D].濟(jì)南：山東師范大學(xué)，2006.

[3] 張曉東，耿南平，許福東.計(jì)算機(jī)圖形學(xué)與計(jì)算機(jī)繪圖──機(jī)械CAD技術(shù)的理論（方法）與實(shí)踐（二）[J].石油機(jī)械，1997，25（7）：50-53.

[4] 吳敏.交互式電子白板系統(tǒng)軟件的設(shè)計(jì)與實(shí)現(xiàn)[D].武漢：華中師范大學(xué)，2014.

[5] 李俊杰.基于位圖格式圖形繪制和撤銷的方法研究與實(shí)現(xiàn)[D].太原：山西大學(xué)，2020.

【通聯(lián)編輯：謝媛媛】