Introduction to Mobile Development

1
Introduction to Mobile Development
Roberto Brunetti Email roberto_at_devleap.it BLog
www.DevLeap.it/BLog/Rob.rss
2
Chi siamo

• www.DevLeap.it
• Un gruppo di 5 persone con tanta voglia di
• Studiare a fondo le tecnologie
• Capire il behind the scenes
• Implementare soluzioni reali
• Confrontarsi con le problematiche reali
• Sperimentare nuove idee

3
Cosa Facciamo

• Sviluppo interno
• Corsi
• Conferenze
• Seminari
• Mentoring
• Analisi e disegno di progetto
• Auditing su realizzazioni proprie o di terze
  parti
• Valutazione skill risorse umane
• Non facciamo sviluppo direttamente
• (Supporto telefonico/via email a contorno di
  altri servizi mentoring)
• Definizione di percorsi di crescita per team di
  sviluppo

4
Chi siete ?

• Avete mai visto un Pocket PC ?
• Avete mai sviluppato in ambienti mobile ?
• Conoscete .NET ?
• Sviluppate in Visual Basic o C ?

5
Agenda

• Panoramica ai dispositivi Mobile MS
• Panoramica Strumenti di sviluppo
• Panoramica Connettività e Protocolli
• Panoramica Scenari di sviluppo
• Sviluppo Web (server-side)
• Sviluppo Rich Client
• Enterprise Application
• Altri Tool attuali
• Direzioni future

6
Useremo

• Tablet PC/Pocket PC 2002/SmartPhone 2002
• Collegheremo/Scollegheremo
• Qualche crash
• SQL Server 2000
• SQL Server for Windows CE
• C e C
• WML/HTML/ASP.NET
• .NET
• Emulatori di dispositivi
• Per allargare il panorama

7
Panoramica dispositivi

• Notebook...non poteva mancare
• Tablet PC
• Smart Display Device
• Windows CE
• Pocket PC
• Pocket PC Phone Edition
• SmartPhone
• Telefonini WAP
• PDA Palm OS

8
.NET Clients
9
Tablet PC
10
Tablet PC

• Interfaccia identica a XP
• Con Ink Recogniction e EMR Stylus
• Adattabile a qualunque forma fisica
• Allinterno è un PC
• RAM Disco Fisso Schede varie - USB
• Windows XP Tablet PC Edition
• Girano tutte le applicazioni attuali
• Include .NET Framework completo
• 2 Forme
• State LapTop classico
• Convertible tastiera e penna

11
Demo

• Internet Explorer su Tablet
• Remote Assistance
• Creazione invitation da Tablet (pwdpippo)
• Salvo su DeskTop
• Open invitation da Desktop
• Aggiustare Schermo
• PowerPoint su Tablet PC
• Journal su Tablet PC

12
Smart Display (Foto)

• Stylus e touch-sensitive screen
• On-screen Keyboard
• Handwriting recogniction
• Supporto per mouse e tastiera wireless
• Accesso al PC con Windows XP (SP1)
• Via scheda wireless 802.11
• Basato su
• XP Professional
• Windows CE for Smart Device ( probabile)
• Versione CE.NET 4.1
• Add-on kit

13
Windows CE

• Sistema Operativo Real-time
• Modulare
• Si possono scegliere le componenti per creare un
  device
• 3.0
• pIE 3, Supporto Ethernet, IIS, ASP, MSMQ
• Ad oggi gli OEM hanno aggiunto
• Bluetooth, 802.x, Fingerprint
• 4.x
• Bluetooth, 802.x
• IE 5.5, WMT 8.0, Direct X 8.0
• .NET Compact Framework
• Kerberos, SSL, SmartCard

14
Varie forme

• Pocket PC 2000 (3.0)
• CE 3.0
• Pocket PC 2002
• CE 3.0 con nuova shell
• Handheld PC
• CE 2.0
• Handheld PC Pro
• CE 2.0 con applicazioni 3.0
• CE .NET (4.x)
• Pocket PC 2003 (deve uscire)
• Automazione industriale

15
Pocket PC

• Sistema operativo Windows CE 3.0
• Ogni produttore può scegliere i moduli
• Ne esistono due versioni
• Pocket PC 2000 (anche detta 3.0)
• Pocket PC 2002
• Interfaccia
• Pen e Keyboard on-screen
• Touch Screen
• Ogni produttore può inserire Hw
• Lettore Bar Code
• GPS integrato
• Applicazioni Custom
• Guscio custom
• ...nei ristoranti...

16
Hardware

• ROM 32 48
• RAM 32 64
• Processore (da 206 a 400 Mhz)
• StrongARM, Intel PXA 250, Texas OMAP 710
• Add-on
• Compact Flash
• SD Slot
• Infrared
• USB Serial
• Bluetooth
• Jacket di espansione
• Per PCMCIA (PCCard)

