Friday, August 28, 2015 Beginning Mobile.NET Umer Faruq (3D Business Solutions) Mohammad Faridi (faridianslip)

Agenda  Introduction to Mobile  Design/Performance Considerations of a Mobile Application  Mobile Internet Toolkit (MIT)  Mobile Controls  MobileCapabilities 

Friday, August 28, 2015 Introduction to Mobile

 Evolution of Mobile Technology  Current Mobile Development is geared towards: – PIMs (Personal Information Manager) – PDAs (Personal Digital Assistant) – Cell Phones (Mobile Web Browsing)  2G technology – Time Division Multiple Access (TDMA) – Code Division Multiple Access (CDMA) Running at 9.6kbps – Global System for Mobile (GSM)

Introduction to Mobile  Evolution of Wireless Technology  Next Generation Mobile Development will be geared towards: – Enterprise Applications – Rich Feature Sets  2.5G technology – General Packet Radio Service (GPRS) Up to 100 kbps – Enhanced Data rates for GSM Evolution (EDGE) Up to 384 kbps

Introduction to Mobile  Wireless Application Protocol (WAP)  Wireless specifications were needed because TCP/IP was not sufficient for phones  WAP Forum was formed in 1997 by Ericsson, Nokia, Motorola and Phone.com  WAP Forum has contributed to WSP and WML as de facto standards  WAP protocol includes: – WSP (Wireless Session Protocol) - mimics what HTTP does for the web – WML (Wireless Markup Language) – mimics what HTML does for the web

Introduction to Mobile  Wireless Markup Language (WML)  WML is based on XML which means it is case sensitive and all tags must be closed  The following standards have to be met for a qualified WML file – WML files must start with the following document type declaration:

Friday, August 28, 2015 Design/Performance Considerations

Design Considerations  Limitations that affect the design:  Limited CPU Cycles  Half/Full Duplex (One/Two Way Communication)  Latency caused by SAR (Specific Absorption Rate)  Network Connectivity (Full/One Way Coverage)

Design Considerations  Things to remember during development:  Real estate (display size)  Display Quality  Available Bandwidth  Supported Protocols (WML, HTML)

Design Considerations  Two approaches to Mobile Development  Client Side – applications are device specific – have the richest UI – harder to deploy  Server Side – applications run in browsers – require internet service – easy to deploy and have less UI choices

Design Considerations  How to Layout a Wireless application:  Use the Deck of Cards concept  Transfer multiple screens at one time  User Input should be based on a Step-by-Step approach Card

Design Considerations  Best Practices:  Implement Error Recovery Mechanisms  Benchmark Time-To-Live variable  Use SSL encryption  Optimize your application for individual devices  Minimize round-trips/communication  Cookieless State Management  Disable ViewState

Performance Considerations  Factors that affect the application:  Requests per second  Time To First Byte (TTFB) and Time To Last Byte (TTLB)  Processor Use  Scalability in terms of number of clients and processors  Size response bytes

Friday, August 28, 2015 Mobile Internet Toolkit and Mobile Controls

Mobile Internet Toolkit  MIT:  writes out Standard Code (WML, HTML, cHTML)  includes Visual Development Tools  includes Debugger  provides Drag and Drop development

Mobile Internet Toolkit  MIT:  utilizes ASP.NET Pages that render on Cell Phones, Pocket PCs and Palm Browser  provides Server Side Mobile Controls  provides rich device identification mechanisms  write-once/view anywhere – Mobile pages can be consumed by web browsers as well

Mobile Internet Toolkit  Is different than regular web.config  – Markup Languages – Device Browsers – Specific Devices – Device Capabilities

Mobile Controls: Text View  Three ways to display text:  Display text Directly within a form  Use a label control – Pro – Programmatic access to the text – Con – Cannot contain HTML tags  Use a TextView Control – Pro – Programmatic access to the text – Pro – Can contain HTML tags – Cons – NONE ??

Mobile Controls: List  A Mobile List Control acts like a regular Listbox.  HTML device renders HTML Table  WML device renders List Item with a tag in b/w them  List control supports a property called Decoration:  None  Bulleted  Numbered

Mobile Controls: List  Allows binding to a DataSource such as DataSet, ArrayList, etc  Pagination is enabled by setting the Pagination property of the form  Creates next and previous links automatically  Change the ItemsAsLinks property to display each list choice as a link

Mobile Controls: PagerStyle Class  PagerStyle Class:  Controls the way the form is displayed on the browser  StyleReference property changes the presentation of the text; Values include Error, SubCommand, Title  NextPageText and PreviousPageText Properties allow changing the next and previous label text

Mobile Controls: Textbox  Very similar to the ASP.NET textbox  Does not support multi-line  Properties  Numeric (unique to WML devices) – allows user to input numeric values directly from the keypad  Password – hides critical data by showing asterisks

Mobile Controls: Validation  Validation is supported by Mobile Controls:  Compare – compares two values or does a data type check  Custom – permits user to write a custom validation function  Range – checks if the value entered falls within a specified range  Regular Expression – matches a value against a regular expression  Required Field – verifies if a value has been entered or not

Mobile Controls: Validation  Differences between Mobile and Standard Validation Controls:  Mobile Validation Summary – is placed in a separate form – has a property, formToValidate, which is set to the form that needs to be validated  No JavaScript Support – None of the controls use JavaScript to display error messages

Mobile Controls: Images  Complicated Proposition  Several different incompatible formats  Mobile devices only support bmp or wbmp  For compatibility, need to support gif and jpg  Image Control  Can detect different devices  Automatically displays the proper image file format  If image format is not supported, it displays the value assigned to AlternateText property

Mobile Control: Adrotator  Works like the ASP.NET Adrotator  Shows alternate text on WML Devices  Shows images on HTML Devices  To define the ad, use an External XML file – ImageURL – NavigateURL – AlternateText – Keyword – Impressions

Mobile Control: PhoneCall  Places phone calls on phone devices  If the device does not support calling, a label or phone number is shown  You can tie the call control to a specified phone number by setting the PhoneNumber property

Mobile Controls: Calendar  In a WML device, Calendar control renders:  a series of selections to choose a date  user can enter the date themselves  In a HTML device, Calendar control renders a regular calendar

Friday, August 28, 2015 Mobile Capabilities

 When MIT is installed, machine.config file is changed  Browser cap section is expanded  MobileControls section is added  These changes in machine.config allows you to reference System.Web.Mobile.MobileCapabilities class which gives you access to a multitude of information specific to the device

Mobile Capabilities  What does MobileCapabilities class buy you:  Browser – returns the type of browser used by the device (IE, Phone.com)  Type – returns the general type of the device (IE5, PocketIE)  PreferredRenderingType – returns the MIME type of the rendering language of the device (HTML3.2 or WML 1.1)  ScreenCharactersWidth & Height – returns the number of characters the screen can show

Mobile Capabilities  What does MobileCapabilities class buy you:  CanInitiateVoiceCall  IsColor  ActiveX  AOL  CanSendMail

Mobile Capabilities  What does MobileCapabilities class buy you:  Cookies  Frames  IsMobileDevice  JavaScript  JavaApplets

Friday, August 28, 2015 Device Specific

 DeviceSpecific tag allows you to control how things are rendered on different devices  DeviceSpecific tag can be applied at:  individual page(s)  individual form(s)  individual Control(s)  DeviceSpecific is a thought out process

Friday, August 28, 2015 Questions?