Marano Software

2. Windows Mobile 6.5 - мощная платформа для создания привлекательного и функционального интерфейса в ваших мобильных приложениях Marano Software Microsoft RUS Марат Бакиров Виталий Дильмухаметов

3. Вопросы • Может ли Windows Mobile приложение выглядеть красиво? • Кто из Вас имеет опыт native (C++) разработки для Windows Mobile? • Кто из Вас имеет опыт разработки на .NET CF? • Кто из Вас знает что такое pinvoke?.

4. Содержание • Тенденции мобильных интерфейсов • Полупрозрачность и градиент • UI Framework • Поддержка жестов в WM 6.5 • Управляемая обертка для жестов • Создание Widgets

5. Вопрос • Что такое красивое приложение?

6. Тенденции интерфейсов

7. Тенденции интерфейсов

8. Тенденции интерфейсов

9. Тенденции интерфейсов

10. Тенденции интерфейсов - выводы • Прозрачные изображения • Прямоугольные элементы с закругленными углами • Элементы с градиентной заливкой • Фоновые изображения

11. Прозрачность бывает разная • Прозрачный цвет • Прозрачный рендеринг изображения

12. Осуществление прозрачности • Фон изображения закрашивается каким-либо цветом и обьявляется прозрачным • Поддерживаетсяв .NET CF: ImageAttributesattr = new ImageAttributes(); attr.SetColorKey(Color.Red, Color.Red); e.Graphics.DrawImage(bmp, destRect, 0, 0, bmp.Width, bmp.Height, GrahicsUnit.Pixel, attr)