17
Pocket PC

• GPS
• Marina Americana

18
Per le demo con Pocket PC

• Add-on kit per Pocket PC
• Scheda VGA per proiezione esterna
• Cavo di connessione con proiettore
• Oppure wireless (con proiettore wireless)
• Noi non labbiamo
• Ricorriamo ad un vecchio sistema
• CE Remote Display
• Comodo per sviluppare (Tastiera/Mouse)

Demo CERedisp
19
Demo

• Secure Digital (SD Slot)
• Memoria aggiuntiva
• Normalmente 8 256 Mb
• Sta per uscire Panasonic SD Storage 1 Gb
• SDIO
• SD con Input / Output
• File di Video su Pocket PC
• Fingerprint

20
Pocket PC 2002 Applications

• Connettività
• Modem
• Scheda Wireless
• Bluetooth
• Ethernet
• VPN (PPTP)
• Terminal Services
• ActiveSync
• Office
• Inbox (e-mail)
• Contacts, Calendar, Tasks, Notes
• Excel, Word
• Reader

• Internet Explorer
• HTML 3.2
• XML
• WAP 1.2.1
• JScript
• SSL
• ActiveX
• MSN Instant Messenger
• Windows Media Player
• Locale e Streaming

21
Demo Pocket PC

• Internet Explorer
• Calendar
• Contacts

22
Pocket PC Phone Edition

• Integra il PocketPC con il telefono
• Nasce dal PocketPC 2002
• Pen-based e tastiera on-screen
• Touch-Pad per la composizione
• 32 Mb ROM
• 32 Mb RAM
• Processore StrongARM
• Infrared
• SD slot

23
Pocket PC Phone Edition

• Foto
• Foto
• Dimensione schermo
• Normalmente uguale a Pocket PC
• Potrebbe variare da produttore a produttore

24
Pocket PC Phone Edition

• Applicazioni del Pocket PC 2002
• SIM
• SIM Manager
• Contatti SIM (Address Book)
• SMS
• Conference Call
• Auricolare
• Multitasking si può lavorare con le applicazioni
  mentre si telefona

25
Smartphone 2002 Hardware

• Processore 120MHz ARM
• 8MB RAM
• 16MB Flash ROM
• 176x220 16-bit display
• SD Slot
• No Compact Flash
• E un telefono
• No touch-screen
• No Stylus

26
SmartPhone

• Foto
• Foto

27
Smartphone 2002 Applications

• Telefonia!
• Tastierino on-screen
• Profile
• Shortcut
• GPRS
• Tri-band
• ActiveSync
• Pocket Outlook
• Inbox (e-mail, v-mail, sms)
• Contacts
• Calendar
• Tasks

• Internet Explorer
• HTML 3.2
• XML
• WAP 1.2.1
• JScript
• SSL
• MSN Instant Messenger
• Windows Media Player
• Locale e Streaming
• ActiveSync

28
SP Internet Explorer

• HTML 3.2
• No Frames
• HTML 4.0 innerText, innerHTML, accesskey
• No Style Sheets
• WAP 1.2.1
• Microsoft JScript 1.1
• cHTML (i-Mode)
• accesskey, tel URL
• XML / XSL
• Microsoft ActiveX controls
• SSL security
• Imagini JPEG, GIF, PNG, BMP, 2BP, XBM, WBMP

29
SP Supporto WAP

• Integrazione con HTML Viewer
• WML, WBXML, WML Script, WTLS security
• Bearer (Portante)
• IP, SMS (WAP Push, SI/SL)
• WTAI (Wireless Telephony Application Interface)
• SmartPhone consente MakeCall
• Le caratteristiche non sono adatte allo
  SmartPhone e non sicure

30
SmartPhone Demo

• Usiamo sempre Remote Display
• Contact
• Calendar
• Operazioni One-Hand
• SD Slot
• Usare quella del Pocket PC
• Autorun allinserimento

31
ROM vs RAM

• ROM
• Sistema Operativo
• Aggiornabile per upgrade del S.O.
• RAM
• Per far girare le applicazioni
• Per Storage permanente
• Tranne Hard Reset
• Tranne esaurimento batteria tampone
• Sul Pocket PC Off non significa Reset
• Viene mantenuta la RAM
• Le applicazioni restano nel loro stato
• Demo Memoria su Pocket PC
• Inserire SD slot

32
Pocket PC Phone vs. Smartphone
Pocket PC Phone Edition Smartphone
Utilizzo Data centric con supporto voice Telefono con funzionalitá dati
Mercato di riferimento Mobile Professional Mobile Professional Consumer
Schermo 240x320 o maggiore 176x220 hi-res color
Input A due mani Touch screen e stylus Una mano (one-handed) Keypad e joystick
Application Tutta la suite No Pocket Word, Pocket Excel, Reader or Terminal Service Client
Priorità Mobile Outlook Web access Comunicazioni Voice e text Comunicazioni Voice e text Mobile Outlook Web access
33
Pocket PC vs. SmartPhone

