2017年2月14日 星期二

小狐仙Unity教室 三、拖移物件與輸入輸出數字

第三課來學習使用拖移物件來連結程式碼,並且最後完成數字輸入與輸出加法運算。

在教學前各位小貓咪們請下載:第三課所需資源吧



 資源匯入

 在下載完以後,請開啟"教學第三課.unitypackage",此時會開啟Unity專案管理頁面,小貓咪們可以選擇使用上一課開啟的專案,或是在NEW一個新專案都可以,選擇好以後,會進入Unity,並且選擇Import。

匯入

表示您曾經匯入了


成功匯入以後,請在左下角點兩下場景,會開啟此次教學布局。

新增空物件並且拖移程式碼


在物件階層列表空白處右鍵,選擇Create Empty,創造空物件GameObject。

 接下來用滑鼠拖移CuteFox001到空物件的檢視列表下方,即可新增此程式碼組件。

如果不用拖移的話可以再選擇 GameObject以後,右方檢視列表按下Add Component,並且輸入CuteFox001可找到此程式碼組件。

展開Canvas並新增InputField

一樣在物件列表空白處右鍵選擇UI->InputField。

然後我們展開Canvas裡面所有選項,把 Canvas裡面有箭頭的都點一下,就會展開囉!

 新增InputField瞬間,是否發現Game畫面多出了一個輸入框呢?

是的InputField是Unity內建預設的輸入框,各位可以再點選InputField後,右上角更改此物件的名字。

InputField子物件分別有兩個Placeholder、Text:

 Placeholder是在未輸入資料時候提供"Enter text..."此內容的提示訊息。

 Text就是存放等一下我們需要擷取的輸入來源,未輸入都是空白。

粉紅框可以看到此輸入框的座標,請小貓咪們試著改改位置吧~

如果要新增更多顯示的話,請用下圖:


 記得XD要在最下方空白處新增唷,不然會變成別人子物件

拖移 InputField子物件Text與顯示物件到CuteFox001


為了讓程式碼能操作到遊戲物件,請各位小貓咪們按照圖片使用滑鼠抓取物件拖移到正確位置 吧!

(記得先選取空物件GameObject,右邊才會出現唷)

程式碼基礎教學

點開左下角專案的程式碼 CuteFox001,會開啟VS2015編輯器。

 打開以後,發現程式碼好複雜~但是各位小貓咪別怕XD

現在教各位如何"看"程式碼。

區塊

程式碼其實是蘊含一些規則的,最基本是由上往下執行,由左到右計算,有等號時候由右邊給左邊,計算時有括號優先處理。

再來是程式碼的組成最基本類別等於變數加涵式。

變數:你可以想成是一資源或是儲存空間。

涵式:是一種處理方法,給予他變數並呼叫他,他會依照撰寫的規則去處理該變數。

下圖來介紹此次程式碼內容:


紅框內容為:外部引用程式碼,每一行代表不同的功能分類,他是Unity官方或是.NET所撰寫的程式碼,如果顯示灰色代表目前您未使用其中的功能,白色是正在使用其中某項涵式或類別。

粉紅框:class CuteFox001 類別範圍請注意{   }。

金黃色:狐仙喜歡把"類別成員"變數放在上面。

淡藍色: CuteFox001所擁有的涵式,把淡藍色涵式展開,你會發現有{  },這代表此涵式範圍。

外部引用


現在我們刪除using UnityEngine.UI; 這一行。

會發生Text出現紅底線,這代表有錯誤,這次的錯誤是VS2015不認識Text是什麼,因為我們是使用別人寫好的類別。

現在教各位如何新增回來!首先滑鼠移動到有紅線的Text ,在上方等待一下。

出現燈號後,按下燈號旁邊箭頭(右方可以看到他說不認識Text)。

箭頭按下後會出來一個列表,會要您選擇一個解決方法,記住先找有Unity字樣的,再從其中選擇最上面那一個,如圖示。

類別規則

現在我們看此段:

public class CuteFox001 : MonoBehaviour

我們可以看到有兩種顏色,深藍代表是C#語言內建關鍵字,淡藍色表示類別名。

深藍色就是基本語言規則定義文字,淡藍色是我們命名或是別人命名的類別。

public 是代表公開意思,何謂公開呢,就是允許其他程式碼看到他。

class 您宣稱這是類別,而且後面更隨著他的名字CuteFox001。

MonoBehaviour是我們要放進Unity檢視列表上必須的類別(別人寫好的)。

類別基本樣貌


 變數規則


只要在{ }內,皆可宣告變數,宣告方式如下。

在class的{  }中時候:

1.您必須決定此變數要不要給您其他自己寫的程式碼所看到。
如果需要看到請在變數前面加public,不想被看到加private,如果未指定,一律當private
我們在程式碼看到 public Text inputA;
public我就是要給別人看到,這邊的別人不是指玩家,而是指其他工作夥伴,當然也包含自己。
如果我們改成 private Text inputA;並且程式碼Ctrl + S存檔,回到Unity看一下GameObject的右邊,會發現我們看不到了。

