多人網路電子白板

 

前言： 我們可以把前一課程的範例直接再與Multiuser Server連接，就可以做出多人同時在線上去畫這個繪圖板呀。

 

課程 433


本課程單純教作法，至於美工部份，同學學會後，再自行設計美工

 

步驟 1

 

舞台背景設為灰色，尺寸設為 500x450像素

在舞台上設計一個"進入多人網路電子白板"按鈕，一個"姓名"的text及一個名稱為"name"的Filed，時間都設為一格
在Frame1設一個"login"的Marker，並且設go the frame之lingo，如圖 1


圖 1

步驟 2

 

將"name"這個Sprite的屬性設為Editable

 

步驟 3

 

在Frame10設一個"check"的Marker，並且設go the frame之lingo
在舞台上設計一個"連線中..請稍後.."的訊息文字，時間設為一格 如圖 2所示


圖 2

步驟 4

 

在Frame20設一個Marker，命名為"paintroom"，該格設go the frame之lingo
在舞台中下方邊設一個Field，並設它的屬性為Scroll(捲軸)，這是顯示"歡迎來到軟大.."內容的地方
在舞台左下方設一個Field，並設它的屬性為Scroll(捲軸)，這是顯示聊天者人數及姓名的地方
在舞台中間再設一個白色矩形，，這是大家一起繪圖的地方
再做一個清除畫面的按鈕及離開的按鈕，如圖 3所示


圖 3

步驟 5

 

接下來請打開Library，在該視窗的Library List請點選 Internet→Multiuser，如圖 4


圖 4

步驟 6

 

回到Frame1，把Connect to Server圖示拖曳到"進入多人網路電子白板"按鈕，如圖 5


圖 5

在Parameters for "Connect to Server"的視窗，請設定以下內容，如圖 6


圖 6

server address

如果沒有Sever的話，可以先用自己電腦的 IP來練習。

查IP方法

點選開始→執行，在執行視窗輸入command

在Dos模式，請輸入 ipconfig，就可以看到IP位置了

 

步驟 7

 

跳至Frame20，把Chat Output圖示拖曳到舞台上的顯示內容的Field上面，如圖 7


圖 7

 

在Parameters for "Chat Output"視窗，請設以下內容，如圖 8


圖 8

步驟 8

 

把Display Group Member Names圖示拖曳到舞台上的顯示進入者人數及姓名的Field上面，如圖 9


圖 9

 

在Parameters for "Display Group Member Names"視窗，請設以下內容，如圖 10


圖 10

步驟 9

 

將Whiteboard (Shared Canvas)圖示拖曳到白色矩形上，如圖 11


圖 11

在Parameters for "Whiteboard (Shared Canvas)"視窗，請設以下內容，如圖 12


圖 12

步驟 10

 

把Disconnect from Server 圖示拖曳到舞台上的離開按鈕上面，如圖 13


圖 13

 

步驟 11

 

點選選項列的 Modify →Movie→ Xtras，在Movie Xtras視窗按Add按鈕，把Multiuer.x32加入進來，如圖14


圖14

步驟 12

 

 

把Library項目切換到 Paintbox，將Canvas圖示拖曳到舞台上的白色矩形，如圖 15


圖 15

步驟 13

 

將Erase All Button圖示拖曳到舞台的"清除畫面"按鈕，如圖 16


圖 16

步驟 14

 

 

再把這個dir發佈成網頁，然後開啟MultisuerSever，如圖 17


圖 17

找幾台有連線的電腦開啟這個網頁，測試是否成功

 

《原始檔下載》