• SmartPhone
• Full-screen dialog, 2 SoftKeys, Menu semplici
• Meno RAM
• File System più piccolo
• Processore più lento
• Laccoppiata vincente ?
• Lo SP può fare da Modem per il Pocket PC
• Come per i cellulari tradizionali
• Connessione Cavo/Infrared/BlueTooth

34
Installazione applicazioni

• Non sono telefoni !!!!
• Cambia il paradigma
• Download e Install file .CAB
• Security su SmartPhone
• Per prevenire download maligni
• Installazione da Desktop
• Tramite ActiveSync
• Si lancia il setup su Desktop
• Viene scaricato e installato il sw sul Device

Demo SmartPhone SD
Demo ActiveSync
35
Altri Device

• Nokia
• Sony Ericsson
• Samsung
• Etc Etc
• WAP WML
• Alcuni HTTP HTML
• Ancora Tastiere

• PDA
• HandHeld PC
• Passati...
• Palm OS
• Tante versioni
• Schermi Diversi
• BW/Color
• WAP WML
• HTTP HTML

36
Connettività

• Panoramica

37
Device -gt DeskTop

• Porta Seriale
• In dotazione sui vecchi device
• Porta USB
• In dotazione sui nuovi device
• Porta Infrarossi
• Sempre
• Rete
• Scheda separata oppure integrata
• ActiveSync
• Per sincronizzare i dati
• Outlook, File System, Favorites di IE etc...

38
Connettività P2P

• Perchè
• PC -gt PDA per sincronizzazione dati
• PDA -gt Cellulare come modem (gateway)
• Cavo
• Vecchio stile
• 1 cavo per ogni coppia di Device
• IrDA - Infrarossi
• Eliminiamo i cavi
• Necessità allineamento
• Bluetooth
• Elimina i cavi
• Discovering / Parnership
• Occhio quando siete fuori....

39
ActiveSync
Demo Options

• Per controllare la Sincronizzazione
• Calendario, Task, Email, Note
• Per passare dati e convertirli
• Word, Excel, Powerpoint
• PDF (da Adobe)
• File Audio/Video
• Ogni applicazione può montare il filtro di
  conversione
• Funge anche da Gateway per i device

Demo FileSystem
Demo Option/Rules
40
ActiveSync

• Connection Settings
• Porta Seriale
• Porta Infrarosso
• USB
• Network
• E... Bluethooh (COM Port Emulation)

Demo Connection Settings
41
Connettività Networking

• Basato su TCP/IP
• Bluetooth per PAN
• Scheda Rete
• Separata
• Vecchio stile
• Scheda Rete Wireless
• Peer-to-Peer
• Access Point
• I nuovi device costosi ce lhanno a bordo

42
Connectivity Overview
Circuit Switched Data (e.g. GSM, CDMA)
Packet Data (e.g. GPRS, 1xRTT)
WAP
SMS
TCP/IP
Cable Replacement
802.11
Bluetooth
Desktop Pass-Through
43
Firewall !

• I device navigano
• Come proteggerli ?
• Dal piu famoso produttore di Firewall
• www.checkpoint.com/products/connect/vpn-1_clients_
  wince.html
• Lavora in tandem con VPN-1 per rendere sicure
• IPSec
• NAT
• Tunneling/Encription
• LDAP
• Personal Firewalls

44
Wireless
45
Demo Pocket PC

• Schede di rete
• Wireless Network
• Gestione Connessioni da Connection Manager

46
Rob e Marco a Parigi

• Che bello il mondo wireless
• Tutto senza cavi !!!!
• Tranne lalimentazione !!!
• Ma qualcuno ci sta già pensando...

47
API

• Connessione
• Esposte da Connection Manager
• Send/Receive
• Winsock TCP/IP, Bluetooth, IRDA
• Wininet HTTP, FTP
• WAP WDP API UDP o Binary SMS
• SMS API SMS Text Sending

48
Stupid Windows Socket

• Applicazione 1
• Listen (es porta 7878)
• Applicazione 2
• Open Socket IP7878
• Send Ciao
• Applicazione 1
• Riceve Ciao -gt Operazione
• Reply OK
• Applicazione 2
• Riceve OK -gt Messaggio ricevuto
• Scacchi ? Dama ?

49
WinInet e Winsock

• Simili alle API di Windows XP
• Supporto Winsock 2.0
• WinInet
• HTTP e FTP
• Open Url
• Analizza la response
• Chimata a Connection Manager automatica

50
WAP e WML

• Conosciamo tutti Http e Html
• Spendiamo un po di tempo su WAP e WML
• Riferimento WAP Forum
• www.wapforum.org
• Definizione di
• WAP Wireless Application Protocol
• WML Wireless Markup Language
• WMLScript