13. Осуществление прозрачности • Все изображение прозрачное • Смешивание по альфа-каналу Поддерживаеться Windows Mobile платформой: [DllImport("coredll.dll") extern public static Int32 AlphaBlend(IntPtrhdcDest,               Int32 xDest, Int32 yDest, Int32 cxDest,               Int32 cyDest, IntPtrhdcSrc,  Int32 xSrc,               Int32 ySrc, Int32 cxSrc, Int32 cySrc, BlendFunctionblendFunction);

14. Осуществление прозрачности • Изображение содержит альфа-канал Поддерживаеться Windows Mobile платформой через Imaging API’s COM интерфейсы: IImagingFactory IImage

15. Градиентная заливка • Создается смешиванием двух или нескольких цветов, причем один цвет плавно переходит в другой. • Поддерживаеться Windows Mobile платформой: [DllImport("coredll.dll")] public extern static boolGradientFill( IntPtrhdc, TRIVERTEX[] pVertex, uintdwNumVertex, GRADIENT_RECT[] pMesh, uintdwNumMesh, uintdwMode);

16. Как? • http://code.msdn.microsoft.com/uiframework • Msdn.UI • Прозрачность, градиенты, title bar • Подстройка существующего UI. • DataGrid, ListView, CustomBorder.

17. UI Framework Виталий Дильмухаметов Marano Software Демонстрация

18. Поговорим о жестах • Жесты это не только касание, но и взаимодействие. • Касание пальцемнеявляетсяточным: • Форма и размер • Разная скорость и угол движения • Менее точное чем пером (stylus)

19. WM 6.5 элементы управленияи жесты • Listview • Listbox (включая combo) • Webview • Treeview • Tab (прокрутки налево/направочтобы поменять страницу)

20. Как жесты работают в WM 6.5 • Жесты!= Mouse Messages • Жесты, доставляютсяк окнупервогокасания • сообщение WM_GESTURE • wParamСодержит код типа жеста • lParamСодержит GESTUREINFO структуру

21. Поддерживаемые типы жестов • Панорамирование (Pan) • Прокрутка (Scroll)– Инерция после панорамирования • Выбор (tap) • Двойной выбор (Double-tap) • Задержка (Hold)

22. Managed WrapperGestureRecognizer • Добавляется к System.Windows.Forms.Control • Работает чере P/Invoke • Использует сообщения WM_GESTURE • Предоставляет управляемые (.NET) события var g = new GestureRecognizer(); g.TargetControl= panel1; g.Select += (sender, GestureEventArgs e) => … g.DoubleSelect += (sender, GestureEventArgs e) => … g.Hold += (sender, GestureEventArgs e) => … g.Pan += (sender, GestureEventArgs e) => … g.Scroll += (sender, GestureScrollEventArgs e) => …

23. Physics Engine • Обеспечивает “естественное” ощущение во времяпрокрутки. • Продолжает прокрутку и уменьшает скорость в зависимости от начального ускорения. • Обеспечивает эффект растянутой резины. • Также обеспечивает допустимуюостановкуоснованую наразмере елемента.

24. Managed WrapperPhysicsEngine • Использует PhsyicsEngineAPI через P/Invoke • Предоставляет управляемое событие AnimateFrame varp = newPhysicsEngine(); p.ExtentControl = pictureBox1; p.ViewportControl = panel1; … g.Scroll += (sender, GestureScrollEventArgse) { p.Stop(); p.Angle = e.Angle; p.Velocity = e.Velocity; p.Start(); // or p.Start(e.Angle, e.Velocity); };

25. Автоматические жесты (WAG) • Автоматизирует сценарии использования жестов. • Поддерживается любым окном со стилем WS_VSCROLL или WS_HSCROLL • Поддерживает отправку WM_VSCROLL/WM_HSCROLL сообщений илианимации

26. Managed WrapperAutoGestureContext • Работает через WAGI API иP/Invoke • Управляемое событие Status иOwnerAnimate varwag = AutoGestureContext.GetContext(panel1); wag.IsOwnerAnimated = true; wag.HorizontalExtent = 10; // percent wag.OwnerAnimate += (sender, AutoGestureAnimateEventArgse) { pictureBox1.Location = e.Location; }; wag.Status += (sender, AutoGestureStatusEventArgse) { label1.Text = e.Status.ToString() + “ “ + e.ExtraStatus.ToString(); };

27. Gesture Framework Марат Бакиров Microsoft Rus. Демонстрация

28. Что такое Widget? • Небольшoeодноцельноемини-приложениe

29. Widgets на мобильных устройствах

30. Что они могут делать? • Выглядят также как и родные приложения • Доступ к ограниченым данным устройства за пределами изолированной программной среды • Полная поддержка AJAX, родной JSON парсер, можно использовать элементы управления ActiveX (как Flash)

31. Что там под капотом? Widget Package Widgets Runtime Powered by Internet Explorer Mobile Plug-ins Flash Security Broker HTML MSXML Windows Media JavaScript … CSS Web Rendering Engine Script Engine JavaScript Device Extensions Menu Images Settings Storage XML Manifest …

32. За пределами изолированной программной среды • Доступ к информации о текущем состоянии устройства • CradlePresent • PhoneHomeService • PhoneRoaming • PhoneSignalStrength • PhoneOperatorName • DisplayRotation • PowerBatteryStrength • PowerBatteryState

33. Создание Widgetов 1 2 3 Create Package Deploy • Design and develop the user experience • Create the XML Manifest • Transfer to device and install Distribute it on the Windows Marketplace • Package as Zip, renamed to .widget

34. Создание простого Widget(a) Виталий Дильмухаметов Marano Software Демонстрация

35. Итоги • Тенденции мобильных интерфейсов • Полупрозрачность и градиент • UI Framework • Поддержка жестов в WM 6.5 • Управляемая обертка для жестов • Создание Widgets

36. Ресурсы ENG • UI Framework: http://code.msdn.microsoft.com/uiframework • Gesture Framework: http://code.msdn.microsoft.com/gestureswm • Разработка Widgets: http://msdn.microsoft.com/en-us/library/dd721906.aspx

37. Ресурсы RUS • Руссский блог Windows Mobilehttp://blogs.msdn.com/windowsmobile_ru/ • Конкурс приложений для Windows Mobilewww.wmdev.ru

38. Вопросы Марат Бакиров http://blogs.msdn.com/mbakirov Виталий Дильмухаметов http://blogs.gotdnotnet.ru/personal/grp {Александр Яхнин} http://blogs.msdn.com/priozersk/ • Вы сможете задать вопросы докладчику в зоне «Спроси эксперта» в течение часа после завершения этого доклада