遊戲內容:
本遊戲是採取九宮格方式的運算式子,此遊戲為了降低難度僅採用乘法和加法觀念,玩家需要從遊戲中題目的6個答案去完整式子,各有3行和3列,其中會有2格為提示,玩家需要繼續完成其他7格,每格數字皆為1到9的數字,運算只能以直和橫的方式,不以斜的列為考慮!
程式功能分析:
設計一個遊戲,有3行3列共6個式子,式子中需填滿2個提示之外的其他7個空格。一開始按New Game可以啟動遊戲,按Finish檢查答案是否正確,按Answer就會將答案顯現,最後按New遊戲的按鈕重新開始新的題目。
開發步驟:
步驟五:到視窗左側的元件面板(Palette)中,點選使用者介面(User Interface)中的標籤(Label)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,總共新增7個,接著依序將名稱改為X1、Symbol1、X2、Symbol2、X3、Symbol3、ANS1,X為答案提示,Symbol為運算符號,ANS為運算答案,以X1為例,點選屬性(Properties)中的字型大小(FontSize)屬性改為20, Text 屬性,將方框中預設的文字清除,可見度(Visible)改為hidden,寬度(Width)高度(Height)各改為40pixels,X的屬性皆與X1相同。

步驟六:以Symbol1為例,點選屬性(Properties)中的字型大小(FontSize)屬性改為40,Text屬性,將方框中預設的文字清除,改為+,寬度(Width)高度(Height)個改為40pixels,Symbol的屬性皆與Symbol1相同,Symbol2、Symbol3的Text屬性依序改為×和=。 
步驟七:以ANS1為例,點選屬性(Properties)中的字型大小(FontSize)屬性改為25,Text屬性,將方框中預設的文字清除,寬度(Width)高度(Height)個改為40pixels,ANS的屬性皆與ANS1相同。
步驟八:到視窗左側的元件面板(Palette)中,點選使用者介面(User
Interface)中的文本框(TextBox)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,以TextBox1為例,點選屬性(Properties)中的字型大小(FontSize)屬性改為25,將Hint屬性的方框中預設文字清除,寬度(Width)高度(Height)各改為40pixels,TextBox的屬性皆與TextBox1相同。
步驟九:重複步驟四,接著再到視窗左側的元件面板(Palette)中,點選使用者介面(User
Interface)中的標籤(Label)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,總共新增6個,接著依序將名稱改為Symbol4、black1、Symbol5、black2、Symbol6、Label1,重複步驟六,但為了版面對齊,其中Label1的寬度(Width)改為80,Symbol的屬性皆與Symbol1相同,Symbol4、Symbol5、Symbol6的Text屬性依序改為+、×和+。
以black1為例,找到屬性(Properties)中的背景顏色(BackgroundColor)屬性改為黑色(Black),再將Text屬性方框中預設的文字清除,最後寬度(Width)高度(Height)各改為40pixels,black的屬性皆與black1相同。
步驟十:重複步驟四到步驟八,接著依序將名稱改為X4、Symbol7、X5、Textbox4、Symbol8、X6、Textbox5、Symbol9、ANS2,而Symbol7、Symbol8、Symbol9的Text依序改為+、+、= ,其中再到X4點選屬性(Properties)中的可見度(Visible)改為showing,這裡我們設定X4和X8為題目提示。

步驟十一:重複步驟九,接著依序將名稱改為Symbol10、black3、Symbol11、black4、Symbol12、Label2,重複步驟六,Symbol的屬性皆與Symbol1相同,Symbol10、Symbol11、Symbol12的Text屬性依序改為×、+和×。
步驟十二:重複步驟四到步驟八,接著依序將名稱改為X7、Textbox6、Symbol13、X8、Symbol14、X9、Textbox7、Symbol15、ANS3,而Symbol13、Symbol14、Symbol15的Text依序改為×、+、= ,其中再到X8點選屬性(Properties)中的可見度(Visible)改為showing,這裡我們設定X4和X8為題目提示。
步驟十三:到視窗左側的元件面板(Palette)中,點選使用者介面(UserInterface)中的標籤(Label)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,總共新增6個,接著依序將名稱改為Symbol16、
Label3、Symbol17、Label4、Symbol18、Label5,Symbol的屬性皆與Symbol1相同,其中Label3、Label4的寬度(Width)高度(Height)各改為40pixels,但Label5的寬度(Width)請改為80pixels。

