1. 網路遊戲設計 Web Game Design 授課教師 江素貞

2. Chapter 5 Chat First Chat Project

3. Create Login UI 宣告LoginScreen類別(LoginScreen.as)，於建構子中載入SWF檔 讀取檔案資訊 (loader為 Loader物件) loader.contentLoaderInfo.addEventListener(Event.COMPLETE, getComponents); public function getComponents(e:Event):void { var info:LoaderInfo = e.target as LoaderInfo; var loader:Loader = info.loader as Loader; var a:MovieClip = loader.getChildAt(0) as MovieClip; var myMC:MovieClip = a.getChildAt(0) as MovieClip; loader.x = stage.stageWidth / 2 - info.width/2; //info內含影片片段Size loader.y = stage.stageHeight / 2 - info.height/2; myMC.name_txt.text = "player" + Math.round(10000 * Math.random()); }

5. Create Login UI(Listen Event) var login:LoginScreen = new LoginScreen(); login.addEventListener(LoginScreen.OK, onLoginToServer);

6. Chat

7. 使用者清單與訊息傳送 ConnServer中，登入成功時建立Chat物件(將ElectroServer instance傳入)，接手處理訊息工作 ChatScreen類別為顯示聊天畫面 載入完成時派送”OK”訊息 按下[send]按鈕時派送”MSG”訊息 Chat.as：處理訊息 顯示聊天畫面 收到”OK”訊息時，讓使用者進入預設的Lobby房間 進入房間後顯示自己的名字及玩家清單 收到”MSG”訊息時，傳送訊息 收到PublicMessageEvent訊息時， 顯示訊息

8. MessageType Properties UserListUpdateEvent: 房間內有新玩家進入時觸發 ZoneUpdateEvent:Zone裡有房間被創造出來時觸發 PublicMessageRequest PublicMessageEvent CreateRoomRequest JoinRoomEvent ZoneUpdateEvent

9. Show Chat UI Chatconstrucor chatScreen= new ChatScreen(); addChild(chatScreen); chatScreen.addEventListener(ChatScreen.OK, onChatScreenReady); chatScreen.addEventListener(ChatScreen.MSG, onChat);

10. Enter Lobby Room private function JoinRoom(roomName:String):void { varcrr:CreateRoomRequest = new CreateRoomRequest(); crr.setRoomName(roomName); crr.setZoneName("chat"); es.send(crr); }

14. Show User List 加入房間成功時呼叫 showUserList() 接收到 UserListUpdateEvent 時呼叫 showUserList() es.addEventListener(MessageType.UserListUpdateEvent, "onUserListUpdate", this); public function onUserListUpdate(ev:UserListUpdateEvent) { showUserList(); }

16. 偵測使用者進入或離開 public function onUserListUpdate(ev:UserListUpdateEvent) { //ev提供相關函式，可取得造成user list變更的使用者資訊 if (ev.getActionId() == UserListUpdateEvent.DeleteUser){ //使用者離開 } if (ev.getActionId() == UserListUpdateEvent.AddUser) { //使用者進入 } }

17. 設定TextArea之文字顏色 private function appendMessage(msg:String, color:String="#000000") { varmsgStr:String = "<font color='" + color + "'>" + msg + "</font>"; chatScreen.chatList_txt.htmlText+=(msgStr); }

18. Show Room List private function showRoomList() { varrooms:Array = es.getZoneManager().getZoneByName("chat").getRooms(); chatScreen.room_list.removeAll(); for (vari in rooms) { varrm:Room = rooms[i] as Room; var lab=rm.getRoomName()+"("+rm.getUserCount()+")“; chatScreen.room_list.addItem( { label:lab, data:rm } ); chatScreen.room_list.sortItemsOn("label", "ASC"); } }

19. 加入房間 public function onChangeRoom(e:Event){ varrm:Room = chatScreen.room_list.selectedItem.data; if (rm.getUserCount() == rm.getCapacity()) { //房間已滿 } else{ leaveCurrentRoom(); //離開房間 JoinRoom(rm.getRoomName()); } }