17. Quản lý tương tác người dùng

Post date: Jul 21, 2011 4:00:38 PM

Giới thiệu

Trong phần này, ta sẽ xây dựng một cơ chế quản lý tương tác người dùng cơ bản. Hai cơ chế tương tác chính:

• Mouse / touch (pointer)
• Bàn phím (key)

Để có thể linh hoạt trong cả xử lý mouse và touch, ta gọi chung là xử lý dạng pointer. Ngày nay, khá nhiều thiết bị hổ trợ touch đa điểm. Do đó, ta chọn xử lý touch đa điểm là nền tảng chung cho touch và mouse

Mô hình quản lý được đề xuất như sau:

Trong đó:

• View tiếp nhận tương tác từ người dùng, gửi thông điệp cho CGame xử lý
• Đến lượt mình, CGame chuyển tiếp thông tin cho bộ phận chuyên trách là Controller Manager xử lý
• Đến lượt mình, Controller Manager phân loại thông tin, và chuyển đến các module xử lý thích hợp

Thông tin tương tác được xử lý như thế nào ?

Nhìn chung, thông tin tương tác thường được xử lý theo 2 dạng:

• Xử lý tức thời: ngay khi sự kiện diễn ra (nhấn phím, click chuột, touch lên màn hình ...) thì ngay lập tức sự kiện đó được xử lý. Ví dụ:
  • VD1: Ngay khi nhấn A phát nhạc, khi nhấn B tắt nhạc.
  • VD2: Khi nhấn P thì pause game, khi nhấn R thì resume game
• Xử lý gián tiếp: thông tin về các sự kiện được lưu trữ lại dùng cho mục đích kiểm tra khi update. Ví dụ:
  • VD3: Trong lúc update, kiểm tra nếu phím A được nhấn thì mở nhạc, B thì tắt nhạc
  • VD4: Nếu giữ phím space quá 1s thì thoát game

Ở đây, tất yếu ta sẽ phải cung cấp cả 2 cơ chế cho người dùng. Tuy nhiên, về phía người dùng thì phải chọn cách thức xử lý nào cho phù hợp. Trở lại với 4 ví dụ trên.

• Ở ví dụ 1 và 3: ta thấy có sự trùng lắp trong 2 cách dùng này. Tuy nhiên có một điểm làm cho cách dùng thứ 2 trở nên "tốt" hơn, đó là có khả năng trong 1 frame cả 2 phím A&B đều nhấn. Nếu dùng VD1, nhạc vừa được phát lại phải tắt ngay. Việc này sẽ mang lại cảm giác khó chịu cho người chơi game, cũng như khó khả năng gây crashed ứng dụng (mobile). Nếu còn cách VD3, ta có thể chủ động kiểm tra các tình huống có thể xãy ra trong 1 frame, nhưng đổi lại, đáp ứng sẽ chậm 1 frame.
• Ở VD2, đây là trường hợp đặc thù cho xử lý tức thời. Mặc khác, khi đã pause game, vòng lặp game sẽ không thực hiện update nữa, do đó cũng sẽ không thể kiểm tra việc có nhấn R để resume.
• Với VD4, hoàn toàn không thể xứ lý tức thời trong trường hợp này

Như vậy, ta có một kết luận về đáp ứng các tương tác:

• Sử dụng phương thức xử lý tức thời trong trường hợp cần đáp ứng nhanh, không cần kiểm tra các sự kiện khác trong cùng frame; hoặc trường hợp bất khả kháng.
• Sử dụng phương pháp xử lý gián tiếp khi cần có các số liệu thống kê (khuyến cáo nên dùng cách này). Tuy nhiên, nếu sữ dụng cách này, đáp ứng sẽ trễ 1 frame (không đáng kể)

Mô hình xử lý

Từ cách sử dụng trên, ta thiết kế lại mô hình xử lý:

Khi tiếp nhận thông tin, CGame một mặt chuyển tiếp thông tin đến Controller-Manager để sử dụng sử dụng cho xử lý gián tiếp; thì một mặt khác sẽ xử lý trực tiếp nếu cần thiết. Trong trường hợp thông tin cần chuyển về từng state xử lý, CGame sẽ chuyển thông tin đến state hiện tại.

