Xử lí sự kiện zoom trong window phone (pinch zoom)

I.Khái quát về Pinch Zoom:

Pinch Zoom là một loại sự kiện cơ bản của chức năng multi-touch trong các thiết bị di động cảm ứng.

Trong bài viết đây tôi sẽ hướng dẫn một cách đơn giản để tiếp cận với việc xác định pinch Zoom và nhận giá trị trả về của nó. Ví dụ được trình bày với XNA 4.0

II. Thực hiện:

Một lưu ý nhỏ trước khi chúng ta bắt đầu: mọi người phải nhớ rằng, đối tượng được tác động bởi pinch Zoom không thể dùng giá trị trực tiếp bằng sự thay đổi vị trí của 2 ngón tay đảm nhiệm vai trò của zoom.

và việc chuyển đổi sao cho phù hợp sẽ được đề cập.

   Xác định bắt đầu sự kiện pinch Zoom    

Sự kiện được xác định khi tọa độ của 2 ngón tay được xác định là thay đổi. trong khi đang touch

   Nhận giá trị tác động của pinch Zoom (Scaling)

   public static float GetScaleFactor(Vector2 position1, Vector2 position2, 

            Vector2 oldPosition1, Vector2 oldPosition2)

        {

            return Vector2.Distance(position1, position2)

                / Vector2.Distance(oldPosition1, oldPosition2);

        }

  Trong đoạn code trên: ta đang xét đến scaling của quá trình zoom bằng cách lấy tỉ lệ của khoảng cách củ bằng khoảng cách mới, từ đó xác định mức độ zoom.

  Xác định lại vị trí của đối tượng.

Nếu ta xác định đơn thuần bằng trung tâm của 2 điểm mới, thì vị trí của đối tượng sẽ bị rung và di chuyển rất lung tung, vì có thể khoảng cách giữa vị trí củ và mới của 2 ngón tay không bằng nhau, vì thế ta dựa vào scale đã tính được để xác định đúng trọng tâm của đối tượng.

 public static Vector2 GetTranslationDelta(Vector2 position1, Vector2 position2,

            Vector2 oldPosition1, Vector2 oldPosition2, Vector2 posObject, float scaleFactor)

        {

            var newpos1 = position1 + (posObject - oldPosition1) * scaleFactor;

            var newpos2 = position2 + (posObject - oldPosition2) * scaleFactor;

            var newpos = (newpos1 + newpos2) / 2;

            return newpos - posObject;

        }

   Thiết lập vào các thuộc tính.

 public static void ApplyPinchZoom(Vector2 position1, Vector2 position2, 

            Vector2 oldPosition1, Vector2 oldPosition2, ref Vector2 objectPos, ref float objectScale)

        {

            var scaleFactor = GetScaleFactor(position1, position2, oldPosition1, oldPosition2);

            

            objectScale *= scaleFactor;

            objectPos += GetTranslationDelta(position1, position2, oldPosition1, oldPosition2, objectPos, scaleFactor);

        }

Hoàn chỉnh class PinchZoom


public class PinchZoom
    {
        public static float GetScaleFactor(Vector2 position1, Vector2 position2, 
            Vector2 oldPosition1, Vector2 oldPosition2)
        {
            return Vector2.Distance(position1, position2)
                / Vector2.Distance(oldPosition1, oldPosition2);
        }

        public static Vector2 GetTranslationDelta(Vector2 position1, Vector2 position2,
            Vector2 oldPosition1, Vector2 oldPosition2, Vector2 posObject, float scaleFactor)
        {
            var newpos1 = position1 + (posObject - oldPosition1) * scaleFactor;
            var newpos2 = position2 + (posObject - oldPosition2) * scaleFactor;

            var newpos = (newpos1 + newpos2) / 2;

            return newpos - posObject;
        }

        public static void ApplyPinchZoom(Vector2 position1, Vector2 position2, 
            Vector2 oldPosition1, Vector2 oldPosition2, ref Vector2 objectPos, ref float objectScale)
        {
            var scaleFactor = GetScaleFactor(position1, position2, oldPosition1, oldPosition2);
            
            objectScale *= scaleFactor;
            objectPos += GetTranslationDelta(position1, position2, oldPosition1, oldPosition2, objectPos, scaleFactor);
        }
    }

Chúc các bạn thành công,



HTIT