51
WAP

• Protocollo applicativo End-to-End
• Ambiente application basato su Browser

52
WAP Application

• Unapplicazione WAP consiste
• Applicazione Server
• Applicazione Client
• Lapplicazione Client viene scaricata tramite un
  gateway dal Server
• Lapplicazione Client può girare su dispositivi
  diversi
• WAP fornisce lo standard
• Browser
• Interprete di script

53
Client

• Browser
• Simile a un web browser
• Interpreta WML
• Script Interpreter
• Esecuzione di applicazioni
• Interpreta WMLScript (Simile a ECMAScript)
• Set di librerie per accedere ai servizi del UA
• WML e WMLScript
• Ottimizzati per WAP
• Binary encoded (compilati)

54
Client / Server

• Lapplicazione è memorizzata su un web server
• Il contenuto può essere
• WML
• WMLScript
• HTML
• Alcuni gateway possono eseguire la conversione
  HTML-gtWML
• Laccesso è via URL
• Come per il web

55
WML simile HTML

• lt?xml version1.0?gt
• lt!DOCTYPE wml PUBLIC ...........gt
• ltwmlgt
• ltcard idcard1 titlePrima cardgt
• ltpgtPrimo esempiolt/pgt
• lt/cardgt
• lt/wmlgt
• Demo Nokia
• Demo SmartPhone

Demo WML
56
Flow

• 1 Pressione di un tasto sul telefonino
• 2 Lo user agent invia la richiesta via WAP al
  gateway
• 3 Richiesta al web server via HTTP
• 5 Normale HTTP Response
• 6 Codifica binaria e invio allo user agent

57
WAP Architettura Client

• Livelli embedded nel client

58
Altri Markup Language...

• ...per Interfacce utente
• HDML
• Handheld Device Markup Language
• cHTML
• Compact HTML
• XHTML
• Utilizza regole XML per HTML
• Esempio ltbr /gt oppure lthrgtlt/hrgt
• XML

59
Standard utilizzati oggi

• Pocket PC 2002 (OBEX, HTTP, HTML, WAP, CHTML,
  XML, WLAN, Wi-Fi (802.11x), Bluetooth, MPEG4,
  IRDA, 802.3 (Ethernet), POP3, IMAP4, WAP, VPN,
  Windows Media, MP3, RDP protocol, SMTP, SMS,
  LDAP, JScript 1.2, NNTP, SSL2, SSL3, PCT 1.0,
  SGC)
• Pocket PC 2002 Phone Edition (OBEX, HTTP, HTML,
  WAP, CHTML, XML, WLAN, Wi-Fi (802.11x),
  Bluetooth, MPEG4, GSM, GPRS, IRDA, 802.3
  (Ethernet), POP3, IMAP4, WAP, VPN, Windows Media,
  MP3, RDP protocol, SMTP, SMS, LDAP, JScript 1.2,
  NNTP, SSL2, SSL3, PCT 1.0, SGC, GSM/GPRS,
  CDMA/1xRTT)
• Smartphone 2002 (OBEX, HTTP, HTML, WAP, CHTML,
  XML, WLAN, Wi-Fi (802.11x), Bluetooth, MPEG4,
  GSM, GPRS, IRDA, 802.3 (Ethernet), POP3, IMAP4,
  WAP, VPN, Windows Media, MP3, TAPI, ExTAPI, WLTS,
  GSM/GPRS, CDMA/1xRTT)

Nota Lista incompleta
60
Panoramica Scenari di Sviluppo
61
Scenari

• Utilizzo di Terminal Service
• Impatto zero sul Device
• Solo per Pocket PC
• Utilizzo di Internet Explorer
• Impatto zero sul Device
• Applicazione sul Device
• Installazione sul Device
• Semplice o complessa che sia
• Scenari
• Utilizzo del Web Request
• Vecchio stile
• Utilizzo di XML
• Vecchio Stile
• Utilizzo di Web Service !!!
• Download e uso dei dati sul device !!!

62
Decisioni

• Server Side o Smart Client
• Tecnolgie Server Side
• Mobile Web
• Notification
• Tecnologie Smart Client
• Managed o Native Client Code
• Strategia accesso ai dati
• XML Web service
• SQL Merge Replication
• SQL Remote Data Access (RDA)

63
Server Side o Smart Client ?

• Abbiamo il controllo dei Device?
• Possiamo installare e gestire i client device?
• Quanto (ore) viene usata questa applicazione?
• Serve uninterfaccia utente particolare?
• Lapplicazione deve lavorare disconnessa?
• Quanto cosa la connessione?

Server Side
?
SmartClient
64
Server Side o Smart Client !

• Server side
• Supporto multi-device
• Logica Server-side
• Nessuna installazione sul client
• Interfaccia via Browser
• Solo on-line