Coding

Mô tả thông tin tương tác

• Về phân loại, ta có 2 loại tương tác pointer và key

enum EControllerEvent

{

ECE_POINTER,

ECE_KEY,

};

• Với loại tương tác pointer, ta có các thao tác cơ bản:
  • pressed: nhấn chuột, touch lên màn hình
  • release: nhả chuột, nhả touch
  • drag: rê chuột khi đang nhấn, hoặc kéo rê tay trên màn hình

enum EPointerEvent

{

    EPE_NONE,

    EPE_PRESSED,

    EPE_RELEASED,

    EPE_DRAGGED,

};

• Với loại tương tác phím, các thao tác bao gồm
  • pressed: Nhấn phím
  • hold: Giữ phím
  • release: nhả phím

enum EKeyEvent

{

EKE_NONE,

EKE_PRESSED,

EKE_HOLD,

EKE_RELEASED,

};

Cấu trúc dữ liệu thông tin tương tác

Ứng với tương tác pointer bao gồm các thông tin:

• ID: pointer ID, dùng để phân biệt các điểm touch của multi-touch. Trong trường hợp sử dụng chuột, ID chuột trái luôn bằng 0
• Event: sự kiện của pointer hiện tại (pressed, released ...)
• X, Y: Tọa độ

struct SControllerEventPointerData

{

__INT32 ID;

EPointerEvent Event;

__INT32 X;

__INT32 Y;

};

Với tương tác phím, các thông tin bao gồm:

• KeyCode: mã phím. Với qui ước, 4 bits cuối cùng dùng để phân biệt các dạng bàn phím. Mã 0 dành cho WIN32. Như vậy, với WIN32, mã KeyCode có dạng 0x???????0, trong đó ??????? là mã phím trả về từ hệ điều hành.
• Event: sự kiện phím (pressed, release ...)

struct SControllerEventKeyData

{

__INT32 KeyCode;

EKeyEvent Event;

};

Một event tổng quát có dạng:

• Type: loại thông tin (phím / pointer)
• Dữ liệu cho từng loại thông tin

struct SControllerEvent

{

EControllerEvent Type;

union

{

SControllerEventPointerData PointerData;

SControllerEventKeyData KeyData;

};

};

Quá trình xử lý thông tin trực tiếp

Như đã đề cập ở trên, luồng thông tin bắt đầu từ View, do đó, trước tiên ta thiết kế lại CVSView cho việc nhận các sự kiện từ người dùng:

Tiến hành sửa đổi hàm LRESULT CALLBACK CVSView::WndProc

LRESULT CALLBACK CVSView::WndProc( HWND hwnd, UINT message, WPARAM wparam, LPARAM lparam )

{

SControllerEvent Event;

switch( message )

{

....

case WM_LBUTTONDOWN:

if (!CVSView::GetInstance()) return 0;

CVSView::GetInstance()->m_isLeftMouseDown = true;

Event.Type = ECE_POINTER;

Event.PointerData.Event = EPE_PRESSED;

Event.PointerData.ID = 0;

Event.PointerData.X = LOWORD(lparam);

Event.PointerData.Y = HIWORD(lparam);

CGame::GetInstance()->SetEvent(Event);

return 0;

....

}

return DefWindowProc(hwnd, message, wparam, lparam);

}

Trong bước trên, ta thấy xuất hiện hàm SetEvent của CGame. Implement hàm này chính là công việc tiếp theo cần thực hiện.

Từ mô hình xử lý, ta thấy việc xử lý trực tiếp thông qua 2 công đoạn:

• CGame xử lý trước: thông thường với các event chung cho tất cả các state
• Nếu cần xử lý riêng, trả về cho các state xử lý.

Ở CGame, ta thiết kế hàm virtual bool OnControllerEvent(SControllerEvent Event) {return false;} hàm này trả về true nếu việc xử lý được thực hiện bởi CGame, hoặc false nếu cần chuyển cho State. Mặc định hàm này trả về false, và sẽ được over-write ở từng game cụ thể.

Ví dụ:

