1. Working in a Mobile App Development Environment Lesson 2

2. Exam Objective Matrix Skills/ConceptsMTA Exam Objectives Working with Developer ToolsWorking with developer tools. (3.4) Understanding Design for Mobile Devices Designing for mobile devices. (3.1)

3. Working with Developer Tools Platform-specific –Visual Studio Express for Windows Phone –iOS SDK for Apple iPhones Multiplatform –PhoneGap HTML5 JavaScript –Rhodes Open source Ruby-based framework

4. Using Visual Studio 2010 Express Open project files in Solution Explorer Modify in Code Editor Design Surface resembles phone skin Toolbox provides controls Configure settings through Application Pane Check for build and runtime errors Create a release build

5. Main Window in Visual Studio 2010 Express for Windows Phone

6. Application Pane

7. New Project Dialog Box in Visual Studio IDE

8. Selecting a Template

9. Selecting a Windows Phone Version

10. Microsoft.NET Framework Features –Common Language Runtime (CLR) –Base Class Libraries (BCL) ADO.NET ASP.NET Windows Presentation Foundation (WPF) Windows Workflow Foundation (WF) Windows Communication Foundation (WCF) Windows Forms Data access.NET Compact Framework.NET Micro Framework

11. .NET Framework Developer Center Main Web Page

12. Describing and Defining Mobile Design Concepts Metro style provides consistent user interfaces (UIs) Common UI elements –Start screen –Application Bar (usually icons but may contain text labels) –Status Bar (system-level information) –Hardware buttons (i.e., Power, Start, Volume, Back, Search) Location is device dependent

13. Example of Proper Sizing and Spacing

14. Example of an Application Bar

15. Default Hardware Buttons

16. MyFirstApp in the Visual Studio IDE

17. Changing the Name of a Control

18. Adjusting the Button Control

19. Adjusting the Size of the WebBrowser Control

20. The Web Browser App UI

21. Describing and Defining Localization and Globalization Localization –Process of translating text strings into other languages –Achieved by storing resources in resource-only files (separate from application code) Globalization –Process of making an application language- neutral –App presents data as format specific to user’s locale or culture

22. A List of Resource-only Files in the Visual Studio IDE

23. Adding a String to the Localization Table

24. Verifying the Neutral Language

25. Opening MyFirstApp.csproj in Notepad

26. Optimizing Mobile Applications Important factors to consider –Startup time –Responsiveness to user Explore development tips for app optimization

27. Development Tips for Optimized Apps Application startup –Create duplicate splash screens with limited display time –Break into smaller assemblies that load only if needed Images –Use JPG format for opaque –Use PNG format for transparent –Limit maximum image size

28. Development Tips for Optimized Apps (cont.) Content and resource files –Resource files reduce performance –Set read-only files to Content Progress bar –Use PerformanceProgressBar control instead of ProgressBar Storage bar –Clear temporary data –Give users option to delete user-created data

29. Selecting to Profile Execution Performance Data in the Application

30. Profiling Results

31. More Information about Profiled Performance Data

32. Asynchronous Programming/Threading Enables multiple tasks to be processed at same time Shares threads Creates discontinuous execution (activities are split) Greatly improves application performance

33. Object-Oriented Programming (OOP) Everything grouped as objects Increases code re-use and decreases code maintenance –Encapsulation Groups properties and methods together –Polymorphism Ability to substitute one class for another –Inheritance Ability to create new classes based on existing

34. Model View ViewModel (MVVM) A design pattern which separates the UI from a database Is an example of separation of concerns Allows testing of application’s back-end separate from the UI Enables efficient re-use of code Allows for separate development of back- end and UI

35. The MVVM Model with Integrated Services ModelViewModelView Services

36. Model View ViewModel (MVVM) (continued) Model –Describes application domain View –The application UI ViewModel –Middleman between Model and View –Accomplishes data capture and transfer through services, or service agents.

37. Recap Designing for mobile devices Describing and defining mobile design concepts Describing and defining globalization and localization Optimizing mobile applications Understanding asynchronous programming/threading Understanding object-oriented programming (OOP) Understanding Model View ViewModel (MVVM)