Server Side
?

• Smart Client
• Versioni diverse
• Logica e dati Client-side
• Installazione sui client
• Flessibilità interfaccia utente
• Performance
• Offline Online
• Utilizzo API locali
• POOM

SmartClient
65
Server-side Tipo di App ?
Complementaries. Push URL per browse back
Notification
Mobile Web

• Mobile Web
• Applicazioni interattive
• Interfaccia utente
• Modello di sviluppo Web
• Device con supporto per Browser

• Notification
• Push messaggi
• SMS, IM, ecc.
• Architettura Publish / Subscribe
• Device con e senza supporto Browser

66
Mobile Web

• HTML, WML, HDML, cHTML o XHTML ?
• Se HTML, quale versione ?
• 3.2 supportata da molti device ?
• 4.0 supportata da alcuni
• Uso Javascript lato client ?
• Sarebbe bello ma non funziona su tutti i device
• Due opzioni
• Usiamo il minimo comune denominatore
• Adattiamo il rendering per vari device
• ...e quando ne esce uno nuovo ?

67
Scelte Server-sideMobile Controls, XSLT o Hand
Coded
?

• Mobile Controls
• Altra produttività
• Gestione semplice
• Supporto XML
• Web Services integrati
• Performance
• Device Extension
• Event-based

ASP.NET, Mobile Controls
?
Mobile Web Browse

• Native / XSLT
• Sviluppo più complesso
• Nuovo codice per nuovi device
• Supporto XML (obbligatorio)
• No Web Services
• Utilizzo di standard
• Riutilizzo ASP 3.0 e altri ambienti

Native / XSLT
68
Quick Demo

• Mobile Control Adaptive Rendering
• Calendario Una roba complessa !!!
• Internet Explorer Tablet PC (o PC)
• IE su Pocket PC
• IE su SmartPhone
• Nokia Mobile Internet Toolkit
• Microsoft Mobile Explorer
• .. Ci torniamo

69
Notification Technology
Generazione
Delivery
Subscriptions
OpzioniInvio MMIS, .NET AlertsSMTP etc.
SQL ServerSQL Notification Services
SMS
Eventi
SOAPecc.
IM
Windows Server
SMTP
70
Scelte Smart Client

• Piattaforma Target ?
• Applicazione o Driver ?
• Facilità di sviluppo o performance pure ?
• Conoscenze precedenti ?

71
Piattaforma client

• LapTop / Tablet PC
• VB 6, VC, .NET
• Driver C
• Pocket PC 2000/2002
• eVB 3.0, eVC 3.0, .NET
• Driver eVC
• HPC e Palm PC (vecchi)
• eVB 3.0, eVC 3.0
• SmartPhone 2002
• eVC 3.0 (per adesso)
• CE.NET
• eVC 4.0, .NET (Pocket PC 2003 occorre SP2)

72
Scelte Smart Client
Managed .NET CF (VB .NET, C etc.)
eVB
eVC e eVB
native eVC
eVC
Tempo
73
Scelte Smart Client
Visual Studio .NET
Smart Device Extensions
Tool
eVC
Notebook PCs
.NET Framework
Pocket PC PPC Phone Edition
.NET Compact Framework
Tablet PCs
SDKs
SDKs
MicrosoftSmartphone

Other Windows CE Devices
Windows CE
Windows XP
OS
OS
74
Quick Demo

• Visual Studio .NET
• Una semplice applicazione (SDEApp)
• Sul Pocket PC
• Modifica testo
• Ci torniamo...

75
Scelte Smart Client

• Managed
• Produttività
• Safe Programming
• Supporto Web Service
• Librerie comuni
• Stessi tool e API del desktop
• Si utilizza per la maggioranza dei casi

Managed.NET CF
?
Smart Client

• Native
• Sviluppo a basso livello
• Sviluppo Real-time
• Sviluppo Driver
• Sviluppo wrapper per codice legacy
• SmartPhone...per adesso

Native (eVC)
76
Scelte accesso ai dati
WAP, HTML ecc.
ASP.NET, Mobile Controls Presentation Layer
Mobile Browser
Browser
1. XML Web Service
XML Web Service
.NET Compact Framework
4. ADO.NETDati Locali
2. Accesso SQL Server
Smart client
SQL Server CE
SQL Server
3. Sincronizzazione(http)
Windows CE
Windows Server
77
Scelte Accesso ai Dati

• 1. XML Web services
• Riutilizzo Web service (desktop, mobile web ecc.)
• Incapsulamento Business Logic
• 2. Direct SQL Server
• Più semplice per applicazioni sempre on-line
• 3. SQL Server CE Synch
• Utilizzo di dati locali
• Sincronizzazione auto/granulare dei dati
• Applicazioni Off-line
• 4. Local data access
• Utilizzo di store locale per applicazioni
  Off-line