步驟十四:到視窗左側的元件面板(Palette)中,點選使用者介面(UserInterface)中的標籤(Label)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,總共新增6個,接著依序將名稱改為ANS4、
Label6、ANS5、Label7、ANS6、Label8,ANS的屬性皆與ANS1相同,其中Label6、Label7的寬度(Width)高度(Height)各改為40pixels,但Label8的寬度(Width)請改為80pixels。
步驟十五::到視窗左側的元件面板(Palette)中,點選使用者介面(User Interface)中的按鈕(Button)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,點選組件(Components),將Button名稱改為Finish,接著找到屬性(Properties)中的背景顏色(BackgroundColor)屬性改為自己喜歡的顏色,範例以黑色為例,再依序找字型大小(FontSize)屬性改為30, Text 屬性,將方框中預設的文字改為Finish,最後找到字型校準(TextAlignment)屬性改為center。
步驟十六:到視窗左側的元件面板(Palette)中,點選使用者介面(User Interface)中的標籤(Label)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,將名稱改為result,作為當按下Finish後顯示玩家是否答對,最後字型大小(FontSize)屬性改為30。
步驟十七::到視窗左側的元件面板(Palette)中,點選使用者介面(User Interface)中的按鈕(Button)元件,按住滑鼠不放將其拖曳至預覽(Viewer)中,點選組件(Components),將Button名稱改為Answer,接著找到屬性(Properties)中的背景顏色(BackgroundColor)屬性改為自己喜歡的顏色,範例以黑色為例,再依序找字型大小(FontSize)屬性改為30, Text 屬性,將方框中預設的文字改為Answer,最後找到字型校準(TextAlignment)屬性改為center。
恭喜你,我們終於將版面設計完成囉!現在就開始程式的部分吧!
步驟十八:請在左側Blocks選單中點選new_game,在彈出的拼圖式程式區塊中選取when new_game Click do。
步驟十九:請在左側Blocks選單中點選X1,在彈出的拼圖式程式區塊中選取set X1.Visible to
步驟十九:請在左側Blocks選單中點選X1,在彈出的拼圖式程式區塊中選取set X1.Visible to
然後再到logic中選取false接在後面,再複製6個,將名稱分別改為X2、X3、X5、X6、X7、X9。
解釋:一開始我們必須讓標準答案先隱藏。
步驟二十:請在左側Blocks選單中點選TextBox1,在彈出的拼圖式程式區塊中選取setTextBox1.Visible to 然後再到logic中選取true接在後面,再複製6個,將名稱分別改為TextBox2、TextBox3、TextBox4、TextBox5、TextBox6、TextBox7
其中再點選X4,在彈出的拼圖式程式區塊中選取set X4.Text to移至TextBox3的下方,再點選text的 " "接在後方, 最後點選X8,在彈出的拼圖式程式區塊中選取set X8.Text to移至TextBox6的下方,再點選text的 " "接在後方。
解釋:我們讓空格顯現,讓玩家可以輸入。
步驟二十一:請在左側Blocks選單中點選RESULT,在彈出的拼圖式程式區塊中選取set RESULT.Text to 然後再點選Text的 " "接在後方,再複製7個,將名稱分別改為TextBox1、TextBox2、TextBox3、TextBox4、TextBox5、TextBox6、TextBox7。
步驟二十二:請在左側Blocks選單中點選control,在彈出的拼圖式程式區塊中選取for each number from,將數字依序改為1、9、1
步驟二十三:請在左側Blocks選單中點選TextBox1,在彈出的拼圖式程式區塊中選取set TextBox1.Text to,再複製8個,將名稱分別改為TextBox2、TextBox3、TextBox4、TextBox5、TextBox6、TextBox7、TextBox8、TextBox9,然後在左側Blocks選單中點選Math,在彈出的拼圖式程式區塊中選取random integer from 1 to 100,將100改為9,再複製8個接到set TextBox1.Text to後方,如下圖所示。
解釋:我們讓每格的數字只有個位數,同學可依自己喜歡更改數字。
步驟二十四:請在左側Blocks選單中點選ANS1,在彈出的拼圖式程式區塊中選取set ANS1.Text to 再複製5個,名稱分別為ANS2、ANS3、ANS4、ANS5、ANS6,依照先前版面配置的運算完成,如下圖紅線處。
步驟二十五:請在Blocks選單中點選Finish,在彈出的拼圖式程式區塊中選取when Finish Click do,再到Control選取if then至於其中,最後必須讓你輸入的數字(TextBox)和本來提示(X)等於答案,再依序放入再and的空格中。
步驟二十六:請在Blocks選單中點選RESULT在彈出的拼圖式程式區塊中選取set RESULT.Text to,再到Text點選" ",若答案相符顯示Congratulations! Got it,若答案不符程式則顯示Sorry! You are wrong。

步驟二十七:請在Blocks選單中點選Answer,在彈出的拼圖式程式區塊中選取when Answer Click do,請在左側Blocks選單中點選TextBox1,在彈出的拼圖式程式區塊中選取setTextBox1.Visible to ,將名稱分別改為TextBox2、TextBox3、TextBox4、TextBox5、TextBox6、TextBox7,然後再到logic中選取false接在後面,最後請點選X1,在彈出的拼圖式程式區塊中選取set X1.Visible to ,然後再到logic中選取true接在後面,再複製6個,將名稱分別改為X2、X3、X4、X5、X6、X7、X8、X9。
恭喜完成此次範例程式!
能和您要source code参考嗎?
回覆刪除感謝!
Ted
ted9921@kpvs.tp.edu.tw
感謝Roger Yen提供source code,我們的課程網站已連結至貴站:
回覆刪除Ted's Bu BU(泰布布)
https://sites.google.com/site/lct4246/home/courses/ai2
作者已經移除這則留言。
回覆刪除