Scratch‎ > ‎

操作介面

2012/07/20 謝碧景(c)編製更新 

 學習目標

  • 瞭解Scratch 操作環境及各大區塊之應用。
  • 瞭解指令區各大類別之概述應用。
  • 學會以鍵盤方向鍵控制角色移動及切換角色造型。

一、操作環境  Scratch 官網 http://scratch.mit.edu

 Scratch 2.0 軟體:分為線上版及離線版,其操作介面五大區塊 (1)指令區[即程式區]、(2)腳本區、(3)舞台區、(4)角色區、(5)背包區。
  • 線上版:
  • 離線版:

 Scratch 1.4 離線版:分四大區塊 (1)指令區、(2)腳本區、(3)舞台區、(4)角色區。

操作介面

(一)功能表

  地球圖示

  • 轉換語系:如下左圖,在主畫面的左上方按下【功能表→】圖示,即可調整語言為【正體中文】。
  • 調整積木的字型大小:如下圖,合按【+Shift再選取set font size】即可調整積木的字型大小。

 檢視模式:分大舞台、小舞台、全螢幕等,使用者於編輯時,可依需求來設定:

  • 小舞台:如下左圖,選取【編輯→小舞台佈置】即顯示小舞台。
  • 大舞台:如下右圖,選取【編輯→v小舞台佈置】取消勾選小舞台佈置,即可恢復大舞台顯示。
  • 全螢幕:按下舞台區左上方圖示,即可切換為全螢幕顯示。

設定小舞台:
恢復大舞台顯示:


(二)指令區

 提供「動作」、「外觀」、「聲音」、「畫筆」、「資料」、「事件」、「控制」、「偵測」、「運算」、「更多積木」等10大類別積木指令。
    • 動作:(Motion)控制角色的位置、方向、旋轉、及移動。
    • 外觀:(Looks)控制角色的造型及特效,並有文字框顯示。
    • 聲音:(Sound)控制聲音的播放、音量控制、設定樂器、彈奏音符。
    • 畫筆:(Pen)執行畫筆繪圖功能,可設定畫筆顏色、及畫筆大小。
    • 資料:(Data)建立變數或清單以儲存資料。
 動作
  外觀
聲音
 畫筆
 資料


    • 事件:(Events)設定事件發生時需執行的程式。
    • 控制:(Control)設定程式流程控制,含循序結構、重複結構、選擇結構。
    • 偵測:(Sensing)判斷角色是否發生碰撞判斷、或取得滑鼠資訊、及取得與物件的距離等。
    • 運算:(Operators)含算術運算、邏輯運算、取得亂數、及字串運算。
    • 更多積木:(More Blocks)建立程序,針對需重複使用的積木可撰寫為程序,只要呼叫程序即可執行程序積木。
 事件
 控制 
偵測
運算
更多積木
 


(三)腳本區

 有「程式」、「造型」、「音效」等三個頁籤。

(四)舞台區

 會顯示目前程式執行的結果;舞台大小為寬480像素、高360像素;螢幕正中央座標是原點(0,0);以原點為中心往右X軸是正數,往左是負數;往上Y軸是正數,往下Y軸是負數。

 Scratch 2.0 版:


Scratch 1.4 版:
舞台區
 
 
→編輯
舞台上角色(左上方圖示):
 
  • copy 印章工具:可以複製角色。
  • delete 剪刀工具:可以刪除角色。
  • enlarge 放大工具:可以放大角色。
  • narrow 縮小工具:可以縮小角色。

 按右上方的綠旗 則開始執行程式。按下紅色按鈕stop 則停止執行程式。

 製作舞台背景:

預設舞台背景為白色,沒任何圖形,故下方為四種舞台製作方式,依序簡述:
  •  使用系統內建背景。
  • 直接繪製背景。
  • 上傳背景檔案:背景圖大小為寬480Pixels、高360Pixels。
  • 啟動電腦攝影機拍照做為背景。
  • 畫面的正中央位置是原點(0,0)
  • x座標-240~240,y座標180~180。
畫面的正中央位置是原點(0,0)


(五)角色區

 Scratch 2.0 版:
 Scratch 1.4 版:
 