virtual bool OnControllerEvent(SControllerEvent Event)

{

if (Event.Type == ECE_KEY && Event.KeyData.Event == EKE_PRESSED && Event.KeyData.KeyCode == EKEY_WIN_Q)

{

this->Exit();

return true;

}

return false;

}

Ở CState, ta thiết kế hàm virtual void OnControllerEvent(SControllerEvent Event) {}. Hàm này là hàm rỗng, và sẽ được overwrite ở từng state cụ thể.

Khi này, ta implement hàm SetEvent:

void CGame::SetEvent(SControllerEvent Event)

{

if (!this->OnControllerEvent(Event))

{

CState* state = CStateManagement::GetInstance()->GetCurrentState();

if (state)

{

state->OnControllerEvent(Event);

}

}

}

Quá trình xử lý thông tin gián tiếp

Ngoài việc xử lý trực tiếp, SetEvent cung cấp cơ chế xử lý gián tiếp bằng cách chuyển dữ liệu đến CControllerEventManager

void CGame::SetEvent(SControllerEvent Event)

{

CControllerEventManager::GetInstance()->OnEvent(Event);

if (!this->OnControllerEvent(Event))

{

CState* state = CStateManagement::GetInstance()->GetCurrentState();

if (state)

{

state->OnControllerEvent(Event);

}

}

}

Nói về CControllerEventManager, đây là lớp đóng vai trò điều phối việc quản lý các thông tin tương tác. Lớp này vận hành hai lớp chuyên biệt hơn là:

• CControllerPointerManager: chuyên cho thu lập, xử lý, và cung cấp các hàm tiện ích cho xử lý touch. Các hàm tiện ích cơ bản bao gồm:
  • GetActivePointer: lấy danh sách các điểm touch hiện tại
  • WasTouchedInside / WasReleaseInside: kiểm tra xem người dùng có đang touch hoặc release tại một vùng nào đó hay không
• CControllerKeyManager: chuyên cho quản lý key. Các hàm tiện ích:
  • WasKeyPressed / WasKeyHold / WasKeyRelease: kiểm tra trạng thái của 1 phím nào đó
  • WasAnyKeyPressed / WasAnyKeyHold / WasAnyKeyRelease: kiểm tra trang thái của mọi phím

Để thiết kế CControllerPointerManager, CControllerKeyManager, source có bổ sung thêm lớp CLutI. Về cơ bản CLutI giống CLut (xem), tuy nhiên có điểm khác là key là một số nguyên. Các thông tin event được lưu trữ trong một bảng tra dùng cho mục đích kiểm tra các sử kiện đã xãy ra trong frame

Ví dụ sử dụng:

void CStatePoster::Update()

{

spr->UpdateAnimation(CFpsController::GetInstance()->GetFrameDt());

int w = VIEWCLASS::GetInstance()->GetWidth();

int h = VIEWCLASS::GetInstance()->GetHeight();

if (CControllerPointerManager::GetInstance()->WasReleaseInside(0, 0, w, h))

{

spr->ResetAnimation();

}

if (CControllerKeyManager::GetInstance()->GetKeyHoldDuration(EKEY_SPACE) > 1000)

{

CGame::GetInstance()->Exit();

}

}

Xem source để có thêm chi tiết.

Source code

Ở version này, Utils được tách ra thành các lớp chức năng nhỏ để tiện sử dụng

Download

FIX BUG:

Trong phần source code download, file CVSView.cpp, thay hàm update với nội dung sau:

void CVSView::Update()

{

while (true)

{

// handle win32 message

MSG msg;

if (PeekMessage(&msg, NULL, 0, 0, PM_REMOVE))

{

TranslateMessage(&msg);

if (msg.hwnd == m_hwndWindow)

{

//WndProc(m_hwndWindow, msg.message, msg.wParam, msg.lParam);

DispatchMessage(&msg);

}

}

CGame::GetInstance()->Update();

if (!CGame::GetInstance()->IsAlive())

{

DestroyWindow(m_hwndWindow);

return;

}

RefreshGL();

}

}

Lưu ý: nếu run thiếu dll, chép tất cả các dll trong libs ra cùng chỗ với .exe