• Utilizzo ADO .NET, SQL Server CE, XML

78
Sviluppo Server-Side

• Basato su Browser

79
La sfida
Web Site
80
La sfiga ?

• Device Diversi
• Schermi diversi
• Dimensioni diverse
• Supporto Markup Language Diverso
• Html e Http li conosciamo
• Diamo uno sguardo a WML rispetto a HTML
• Ricordiamoci che il WAP Gateway gira le richieste
  in Http verso il server

81
WML

• E un documento XML
• Rigoroso
• Case sensitive (xml è minuscolo)
• Well formed /Valid
• www.wapforum.org/DTD/wml_1.1.xml
• Card Unità base
• Singola interazione fra lutente e il browser
• Deck Documento
• Raggruppa le card
• Esiste una card di default
• Scaricato via url

82
Simile a HTML

• lt?xml version1.0?gt
• lt!DOCTYPE wml PUBLIC ...........gt
• ltwmlgt
• ltcard idcard1 titlePrima cardgt
• ltpgtPrimo esempiolt/pgt
• lt/cardgt
• lt/wmlgt

Demo WML/01
83
MultiCard

• lt?xml version1.0?gt
• lt!DOCTYPE wml PUBLIC ...........gt
• ltwmlgt
• ltcard idcard1 titlePrima cardgt
• ltpgtPrimalt/pgt
• lt/cardgt
• ltcard idcard2 titleSeconda cardgt
• ltpgtSecondalt/pgt
• lt/cardgt
• lt/wmlgt

84
WML Tag e Element
Deck / Card Events Tasks Variables User
Input Anchor Image Timer Text
wml, card, template, head, access, meta do,
ontimer, onenter, onpick, onevent, postfield go,
prev, refresh, noop Setvar input, select, option,
optgroup, fieldset a, anchor img timer br, p,
table, tr, td
85
Navigazione LINK

• ltwmlgt
• ltcard idcard1 titleprima cardgt
• ltpgt
• Seleziona
• ltanchorgtvai
• ltgo hrefcard2/gt
• lt/anchorgt
• per navigare
• lt/pgt
• lt/cardgt
• ltcard idcard2 titleseconda cardgt
• ltpgtInformazionilt/pgt
• lt/cardgt
• lt/wmlgt

Demo WML/02
86
Navigazione ACCEPT

• ltwmlgt
• ltcard idcard1 titleprima cardgt
• ltdo typeaccept labelVaigt
• ltgo hrefcard2/gt
• lt/dogt
• ltpgtSeleziona ltbgtvailt/bgt per navigarelt/pgt
• lt/cardgt
• ltcard idcard2 titleseconda cardgt
• ltpgtInformazionilt/pgt
• ltdo type"prev" labelIndietro"gt
• ltprev/gt
• lt/dogt
• lt/cardgt
• lt/wmlgt

Demo WML/03
87
Variabili

• In HTML in quanto tale non esistono !
• Sono case sensitive
• Si impostano con
• ltsetvar namevariab1 valuevalore/gt
• Durante la navigazione
• ltgo hrefcard2gtltsetvar...../gtlt/gogt
• Si leggono i valori con
• (variab1)
• Mantengono il contesto (! HTTP)
• Se lutente naviga interagendo con lapplicazione
• Può essere perso se naviga verso altri deck non
  interagendo con lapplicazione

88
User Input

• ltinput
• namenome
• defaultvalore default
• formatinputmask
• emptyoktrue/false
• sizedimensioneinput
• maxlengthmaxchar
• tabindexnumero
• /gt
• I campi diventano/sono delle variabili

Non Esiste in HTML
89
Input esempio

• ltwmlgt
• ltcard idcard1 titleInserimento
• ltdo typeacceptgt
• ltgo hrefcard2/gt
• lt/dogt
• ltpgtImmetti il tuo nome ltinput
  namenome/gtlt/pgt
• lt/cardgt
• ltcard idcard2 titleVisualizzazionegt
• ltpgtCiao (nome)lt/pgt
• lt/cardgt
• lt/wmlgt

Demo WML/04
90
WMLScript

• Per validare gli input
• MessageBox
• Interazione con lo user agent
• Invio di chiamate
• Invio di SMS
• Address Book telefono
• Address Book SIM
• Può sfruttare caratteristiche specifiche del
  device...come per i browser
• E standard compreso nella specifica WAP
• Diverso da HTML dove è a cura del browser

91
Interazione con il server

• ltcardgt
• ltdo typeacceptgt
• ltgo hrefhttp//xxx methodget/postgt
• ltpostfield namename" value"(nome)"/gt
• lt/gogt
• lt/dogt
• ltpgt Inserisci il tuo nome ltinput namenome/gt
• lt/pgt
• lt/cardgt
• GET/POST come HTML ma possiamo decidere quali
  valori inviare

