วิธีทำให้คอนโทรลเรารองรับ Gesture ใน Windows Mobile 6.5

Posted 23/10/2009 03:49 by nantcom

เป็นอย่างไรกันบ้างครับ ไม่ได้พบกันนานเลยทีเดียว และผมก็ยังไม่ว่างเขียนบทความต่อจากตอนที่สองเสียที สาเหตุก็มาจากเรื่องเดิมๆ นั่นเองครับ Stick out tongue คือ งานเข้า ช่วงนี้หลังจากที่ผมได้ไปสอนที่ True มา และได้เปิดสอนกับ DevBuilder เหมือนว่าผมจะพบตัวตนซะแล้วละครับ เพราะงานสอนนี่กระหน่ำกันเข้ามาเลยทีเดียว

สำหรับตอนนี้ Windows Mobile 6.5 หรือที่เราเรียกมันใหม่ว่า Windows Phone ก็ได้เปิดตัวอย่างเป็นทางการเป็นที่เรียบร้อย ซึ่งผมเองก็ใช้อยู่เหมือนกันใน Acer F900 ที่ผมเพิ่งถอยมาได้ราวเดือนนิดๆ และสุขใจกับการใช้ WM6.5 ดี จากการเล่น Gestgure นี่แหละ และหลายๆ ท่านคงจะทราบว่า ผมเองก็กำลังซุ่มทำโปรแกรม Twitter ของผมเองอยู่ (เพราะทนโปรแกรมปัจจุบันที่มีอยู่ไม่ได้เลย) และปัญหาหนึ่งที่ผมเจอก็คือ โปรแกรมผมยังไม่รองรับ Gesture ครับ Sad

ทีนี้ จะทำยังไงดีละ??

ระบบ Gesture ใน Windows Mobile โดยที่ผมลองและสรุปเอง มีด้วยกัน 3 แบบ ครับ

  1. แบบ Built-in ซึ่งคอนโทรลมาตรฐานทั่วไปที่เราใช้กัน จะรองรับ Gesture ในโดยอัตโนมัติ WM6.5 (อ้างอิงจาก http://blogs.msdn.com/marcpe/ และผมได้ทดสอบหมดแล้วด้วยครับ) ได้แก่
    • Listview
    • Listbox
    • Combobox
    • Browser Control
    • Treeview
    • และ Tab Control (ใช้เปลี่ยน Tab)
  2. แบบ TKSetWindowAutoGesture() หรือ เป็นแบบ Windows เป็นคนจัดการให้ โดยเราเป็นผู้กำหนดว่า จะให้คอนโทรลอะไร ใช้ Gesture ไหนได้บ้าง เท่านั้นเอง ที่เหลือ Windows เป็นคนจัดการให้หมด โดยจะมีการทำงานคล้ายกับแบบ Built-in มาก เว้นแต่ว่า เวลาเราลากเนื้อด้านในไปไกลๆ มันจะไม่ยืดตามมาเหมือนของ Built-in แต่ว่า มันจะติดที่ขอบแทน ถ้าผู้ที่ไม่เคยลอง หรือนึกไม่ออกว่า แบบ Built-in ทำงานยังไง ลองดูจากภาพประกอบด้านล่างนี้ครับ

    image

    เวลาปกติ

    image

    ถ้า User พยายามดูด้านบนของ List โดยการถูนิ้วลง แต่ว่ามันสุดขอบบนแล้ว เนื้อหาด้านในจะยังคงเลื่อนตามมา

    image

    พอ User ปล่อยนิ้ว เนื้อหาด้านในก็จะเด้งกับไปอยู่ด้านบนเอง อัติโนมัติ
    (Rubber Band Effect)

  3. แบบ สุดท้าย คือแบบ เราทำเองทั้งหมด โดยการใช้ Physic Engine ร่วมกับ Gesture Recognizer ซึ่งอันนี้เราต้องเขียนโค๊ดเอง แต่ว่าพอกล้อมแกล้มให้เราเลียนแบบการทำงานของ Built-in ได้

โอเค แล้วเราจะเริ่มยังไงดี?

ประการแรกเลย เราจะต้องดาวน์โหลด Managed Wrapper ของ Gesture API มาซะก่อน เนื่องจากจะให้เรา P/Invoke กันเอง คงจะยากน่าดู โดยเราสามารถดาวน์โหลดได้จาก http://code.msdn.microsoft.com/gestureswm/Release/ProjectReleases.aspx?ReleaseId=3177 ครับ ให้โหลดตัวที่เป็น .DLL มาก็พอแล้ว

หลังจากโหลดมาแล้ว (อาจจะต้องคอยมาดูเวอร์ชั่นใหม่เรื่อยๆ ด้วยนะ) สำหรับการทำให้เราสามารถใช้แบบ Auto (แบบที่ 2) TKSetWindowAutoGesture ) ได้ ทำได้ตามตัวอย่างนี้ครับ

  1. ขั้นแรก นำ Picturebox วางลงบน Form แล้วหารูปที่ขนาดใหญ่กว่า Form นิดหน่อย มาใส่ใน Picturebox แล้วตั้งค่าให้ขนาด Picturebox มันมีขนาดเท่ากับรูป ซึ่งก็จะทำให้ขนาดของ Picturebox ล้นออกมา และทำให้เกิด Scrollbar ตามภาพ (ถ้าไม่มี ให้ตั้งค่า AutoScroll ของ Form เป็น True)
    image
  2. จากนั้น ทำการ Add Reference ไปหา Dll ที่ดาวน์โหลดมา โดยการคลิ๊กขวาที่ Project และเลือกที่ Add Reference
    image
    image
  3. จากนั้นทำการ using Microsoft.WindowsMobile.Gestures; และใส่โค๊ด ดังนี้

    public Form1()
    {

        InitializeComponent();

        var ctx = AutoGestureContext.GetContext(this);
        ctx.IgnoreScroll = false;
        ctx.IgnorePan = false;
        ctx.IsHorizontallyScrollable = true;
        ctx.IsVerticallyScrollable = true;

    }

  4. และพอรันโปรแกรมทดสอบ ก็จะพบว่า สามารถใช้เมาส์ Pan ดูรูปภายในได้เอง โดยไม่ต้องเลื่อน Scroll Bar และถ้าทำการ Flick หรือ “เขี่ย” หน้าจอ ก็จะพบว่า รูปด้านในสามารถเลือนไปตามทิศทางต่างๆ พร้อมกับชนขอบและกระดอนออกมาได้ด้วย
    image

สำหรับแบบที่สาม หรือแบบกำหนดเองนั้น ติดตามต่อตอนหน้าครับ ผมว่า ผมควรนอนได้แล้วละ นี่จะตีสี่แล้ว เล่นเพลินไปหน่อย Big Smile

 

Twitter Trackbacks for ??????????????????????????????????????????????????????????????????????????? Gesture ?????? Windows Mobile 6.5 - ???????????? [coresharp.net] on Topsy.com said:

Pingback from  Twitter Trackbacks for                 ??????????????????????????????????????????????????????????????????????????? Gesture ?????? Windows Mobile 6.5 - ????????????         [coresharp.net]        on Topsy.com

October 23, 2009 3:56 AM
(required)  
(optional)
(required)  
Add