8/4/2019 ASPNET Mobile
1/34
Mobile Web Development with
Microsoft Visual Studio .NET
Malek Kemmou
CEO Arrabeta
8/4/2019 ASPNET Mobile
2/34
xmlContainer.Render()
CEO Arrabeta (consulting firm based in Casablanca
Morocco)
Newtelligence Alliance Partner
Senior Consultant and Senior Trainer
Solutions Architecture, integration, interoperability
Microsoft Regional Director for Middle East and Africa
Ineta MEA Speaker Bureau
Speaker at many conferences and events (TechEd, NDC, MDC,DevDays, DevEssentials )
8/4/2019 ASPNET Mobile
3/34
Microsoft Regional Directors
http://www.microsoft.com/rd
~140 experts from all around the world
Speaking at PDC 2004 :
Clemens Vasters (Germany) Stephen Forte (New York)
Farhan Mohammad (Minesota)
Goksin Bakir (Turkey)
Malek Kemmou (Morocco) Ahmad Badr (Egypt)
Hossam Khalifa (Egypt)
8/4/2019 ASPNET Mobile
4/34
Mobility Track
Mobile Web Development with Microsoft Visual Studio .NET
Developing Compact Framework Applications for PocketPC andSmartphone
Developing PocketPC Applications for a Semi-Connected
Environment Building Localized/Globalized Applications for Windows Mobile
Devices (Goksin Bakir)
Developing Performing Mobile Applications with the .Net CompactFramework
8/4/2019 ASPNET Mobile
5/34
Agenda
Devices today
Mobile Internet Challenges
.Net approach to devices
265 devices (Device Update 4)
Object Model and built-in controls
Extending to non supported devices
ASP.Net mobile Controls Single code base
Targeting specific devices
8/4/2019 ASPNET Mobile
6/34
Mobile Devices Today
100s of phones
Multiple PDA/XDA devices
Tablets, Mini-Tablets etc.
8/4/2019 ASPNET Mobile
7/34
.Net for devices overviewDevelopment Platform
Local CodeRemote Web Pages
Visual Studio .NET
.NET Framework
Mobile WebBrowser
.NET CompactFramework
Client-sideRich Apps
Server-sideWeb Apps
8/4/2019 ASPNET Mobile
8/34
Challenges
How many code bases do I have to maintain ? Form factors
Rendering Markups : WML1.1, 1.2, 2.0
cHTML
XHTML
HTML 3.2 / 4.0
Capabilities
Back buttons ? Cookies ?
Scripts ?
etc.
How do I add support for new devices ?
8/4/2019 ASPNET Mobile
9/34
Traditional Techniques
Reading the Request Headers
What markup
What capabilities
What Gateway capabilities
Fan out to separate code
Maybe componentize code for some reuse
Maybe code some template based rendering
8/4/2019 ASPNET Mobile
10/34
Adaptively render to devices based onbrowser, device and gateway combination
Extend ASP.NET to empower webdevelopers to build mobile webapplications
Integrates with the Visual Studio .NET
development environment for ease of use. Formerly known as Microsoft MobileInternet Toolkit.
The Solution:ASP.NET Mobile Controls
8/4/2019 ASPNET Mobile
11/34
The Solution:ASP.NET Mobile Controls
Single mobile Web page that adapts tomultiple devices
Support multiple mark-up languages
WML1.1 (WAP), cHTML 1.0, xHTML Mobileand Basic profile, HTML 3.2
Support for a variety of devices Web enabled Cell Phones, PDAs, and Pagers
Customizable and extensible framework Add new controls and devices Support for new devices without having to
rewrite or recompile your application
8/4/2019 ASPNET Mobile
12/34
Demo
Adaptive Rendering
8/4/2019 ASPNET Mobile
13/34
Mobile Web Controls
Out of the box, ASP.NET Mobile Controls Works with 265 different mobile devices out of the box (with
Device Update 4)
Is easily extensible to support additional devices
Uses basic style properties (for example: Font, font-size,forecolor) that are advisory
Used only if supported by requesting device
Ignored for down-level browsers
Gives acceptable presentation across wide range of devices for
minimum development effort Customization
Allows advanced presentation features of up-level browsersto be leveraged
Gives a richer, clearer user interface
Enhances usability for the application
8/4/2019 ASPNET Mobile
14/34
IIS
.NET FrameworkMobile Internet Toolkit
DevelopmentEnvironment ProductionEnvironment
CreateASP.NET Pages
IntegrateBusiness LogicWire-up events
Add User InterfaceElement
ASP.NET Mobile control
Post/Save toWeb Servers
HTTPRequest
Detect DeviceCapabilities
Generate output
(markup language)Based on device,
browser andgateway
combinationHTTP
Response
Load and executeASP.NET Pages
How MWC Work
8/4/2019 ASPNET Mobile
15/34
Demo
How a simple Mobile Web Form Works
8/4/2019 ASPNET Mobile
16/34
ASP.NET Mobile Controls
Object Model
MobileControl
StyleSheet
TextControl
TextView
ValidationSummary
AdRotator
Calendar
PagedControl
SelectionList
Panel
Image
Link
Label
Command
PhoneCall
BaseValidator
Form
ObjectList
List
TextBox
RequiredFieldValidator
RegularExpression
Validator
RangeValidator
CustomValidator
CompareValidator
8/4/2019 ASPNET Mobile
17/34
MobileControl
StyleSheet
TextControl
TextView
ValidationSummary
AdRotator
Calendar
PagedControl
SelectionList
Panel
Image
Link
Label
Command
PhoneCall
BaseValidator
Form
ObjectList
List
TextBox
RequiredFieldValidator
RegularExpression
Validator
RangeValidator
CustomValidator
CompareValidator
ASP.NET Mobile ControlsContainers
8/4/2019 ASPNET Mobile
18/34
Multiple forms per page
Separately addressable set ofcontrols that can be navigated
Container for other controls
Rendered as one or morescreens based on target device
Only one active form at a time
By default first form activewhen page accessed
Set via ActiveForm
ASP.NET Mobile ControlsForms
8/4/2019 ASPNET Mobile
19/34
Provides grouping for multiple controls
Single control for displaying, hiding enabling or
disabling a set of controls Applying styles to panel that are inherited by child
controls
Empty panel placeholder container for
dynamically created controls
ASP.NET Mobile ControlsPanels
8/4/2019 ASPNET Mobile
20/34
Demo
Containers
8/4/2019 ASPNET Mobile
21/34
ASP.NET Mobile ControlsText Display
Label Control Small amount of content read only text
TextBox Control Single-line input text boxes
TextView Control Exclusive to Mobile Web Controls
Large fields of text Small set of mark-up: bold, italics, page break,
paragraph, anchor tag
Support pagination
8/4/2019 ASPNET Mobile
22/34
Declared or databound list of items
Decorations: None | Bulleted | Numbered
Items can be set to act as links Static or interactive mode
Support pagination
Similar to DataList control in ASP.NET
ASP.NET Mobile ControlsLists
S C
8/4/2019 ASPNET Mobile
23/34
Strictly databound
Use to show list or table of data objects
Can view multiple fields for each data object Can associate multiple commands with each
object
Support pagination
Similar to DataGrid in ASP.NET
ASP.NET Mobile ControlsObjectList
8/4/2019 ASPNET Mobile
24/34
Demo
Text and List Display
ASP NET M bil C l
8/4/2019 ASPNET Mobile
25/34
Link Control Text-based hyperlink to another form on the
mobile page or any URL
Softkey Property
Similar HyperLink Control in ASP.NET
PhoneCall Control Exclusive to MWC
Generates mark-up for automatically calling ordisplaying phone numbers
ASP.NET Mobile ControlsControl Transfer
ASP NET M bil C l
8/4/2019 ASPNET Mobile
26/34
Like Button Control in ASP.NET
Way to invoke ASP.NET event handlersfrom UI elements
SoftkeyLabel Property
Specify text for Softkey on supporting mobilephones
ASP.NET Mobile ControlsControl Transfer
8/4/2019 ASPNET Mobile
27/34
Adding
an Unsupported DevicecanInitiateVoiceCall = "true"inputType = "telephoneKeypad"
isColor = "true"maximumRenderedPageSize = "300000"preferredImageMime = "image/jpeg"screenCharactersHeight = "13"screenCharactersWidth = "28"
8/4/2019 ASPNET Mobile
28/34
Enhances presentation, and retains samefunctionality across all devices
WML 1.1, Monochrome,
WBMP graphics
HTML 4.01, XHTML-Basic,
CSS1, Jscript, Full color,
JPG, GIF, PNG graphics
Customization Example
8/4/2019 ASPNET Mobile
29/34
Customization Process
Step 2: Create DeviceSpecific construct
In a Custom ControlDirectly in mobile.aspx
Step 1: Select device for customization
Pre-defined Filters Mobile Capabilities
Step 3: Apply customization
Directly to control Using a StyleSheet
8/4/2019 ASPNET Mobile
30/34
Demo
Customizing Rendering
S
8/4/2019 ASPNET Mobile
31/34
ASP.Net Mobile
in ASP.Net 2.0
Not separate from regular ASP.Net All ASP.Net Web Controls built for mobile device
support
Fully backward compatible Mobile Web Control based code continues to run
Warning : Doesnt make a case for one code base covering
multi-device and regular Web
Form factors targets difficult to unify Maintenance load
Can permit reuse and unified UI Processing
8/4/2019 ASPNET Mobile
32/34
Summary
Connected environment
Out of the box support for 265+ devices
Auto detection, adaptive rendering Customizable
Extensible
8/4/2019 ASPNET Mobile
33/34
Call to Action
There are 100s of millions devices outthere Great opportunities
Start using the ASP.Net Mobile Controls totarget as well low end & high end devices
Start extending Web Solutions for mobile
users Explore possibilities for disconnected
applications as well
8/4/2019 ASPNET Mobile
34/34
Questions
I will post session content on