WEBVTT

00:00:00.236 --> 00:00:02.719
目前大家都做過不少繪圖(drawing)了

00:00:02.719 --> 00:00:04.143
不過有些比較簡單的功能還沒講過

00:00:04.143 --> 00:00:07.595
例如加上自己的名字，這剛好
與本課要教的文字(text)相關

00:00:07.595 --> 00:00:10.049
至於那種情形下會用上?

00:00:10.049 --> 00:00:11.643
應用範圍包括顯示遊戲積分

00:00:11.643 --> 00:00:13.519
角色扮演，或放大縮小名字顯示

00:00:13.519 --> 00:00:15.225
以及改變字體顏色

00:00:15.225 --> 00:00:19.764
接下來我們要嘗試顯示文字hello

00:00:20.964 --> 00:00:24.353
不過實際輸入指令text(hello)
卻意外觸發錯誤提示訊息

00:00:24.353 --> 00:00:27.424
提示「未定義hello」，這是甚麼意思呢?

00:00:27.424 --> 00:00:29.431
問題在於程式本身

00:00:29.431 --> 00:00:31.058
把「hello」視為變數(variabke)

00:00:31.058 --> 00:00:33.715
以程式邏輯而言，這反應很正常

00:00:33.715 --> 00:00:36.222
「hello」的確有可能是變數
程式很難自行判斷

00:00:36.222 --> 00:00:38.991
要讓程式把「hello」視為文字

00:00:38.991 --> 00:00:41.350
其實也不難，只要記得

00:00:41.350 --> 00:00:43.159
把hello擺在英文的引號(" ")中即可

00:00:43.159 --> 00:00:45.083
如此程式便不會將其視為變數

00:00:45.083 --> 00:00:46.457
並解讀為文字

00:00:46.457 --> 00:00:48.153
或以文字顯示

00:00:48.153 --> 00:00:50.226
不妨這樣記比較容易

00:00:50.226 --> 00:00:51.739
書中的人物對話

00:00:51.739 --> 00:00:53.334
都會加註引號

00:00:53.494 --> 00:00:56.162
同樣的，若你希望程式像說話一樣表達

00:00:56.162 --> 00:00:58.400
文字當然也要加註英文引號

00:00:58.400 --> 00:01:00.899
這點真的很重要，但也很容易搞混

00:01:00.899 --> 00:01:03.891
再強調一次，只要程式內添加文字

00:01:03.891 --> 00:01:05.753
一定要在兩旁

00:01:05.753 --> 00:01:07.526
包夾英文的引號

00:01:07.526 --> 00:01:10.112
不然很可能會看到
剛才那樣的錯誤訊息

00:01:10.112 --> 00:01:12.266
若不幸遇此狀況

00:01:12.346 --> 00:01:15.359
記得檢查文字是否夾在英文引號中

00:01:15.359 --> 00:01:17.232
很好! 加註英文引號後

00:01:17.232 --> 00:01:18.755
就不會再出現錯誤訊息了

00:01:18.755 --> 00:01:20.928
不過你可能也發現程式毫無反應

00:01:20.928 --> 00:01:22.217
畫面仍是空白

00:01:22.217 --> 00:01:24.890
不過說也奇怪，若輸入文字背景("background")

00:01:24.890 --> 00:01:29.114
就用紅色好了，內容就出現了

00:01:29.114 --> 00:01:33.120
只不過是白字，所以仔細思考問題癥結

00:01:33.120 --> 00:01:36.106
剛才是在白底上寫白字

00:01:36.106 --> 00:01:37.952
自然看不見內容

00:01:37.952 --> 00:01:40.451
這或許有點蠢

00:01:40.451 --> 00:01:42.940
文字顏色怎會採用背景色呢?

00:01:42.940 --> 00:01:45.893
不過我們學過填色

00:01:45.893 --> 00:01:47.006
所以能改

00:01:47.006 --> 00:01:49.891
就像設定長方形或線條填色一樣

00:01:49.891 --> 00:01:51.796
也可任意設定文字填色

00:01:51.796 --> 00:01:54.231
就像之前做過的那樣即可