92
Server-side scripting

• Inviare WML dinamico al dispositivo
• ltwmlgt
• ltWhile not rs.eofgt
• ltcard idltrs(IdCard)gt titleltrs(T
  itoloCard)gtgt
• ...
• lt/cardgt
• ltrs.movenext
• Endgt
• lt/wmlgt

93
Torniamo al problema

• WML e HTML sono diversi
• Per la gestione dei form
• Per la gestione delle variabili
• In WML non esistono molti dei tag HTML
• Inoltre abbiamo schermi di dimensioni diversi da
  device a device
• Potremmo scrivere codice che testa il device
  (HTTP_USER_AGENT) e si comporta di conseguenza
• Che fare per ogni nuovo device che esce ?
• Ci potremmo fare una libreria e un file di
  configurazione

Trace
94
ASP.NET Mobile Controls

• Estendono ASP.NET per applicazioni mobile

• Integrazione con VS.NET 2002/2003

• Multi-Device
• Multi-LanguageHTML/WML

95
Supporto Device 200 c.a.

• ACCESS Compact NetFront 2.0, Fujitsu F503i,
  Mitsubishi D502i, Mitsubishi D503i, NEC N210i,
  NEC N502i, Sony SO503i
• Ericsson 2.0 Ericsson R380, Ericsson R320,
  Ericsson R520m, Ericsson T20s
• GoAmerica Go.Web Compaq iPAQ H3650, Palm Vx, RIM
  Blackberry 857, RIM Blackberry 950, RIM
  Blackberry 957,
• Microsoft Mobile Explorer Sony CMD-Z5, Sony
  CMD-J5, Benefon Q,
• Microsoft Pocket Internet Explorer Casio
  Cassiopeia E-125, Compaq iPAQ H3630, Compaq iPAQ
  H3650, HP Jornada 720, Compaq iPAQ H3670
• Nokia Nokia 3330, Nokia 6210, Nokia 7110, Nokia
  9110i
• Openwave UP.Browser 3.x Audiovox CDM-9000,
  Ericsson R280LX, Hitachi C407H, Kyocera QCP
  2035A, Kyocera QCP 3035, LG V111, Mitsubishi
  T250, Motorola StarTAC 7868W, Motorola TimePort
  P8767, Samsung SCH-6100, Samsung SCH-850, Samsung
  SCH-8500, Samsung UpRoar M100, Sanyo C401SA,
  Sanyo SCP-4500, Sanyo SCP-5000, Sprint
  Touchpoint, Sprint Touchpoint 2200, Sprint
  Touchpoint 3000
• Openwave UP.Browser 4.x Alcatel One Touch 701,
  Audiovox CDM-135, Audiovox CDM-9100, Motorola
  i1000plus, Motorola i2000plus, Motorola i50sx,
  Motorola i85s, Motorola T2288, Motorola TimePort
  P7382i, Motorola TimePort P7389, Motorola V100,
  Motorola V120c, Motorola V2288, Motorola V60c,
  Siemens C35i, Siemens S35i, Siemens SL45