咦?那狐仙我們不就全部  public不就好了嗎?不去煩惱~

這樣的話會照成程式碼不好管理唷!

我們在int a, b, c;前面加個 public試試看~因為abc並未加任何public/private,預設會當private處理。

是的Unity多出abc,但是我們使用abc只不過是在類別中暫時計算用,如果這樣變數大量 public,不僅不美觀,而且也會不好管理。

2.變數種類,決定其資源

 public Text inputA; 其Text 就是這變數的資源類型是Text

int a, b, c; 其int 就是這變數的資源類型是int ,是C#預設,int 叫做整數資源,能放正負數值。

3.有意義命名

public Text inputA; 稍微有意義的命名,可以知道這是跟輸入有關。

int a, b, c; 無意義命名,看名稱完全不知道用處。

記住命名要有意義,包含類別、變數、涵式,還有首字不能數字開頭。

int 1a, 1b, 3c; 這樣會出現問題唷!各位小貓咪可以試試看~會出現紅字。

命名時後面加個,代表後面接著另一個變數名。
int a
int b
int c
這三行寫法可以用下面一行表示。
int a, b, c;

宣告記住每一行後面要有; <-告訴程式碼此行結束。

 涵式規則


粉紅框是Start涵式,其中void 是表示他沒有回傳資源,何謂回傳?處理完一件事情或任務以後,涵式回傳回一個變數給呼叫他的人,譬如您呼叫涵式給他資源,涵式會去處理,並且返回處理結果

 紅框是此涵式範圍,取決{  },在紅框內可以打程式碼。

淡籃框是別人給資源時候,我們會使用地方,之後教學會提到如何使用。

註解規則


有時候我們想打一些程式碼以外的備註就需要註解。

在任何地方最前方// <- 該行就會變成註解

如果再變數上方或涵式上方/// <-三個的話會變成:
/// <summary>
    ///
    /// </summary>
這是更高級註解,好處是在別地方滑鼠移動到該變數或涵式上面會有備註,類似您移動到官方涵式上方出現的備註提示。

 Unity組件規則


使用第一課那樣新增程式碼,Unity會自動生成基本框架,詳細可以依照第一課最後面那樣創造一次看看吧,再新增時的名字會自動變成類別名字唷!

 Start是給我們初始化取得別的物件使用,但是這節課狐仙使用拖移方式略過,CuteFox001此處空白。

Update是一偵呼叫一次,一秒60偵就是六十次囉!誰呼叫?Unity引擎會呼叫!

CuteFox001講解

說了這麼多XD終於到了第三課重頭戲了。

 此課需要在三個輸入地方輸入數字,並且顯示加起來後的結果。

通過拖移物件到變數上後,程式碼對應的文字inputA、inputB、inputC、OutText會連結到物件列表這些拖移上去的資源。


 Update是一偵呼叫一次,狐仙需要從輸入框取得數字,並且運算,所以寫在Update。
(因為這次沒有寫按鈕,按了才讀取會比較節省效能,現在每偵都讀取並且計算會吃較多效能)

  a = int.Parse(inputA.text);

我們要取得數字是從 inputA的text取得所以在這邊使用. <-點

但是我們取得的text是文字,需要有人幫我們處理成數字,或是過濾不是數字。

我們使用別人寫好的 Parse,他是放在int底下,所以這邊使用. <-點

別人寫好的涵式,當然拿來用囉


最後我們存放到a。

咦?狐仙那上面的  if (inputA.text != "") 是什麼意思呢?

if下次再教囉~這行意思是inputA.text 如果裡面沒有輸入任何東西就不執行下一行。

各位小貓咪可以拿掉這一行跑跑看~應該會出現很多警告。

至於 System.Int32 類似於int 只是System.Int32是指名使用.NET的,int是給Unity決定使用誰的。

c = a + b + c;

就單純a + b + c 最後放到c。

咦?狐仙等式兩邊都有c不成立耶?

這邊就記住吧XD

左邊的是未來,右邊是過去。

a + b + 過去c 放到  未來c

簡單來說未來的c被改變了,他是由a + b + c 結果改變。

OutText.text = c.ToString();

最後我們要顯示數字,但是OutText.text是顯示文字用,我們需要把整數c轉成文字,好在有人幫我們寫好了只要用. <-點呼叫ToString()


今天的課程就到這邊了XD有問題再問狐仙,會慢慢補充,第三課結束~

在這有個作業考驗各位,狐仙已經做好了加法,各位小貓咪們請試著做出減、乘、除。

最後應該要三種輸入框,並且在下方同時顯示4種運算答案唷!


提示:建議新增變數d替換未來c那位置,不然很有趣XD


沒有留言:

張貼留言