00:01:54.231 --> 00:01:56.410
不用設定背景也能看到文字

00:01:56.410 --> 00:01:59.429
接著我們再深入一些文字設定

00:01:59.839 --> 00:02:01.954
首先不用說也看得出來

00:02:02.194 --> 00:02:04.019
就是任意輸入文字

00:02:04.419 --> 00:02:06.584
接著若調整數值

00:02:06.584 --> 00:02:08.949
文字也會左右移動

00:02:08.949 --> 00:02:11.776
另外也能垂直定位

00:02:11.776 --> 00:02:13.162
這和我們之間做過的

00:02:13.162 --> 00:02:15.158
繪製長方形的過程很像

00:02:15.568 --> 00:02:17.620
不過比較棘手的就是

00:02:17.620 --> 00:02:19.542
文字的這2個座標

00:02:19.542 --> 00:02:23.996
界定文字框左下角的位置

00:02:23.996 --> 00:02:27.612
不過長方形的座標卻是指定左上角

00:02:27.812 --> 00:02:30.830
好像是故意要讓人搞混的

00:02:30.830 --> 00:02:32.681
不過你還是得記起來

00:02:32.781 --> 00:02:34.913
而且我們自己試一下就知道了

00:02:34.955 --> 00:02:38.509
把第2個座標值改成height

00:02:38.509 --> 00:02:42.448
文字高度便會貼齊左下角座標

00:02:44.358 --> 00:02:46.225
和將該值設定為零

00:02:46.225 --> 00:02:49.152
猜猜看結果會如何?

00:02:50.002 --> 00:02:53.041
起初什麼也看不見，但若增加數值

00:02:53.261 --> 00:02:56.326
文字就逐漸降臨

00:02:56.326 --> 00:02:59.672
因為界定的是左下角的座標

00:02:59.782 --> 00:03:01.324
而非左上角

00:03:01.384 --> 00:03:04.941
好，文字的功能分析到此為止

00:03:05.141 --> 00:03:06.758
我們繼續深入其他功能

00:03:06.848 --> 00:03:08.634
例如放大字體

00:03:09.024 --> 00:03:11.275
輸入textSize後

00:03:11.295 --> 00:03:13.886
程式就會據此決定文字大小

00:03:13.886 --> 00:03:15.989
例如在括號中填入30，字體就會很大

00:03:15.989 --> 00:03:17.688
甚至還可放得更大

00:03:17.688 --> 00:03:20.457
也可縮得很小 ─任你決定

00:03:20.457 --> 00:03:23.034
接下來就寫上自己的名字

00:03:23.034 --> 00:03:25.641
底下附上一些自我介紹的訊息

00:03:25.641 --> 00:03:28.646
因我只知自己的名字，就拿來當例子了

00:03:28.646 --> 00:03:30.871
待會你們再換成自己的

00:03:30.871 --> 00:03:34.024
立刻學以致用，輸入text("Sophia")

00:03:34.024 --> 00:03:35.887
我的名字就出現了

00:03:35.887 --> 00:03:38.135
或許底下再加上一些簡單介紹

00:03:38.135 --> 00:03:43.363
例如：「我喜歡小狗、吉他和寫程式。」

00:03:43.463 --> 00:03:46.489
看來不錯，除了顯然還需要

00:03:46.489 --> 00:03:48.945
還需要調整位置才不會重疊

00:03:48.945 --> 00:03:51.087
不過畫面好像塞不下那麼多字

00:03:51.087 --> 00:03:54.849
所以稍微縮小一下字體

00:03:56.559 --> 00:03:58.633
好了，看來還不錯!

00:03:58.633 --> 00:04:00.964
除了2行文字都是藍色看來有點單調

00:04:00.964 --> 00:04:04.273
所以稍加改變文字填色

00:04:04.273 --> 00:04:06.932
或許可換成比較好看的顏色

00:04:06.932 --> 00:04:09.804
像是紫色

00:04:09.804 --> 00:04:12.286
這樣就完成了

00:04:12.286 --> 00:04:16.099
以上所講的就是文字繪製、套色和設定大小