• Miscellaneous Browsers Handspring Visor Platinum
  (Qualcomm Eudora Internet Suite 2.1 Blazer 1.0
  and Omnisky 2.1.0.15), IBM WorkPad c505 (ilinx
  Xiino 1.01J), Kyocera QCP 6035 (Qualcomm Eudora
  2.0), Nokia 9210 (Symbian Crystal 6.0), Palm VII
  (MyPalm 1.0), Palm Vx (AU-Systems 2.12181.1 and
  Omnisky 2.0.04), Palm m505 (MyPalm 1.1),
  Panasonic P210i, Panasonic P502i, Sharp J-SH04
  (Original Equipment Manufacturer's Version 3.0),
  Sharp Zaurus MI-E1 (Original Equipment
  Manufacturer's Version 6.1), Sony CLIE PEG-N700C
  (ilinz Palmscape 4.0SJ), Toshiba J-T05 (Original
  Equipment Manufacturer's Version 3.0),

Machine.Config
96
Web Form e Mobile Web Form
Web Form
ltForm runat"server"gt ltaspLabel
runatserver"gt Ciao Ciao
lt/aspLabelgt lt/Formgt

• Mobile Web Form

ltmobileForm runat"server"gt ltmobileLabel
runatserver"gt Ciao Ciao lt/mobileLabelgt lt/mob
ileFormgt
97
Caratteristiche

• Adaptive Rendering
• Mobile Control
• Sviluppo
• Espongono Proprieta, Metodi, Eventi
• Adapter
• Producono lOutput
• Un adapter per ogni tipo di ML da inviare
• Inviano ML corretto
• Customization
• Modello estendibile per customizzare il rendering
  per un particolare device

98
Adaptive RenderingCalendario
ASP.NET and IIS
Mobile Capabilities
WML
WAP
HTTP Request
Calendar
cHTML
HTML
Mobile.ASPX
99
Text Display Controls

• Label Control
• Piccole quantità di info read only
• TextBox Control
• Single-line input (text box)
• Demo
• Semplice
• Trace per diverso rendering

Demo 01
100
Navigazione

• Una pagina ASP.NET tradizionale contiene un solo
  form
• I device possono avere schermi ridottissimi
• Si possono costruire più form nella stessa pagina
• Evitando di avere tante pagine minuscole sul
  sito
• Utilizzando gli stesse entità (nomi di pagine)
  dellapplicazione Desktop
• Riutilizzando la stessa logica dellapplicazione
  Desktop

101
Transfer Controls

• Link control
• Testo con hyperlink
• Verso un form diverso (card in WML)
• Verso una pagina diversa
• Proprietà Softkey (per telefonini)
• PhoneCall control
• Genera mark-up
• Su un telefonino con possibilità di chiamata
  diretta
• Su un device visualizza il numero

Demo 02
ltmobileLink id"lnkfrmResults" runat"server"
NavigateUrl"frmResults"gtGo to
Resultslt/mobileLinkgt
Demo 12
102
Transfer Controls

• Command control
• Bottone tradizionale
• Può invocare eventi server-side
• Proprietà SoftkeyLabel
• Testo per la SoftKey del telefonino
• Demo 03 Notare Variabili in WML
• Demo 04

ltmobileCommand id"cmdSelectProduct"
runat"server softkeylabelNextgtSelect
Productlt/mobileCommandgt
103
List Control
Demo 05

• Utile per costruire Menù
• Può avere Text e Value
• Sul click viene scatenato ItemCommand

ltmobileList idlstXXX" runat"server
OnItemCommandlstXXX_Commandgt ltItem
TextUdine ValueUD /gt ltItem TextTrento
ValueTN /gt ltItem TextMilano ValueMI
/gt lt/mobileListgt
104
TextView Control

• Testo lungo
• Consente
• Bold
• Italic
• Salti pagina
• Paragrafi
• Anchor nel testo
• Supporta Paginazione

Demo 06
105
List e Selection List
List SelectionList ObjectList
Databound Opzionale Opzionale Obbligatorio
Pagination Si No Si
Decoration None, Bulleted, Numbered Dropdown, ListBox, Radio Button, CheckBox, MultiSelect Solo con Customization
Interactive Opzionale Si Opzionale
Controlli simili in ASP.NET Datalist ListBox, CheckBox, CheckBoxList, RadioButton, RadioButtonList, DropDownList Datagrid
106
ObjectList

• DataBinding
• Template
• Header
• Footer
• Item
• AlternatingItem
• Dettaglio automatico
• Demo
• IE
• Pocket PC
• Nokia
• SmartPhone

Demo Campeggi
107
Un po di stile

• Aggiungere un po di informazioni di style
• 3 stili predefiniti
• title
• Error
• Subcommand
• Associabili con StyleReference
• Demo 07
• Estendibile con propri stili

108
WAP/WML batte HTTP/HTML

• Gestione input numerico
• Mantenimento valore campi e variabili
  cross-request
• Tutto gestito dietro le quinte
• In HTTP/HTML non sarebbe possibile
• Entra in gioco il ViewState di ASP.NET

Demo 08 da Nokia
109
Dati

• Caricamento dati da codice
• Esempio con
• Controllo SelectionList
• ComboBox, ListBox (anche multiselect)
• Demo 10

110
Device Extensibility
IIS .NET Framework 1.1 (ASP.NET)
CreazioneWeb Form
Device Capabilityaggiornato
HTTP Request
Device Capabilitý
Presentation Layer (controls)
Mobile.aspx
Business Logic
Mobile Controls Device Adaptergenerano output
Test Device
HTTP Response
Invio inProduzione
Aggiunta Device Adapters
Sviluppo
Machine.Config
Produzione
111
DeviceSpecific Customization
Demo 11

• Step 1 Selezionare il Device
• Filtri Predefiniti
• Filtri Custom

• Step 2 DeviceSpecific
• Selezionare il Controllo
• Taggarlo con DeviceSpecific

• Step 3 Applicare Customization Using
• Property Overrides
• ltChoice Filterfiltro Proprietàxxx /gt
• Template
• ltChoice Filterfiltrogt
• ltItemTemplategt...lt/ItemTemplategt
• lt/Choicegt

112
Customization

• ObjectList Control

Header Template
Item Template
AlternateItem Template
Separator Template
Footer Template
ItemDetails Template
Phone Limitazioni
Pocket PC Customization
113
Emulatori disponibili

• Link verso i vari emulatori
• http//support.microsoft.com/default.aspx?scidkb
  en-us320977
• http//www.asp.net/mobile/DeviceSimulators.aspx?ta
  bindex6