App Inventor2 : PaintPot (Part 1)

 App Inventor2 : PaintPot (Part 1)

出處: https://appinventor.mit.edu/explore/ai2/paintpot-part1

Step1: 設置組件

您將使用這些組件來製作 PaintPot：

1.三個按鈕(Button)用於選擇紅色、藍色或綠色油漆，另一個按鈕用於清除繪圖。

2.畫布，繪圖表面。 此畫布有一個 BackgroundImage，它是 HelloPurr 教程中的這隻小貓。 您也可以在空白畫布上繪圖。 那隻是沒有背景圖像的畫布。

3.還有一個您看不到的組件：您使用 HorizontalArrangement 使三個顏色按鈕並排排列。

這總共有五個組件。 讓我們獲取它們並構建應用程序。

Step2: 顏色按鈕

將 Button 組件拖到 Viewer 上，並將 Button 的 Text 屬性更改為“Red”，並將其 BackgroundColor 設置為紅色。

單擊查看器中組件列表中的 Button1 以突出顯示它（它可能已經突出顯示）並使用重命名...按鈕將其名稱從“Button1”更改為“ButtonRed”。

同樣，再製作兩個藍色和綠色按鈕，分別命名為“ButtonBlue”和“ButtonGreen”，將它們垂直放置在紅色按鈕下方。

Step3: 將按鈕水平排列

使用 HorizontalArrangement 組件可以將多個物件水平排列

Step4 : 畫布和擦除按鈕

1.從 Palette 的繪圖和動畫抽屜中，將 Canvas 組件拖到查看器上。 將其名稱更改為“DrawingCanvas”。 將其寬度設置為“填充父級”並將其高度設置為 300 像素。

2.將背景圖像添加到畫布。 在 Canvas 的屬性面板中單擊 BackgroundImage 旁邊的包含“None...”的字段。 您可以使用 HelloPurr 教程中的相同 kitty.png 文件，也可以使用您選擇的其他圖像。

3.從 Palette 中，將最後一個 Button 拖到屏幕上，將其放在 Canvas 下方。 將此 Button 組件重命名為“ButtonWipe”並將其 Text 屬性更改為“Wipe”。

Step5 : 設定畫布-畫筆顏色及清除畫面

Step6: 畫點與畫線

Step7: 上傳