→新增角色:
  •  繪製新角色:使用內建之繪圖編輯器,自行繪製圖案。
  •  開啟角色檔案:匯入現有圖檔(點陣圖)為角色造型。
  •  來個令人驚喜的角色:從內建圖庫中隨機取用一個圖片。

*註:複製角色:會連程式碼一併複製。存檔到電腦:即角色下載至本機電腦,檔名為『角色名稱.sprite2』,可供其他
專題使用。隱藏:即角色不會在舞台上顯示

 角色屬性設定面板:按下角色左上方圖示(或選取info)即展開屬性設定面板,如下圖,角色在舞台上的座標位置,例如x:0  y:0,及其所面對的『方向』↑ 0、→90、↓180、←-90)。

 Scratch 2.0 版:
 Scratch 1.4 版:角色在舞台座標位置
拖曳藍線可以改變角色方向

  •  允許旋轉360。
  •  只允許左、右翻轉。
  •  不允許旋轉。
direction面對的方向


 設定角色位置:
  • 設定x,y座標
    •  直接移動到某個x,y位置,例如:移到x:74,y:-27。
    •  移到某個特定位置,例如:移到滑鼠游標。
  • 面對方向
    •  可直接指定面對的方向值。
    •  面對滑鼠游標或某個角色。
  • 旋轉方向
    •  順時針旋轉15度。
    •  逆時針旋轉15度。
    •  僅能左右旋轉(即只允許左、右翻轉)。

(六)背包

開啟Scratch 時背包區預設為收合狀態,此區僅線上版擁有,其功能可跨專題共享資源,該區如容器般可將常用之資源如程式積木、角色、造型、背景圖等拖曳到背包區存放,該區資料在關閉專題或關閉Scratch仍存在,待開啟其他專題或新建專題僅需將此區資源拖曳至對應之區域,即可新增程式積木或角色等

(七)圖形編輯器

Scratch 提供簡易的圖形編輯器供使用,主要用於『舞台的背景圖』及『角色的造型圖』編修,圖形編輯功能分為編輯『點陣圖』及『向量圖』,操作介面如下:
  • 在舞台區點選『舞台』再於指令區點選『背景』頁籤;或於『背景』頁籤中點選『畫新背景』。
  • 在角色區點選任一角色,再於指令區點選『造型』頁籤;或於『造型』頁籤中點選『畫新造型』。
*註:角色圖片去背(即背景為透明):(1)在點矩陣模式下→(2)選取點陣繪圖工具中【以顏色填滿】→(3)再選取【不填色】→(4)點選欲去背之圖案,即可。tv 教學影片

二、範例應用

 範例1:利用鍵盤方向鍵(上、下、左、右)控制主角的移動。(檔名:ex1-1.sb2)  分享(官網)

請比較貓咪角色不同之旋轉(rotation)方式:[1]左-右(left-right) [2]不要旋轉(don't rotate) [3]各地(all around)。《參閱:角色屬性設定面板

  • 以貓咪面向方向移動
  • 貓咪前進、後退 移動
利用鍵盤方向鍵控制主角的移動-2

*註:
(1)在程式碼上快按滑鼠左鍵2次,即可執行該段程式碼。
(2)程式的執行是由上而下,一個積木一個積木執行



 範例2:按下【 空白建即可切換角色造型。(檔名:ex1-2.sb2)  分享(官網)
    • 角色:Scratch\Media\Costumes\Animals\starfish1-a.png、starfish1-b.png (圖檔可由Scratch 1.4 版安裝後 C:\Program Files (x86)\Scratch\Media 取得)。
    • 在角色區【()新增圖片檔案】→匯入【造型2 】→在腳本區寫程式碼【重複切換角色造型】。
切換造型-1
切換造型-2
切換造型-3
  

延伸思考:承上[範例]貓咪切換角色造型行走,當碰到邊緣時會反轉(檔名:ex1-1-2.sb2)  分享(官網)

ċ
ex1-1.sb
(47k)
Jing Tw,
2012年8月2日 上午12:54
ċ
ex1-2.sb
(11k)
Jing Tw,
2012年8月2日 上午12:54