Introduction to Mobile Development
Roberto Brunetti
Email: [email protected]
BLog: www.DevLeap.it/BLog/Rob.rss
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Chi siete ?
•
•
•
•
Avete mai visto un Pocket PC ?
Avete mai sviluppato in ambienti “mobile” ?
Conoscete .NET ?
Sviluppate in Visual Basic o C++ ?
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
.NET Clients
www.microsoft.com/italy/msdn/studenti
Tablet PC
www.microsoft.com/italy/msdn/studenti
Tablet PC
• Interfaccia identica a XP
• Con Ink Recogniction e EMR Stylus
• Adattabile a qualunque forma fisica
• All’interno è 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
www.microsoft.com/italy/msdn/studenti
Demo
• Internet Explorer su Tablet
• Remote Assistance
•
•
•
•
Creazione invitation da Tablet (pwd=pippo)
Salvo su DeskTop
Open invitation da Desktop
Aggiustare Schermo
• PowerPoint su Tablet PC
• Journal su Tablet PC
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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...
www.microsoft.com/italy/msdn/studenti
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)
www.microsoft.com/italy/msdn/studenti
Pocket PC
• GPS
• Marina Americana
www.microsoft.com/italy/msdn/studenti
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 l’abbiamo
• Ricorriamo ad un vecchio sistema
• CE Remote Display
• Comodo per sviluppare (Tastiera/Mouse)
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Demo Pocket PC
• Internet Explorer
• Calendar
• Contacts
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Pocket PC Phone Edition
• Foto
• Foto
• Dimensione schermo
• Normalmente uguale a Pocket PC
• Potrebbe variare da produttore a produttore
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
SmartPhone
• Foto
• Foto
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
SmartPhone Demo
• Usiamo sempre Remote Display
• Contact
• Calendar
• Operazioni One-Hand
• SD Slot
• Usare quella del Pocket PC
• Autorun all’inserimento
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Pocket PC vs. SmartPhone
• SmartPhone
•
•
•
•
Full-screen dialog, 2 SoftKeys, Menu semplici
Meno RAM
File System più piccolo
Processore più lento
• L’accoppiata vincente 
• Lo SP può fare da Modem per il Pocket PC
• Come per i cellulari tradizionali
• Connessione Cavo/Infrared/BlueTooth
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Altri Device
•
•
•
•
Nokia
Sony Ericsson
Samsung
Etc Etc
• WAP + WML
• Alcuni HTTP +
HTML
• PDA
• HandHeld PC
• Passati...
• Palm OS
•
•
•
•
•
Tante versioni
Schermi Diversi
B&W/Color
WAP + WML
HTTP + HTML
• Ancora Tastiere
www.microsoft.com/italy/msdn/studenti
Connettività
Panoramica
www.microsoft.com/italy/msdn/studenti
Device -> 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...
www.microsoft.com/italy/msdn/studenti
Connettività P2P
• Perchè
• PC -> PDA per sincronizzazione dati
• PDA -> 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....
www.microsoft.com/italy/msdn/studenti
ActiveSync
• 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
www.microsoft.com/italy/msdn/studenti
ActiveSync
•
•
•
•
•
Connection Settings
Porta Seriale
Porta Infrarosso
USB
Network
• E... Bluethooh (COM Port Emulation)
www.microsoft.com/italy/msdn/studenti
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 l’hanno a bordo
www.microsoft.com/italy/msdn/studenti
Connectivity Overview
Circuit Switched Data
(e.g. GSM, CDMA)
WAP
SMS
Cable
Replacement
Bluetooth
Packet Data (e.g.
GPRS, 1xRTT)
TCP/IP
802.11
Desktop Pass-Through
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Demo Pocket PC
• Schede di rete
• Wireless Network
• Gestione Connessioni da Connection Manager
www.microsoft.com/italy/msdn/studenti
Rob e Marco a Parigi
• Che bello il mondo wireless
• Tutto senza cavi !!!!
• Tranne l’alimentazione !!!
• Ma qualcuno ci sta già pensando...
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Stupid Windows Socket
• Applicazione 1
• Listen (es porta 7878)
• Applicazione 2
• Open Socket IP:7878
• Send “Ciao”
• Applicazione 1
• Riceve “Ciao” -> Operazione
• Reply “OK”
• Applicazione 2
• Riceve OK -> “Messaggio ricevuto”
• Scacchi ? Dama ?
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
WAP
• Protocollo applicativo End-to-End
• Ambiente application basato su Browser
www.microsoft.com/italy/msdn/studenti
WAP Application
• Un’applicazione WAP consiste
• Applicazione Server
• Applicazione Client
• L’applicazione Client viene scaricata tramite
un gateway dal Server
• L’applicazione Client può girare su dispositivi
diversi
• WAP fornisce lo standard
• Browser
• Interprete di script
www.microsoft.com/italy/msdn/studenti
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)
www.microsoft.com/italy/msdn/studenti
“Client / Server”
• L’applicazione è memorizzata su un web
server
• Il contenuto può essere
• WML
• WMLScript
• HTML
• Alcuni gateway possono eseguire la conversione
HTML->WML
• L’accesso è via URL
• Come per il web
www.microsoft.com/italy/msdn/studenti
WML simile HTML
<?xml version=“1.0”?>
<!DOCTYPE wml PUBLIC ...........>
<wml>
<card id=“card1” title=“Prima card”>
<p>Primo esempio</p>
</card>
</wml>
Demo Nokia
Demo SmartPhone
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
WAP Architettura Client
• Livelli embedded nel client
www.microsoft.com/italy/msdn/studenti
Altri Markup Language...
• ...per Interfacce utente
• HDML
• Handheld Device Markup Language
• cHTML
• Compact HTML
• XHTML
• Utilizza regole XML per HTML
• Esempio <br /> oppure <hr></hr>
• XML
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Panoramica Scenari di Sviluppo
www.microsoft.com/italy/msdn/studenti
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 !!!
www.microsoft.com/italy/msdn/studenti
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)
www.microsoft.com/italy/msdn/studenti
Server Side o Smart Client ?
Server
Side
?
Smart
Client
• Abbiamo il controllo dei Device?
• Possiamo installare e gestire i client
device?
• Quanto (ore) viene usata questa
applicazione?
• Serve un’interfaccia utente
particolare?
• L’applicazione deve lavorare
disconnessa?
• Quanto cosa la connessione?
www.microsoft.com/italy/msdn/studenti
Server Side o Smart Client !
• Server side
Server Side
?
• Supporto multi-device
• Logica Server-side
• Nessuna installazione sul
client
• Interfaccia via Browser
• Solo on-line
• Smart Client
Smart
Client
•
•
•
•
•
•
•
Versioni diverse
Logica e dati Client-side
Installazione sui client
Flessibilità interfaccia utente
Performance
Offline & Online
Utilizzo API locali
• POOM
www.microsoft.com/italy/msdn/studenti
Server-side: Tipo di App ?
Complementari
Mobile Web
• Mobile Web
es. Push URL per
“browse back”
Notification
• Notification
• Applicazioni interattive
• Interfaccia utente
• Modello di sviluppo
Web
• Device con supporto
per Browser
• Push messaggi
• SMS, IM, ecc.
• Architettura Publish /
Subscribe
• Device con e senza
supporto Browser
www.microsoft.com/italy/msdn/studenti
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 ?
www.microsoft.com/italy/msdn/studenti
Scelte Server-side
Mobile Controls, XSLT o Hand Coded
• Mobile Controls
ASP.NET,
Mobile
Controls
Mobile
Web Browse
?
Native /
XSLT
•
•
•
•
•
•
•
• Native / XSLT
•
•
•
•
•
•

Altra produttività
Gestione semplice
Supporto XML
Web Services integrati
Performance
Device Extension
Event-based
Sviluppo più complesso
Nuovo codice per nuovi device
Supporto XML (obbligatorio)
No Web Services
Utilizzo di standard
Riutilizzo ASP 3.0 e altri
ambienti
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Notification Technology
Generazione
Delivery
Subscriptions
Eventi
SQL Server:
SQL Notification
Services
Windows Server
SOAP
ecc.
Opzioni
Invio
MMIS,
.NET Alerts
SMTP
etc.
www.microsoft.com/italy/msdn/studenti
SMS
IM
SMTP
Scelte Smart Client
•
•
•
•
Piattaforma Target ?
Applicazione o Driver ?
Facilità di sviluppo o performance pure ?
Conoscenze precedenti ?
www.microsoft.com/italy/msdn/studenti
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)
www.microsoft.com/italy/msdn/studenti
Managed
.NET CF
(VB .NET, C# etc.)
eVB
eVC
eVC e eVB
Scelte Smart Client
native eVC
Tempo
www.microsoft.com/italy/msdn/studenti
Scelte Smart Client
+ Smart Device Extensions
eVC
Microsoft
Smartphone
Notebook
PCs
.NET
Compact
Framework
.NET
Framework
Tablet PCs
OS
Other
Windows CE
Devices
SDKs
Pocket PC +
PPC Phone
Edition
…
Windows CE
Windows XP
www.microsoft.com/italy/msdn/studenti
OS
SDKs
Tool
Visual Studio .NET
Quick Demo
• Visual Studio .NET
• Una semplice applicazione (SDEApp)
• Sul Pocket PC
• Modifica testo
• Ci torniamo...
www.microsoft.com/italy/msdn/studenti
Scelte Smart Client
• Managed
Managed
.NET CF
Smart
Client
?
Native (eVC)
•
•
•
•
•
•
Produttività
“Safe Programming”
Supporto Web Service
Librerie comuni
Stessi tool e API del desktop
Si utilizza per la maggioranza
dei casi
• Native
•
•
•
•
Sviluppo a basso livello
Sviluppo Real-time
Sviluppo Driver
Sviluppo wrapper per codice
legacy
• SmartPhone...per adesso
www.microsoft.com/italy/msdn/studenti
Browser
Scelte accesso ai dati
Mobile Browser
Smart client
.NET Compact
Framework
4. ADO.NET
Dati Locali
WAP, HTML
ecc.
ASP.NET,
Mobile Controls
Presentation Layer
1. XML Web
Service
XML
Web
Service
2. Accesso SQL Server
SQL Server CE
SQL Server
3. Sincronizzazione
Windows CE
(http)
Windows Server
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
Sviluppo Server-Side
Basato su Browser
www.microsoft.com/italy/msdn/studenti
La sfida
Web
Site
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
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 l’utente e il browser
• Deck = Documento
• Raggruppa le card
• Esiste una card di default
• Scaricato via url
www.microsoft.com/italy/msdn/studenti
Simile a HTML
<?xml version=“1.0”?>
<!DOCTYPE wml PUBLIC ...........>
<wml>
<card id=“card1” title=“Prima card”>
<p>Primo esempio</p>
</card>
</wml>
www.microsoft.com/italy/msdn/studenti
MultiCard
<?xml version=“1.0”?>
<!DOCTYPE wml PUBLIC ...........>
<wml>
<card id=“card1” title=“Prima card”>
<p>Prima</p>
</card>
<card id=“card2” title=“Seconda card”>
<p>Seconda</p>
</card>
</wml>
www.microsoft.com/italy/msdn/studenti
WML: Tag e Element
Deck / Card
wml, card, template, head, access, meta
Events
do, ontimer, onenter, onpick, onevent, postfield
Tasks
go, prev, refresh, noop
Variables
Setvar
User Input
input, select, option, optgroup, fieldset
Anchor
a, anchor
Image
img
Timer
timer
Text
br, p, table, tr, td
www.microsoft.com/italy/msdn/studenti
Navigazione LINK
<wml>
<card id=“card1” title=“prima card”>
<p>
Seleziona
<anchor>vai
<go href=“#card2”/>
</anchor>
per navigare
</p>
</card>
<card id=“card2” title=“seconda card”>
<p>Informazioni</p>
</card>
</wml>
www.microsoft.com/italy/msdn/studenti
Navigazione ACCEPT
<wml>
<card id=“card1” title=“prima card”>
<do type=“accept” label=“Vai”>
<go href=“#card2”/>
</do>
<p>Seleziona <b>vai</b> per navigare</p>
</card>
<card id=“card2” title=“seconda card”>
<p>Informazioni</p>
<do type="prev" label=“Indietro">
<prev/>
</do>
</card>
</wml>
www.microsoft.com/italy/msdn/studenti
Variabili
• In HTML in quanto tale non esistono !
• Sono case sensitive
• Si impostano con
• <setvar name=“variab1” value=“valore”/>
• Durante la navigazione
• <go href=“#card2”><setvar...../></go>
• Si leggono i valori con
• $(variab1)
• Mantengono il contesto (!= HTTP)
• Se l’utente naviga interagendo con l’applicazione
• Può essere perso se naviga verso altri deck non
interagendo con l’applicazione
www.microsoft.com/italy/msdn/studenti
User Input
• <input
•
•
•
•
•
•
•
•
name=“nome”
default=“valore default”
format=“inputmask”
emptyok=“true/false”
size=“dimensioneinput”
maxlength=“maxchar”
tabindex=“numero”
/>
Non Esiste in HTML
• I campi diventano/sono delle variabili
www.microsoft.com/italy/msdn/studenti
Input esempio
<wml>
<card id=“card1” title=“Inserimento”
<do type=“accept”>
<go href=“#card2”/>
</do>
<p>Immetti il tuo nome: <input name=“nome”/></p>
</card>
<card id=“card2 title=“Visualizzazione”>
<p>Ciao $(nome)</p>
</card>
</wml>
www.microsoft.com/italy/msdn/studenti
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”
www.microsoft.com/italy/msdn/studenti
Interazione con il server
<card>
<do type=“accept”>
<go href=“http://xxx” method=“get/post”>
<postfield name=“name" value="$(nome)"/>
</go>
</do>
<p> Inserisci il tuo nome <input name=“nome”/>
</p>
</card>
• GET/POST come HTML ma possiamo decidere quali
valori inviare
www.microsoft.com/italy/msdn/studenti
Server-side scripting
• Inviare WML dinamico al dispositivo
<wml>
<%While not rs.eof%>
<card id=“<%=rs(“IdCard”)%>”
title=“<%=rs(“TitoloCard”)%>”>
...
</card>
<%rs.movenext
End%>
</wml>
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
ASP.NET Mobile Controls
• Estendono ASP.NET
per applicazioni
mobile
• Integrazione con
VS.NET 2002/2003
.NET Framework
ASP.NET
Web
Forms
Mobile
Web
Forms
Web Services
• Multi-Device
• Multi-Language
HTML/WML…
Windows Forms
&
.NET Compact
Framework
Services Framework
Base
Data
Debug
…
Common Language Runtime
System Services
www.microsoft.com/italy/msdn/studenti
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 CDM9100, 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),
www.microsoft.com/italy/msdn/studenti
Web Form e Mobile Web Form
Web Form
<Form runat="server">
<asp:Label runat=“server">
Ciao Ciao
</asp:Label>
</Form>
Mobile Web Form
<mobile:Form runat="server">
<mobile:Label runat=“server">
Ciao Ciao
</mobile:Label>
</mobile:Form>
www.microsoft.com/italy/msdn/studenti
Caratteristiche
• Adaptive Rendering
• Mobile Control
• Sviluppo
• Espongono Proprieta’, Metodi, Eventi
• Adapter
• Producono l’Output
• Un adapter per ogni tipo di “ML” da inviare
• Inviano ML corretto
• Customization
• Modello estendibile per customizzare il rendering
per un particolare device
www.microsoft.com/italy/msdn/studenti
Adaptive Rendering
Calendario
Invio testo WML
ASP.NET and IIS
Mobile
Capabilities
WML
Recupero
Device
Adapter
Selezione
Device Adapter
Recupero
info Browser
e Device
Inizializzazione
Controlli
Calendar
cHTML
WAP
HTTP
Request
Recupero
Device
Adapter
HTML
Invio super-TABLE
HTML
Mobile.ASPX
www.microsoft.com/italy/msdn/studenti
Text Display Controls
• Label Control
• Piccole quantità di info – read only
• TextBox Control
• Single-line input (text box)
• Demo
• Semplice
• Trace per diverso rendering
www.microsoft.com/italy/msdn/studenti
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)
dell’applicazione Desktop
• Riutilizzando la stessa logica dell’applicazione
Desktop
www.microsoft.com/italy/msdn/studenti
Transfer Controls
• Link control
• Testo con hyperlink
• Verso un form diverso (card in WML)
• Verso una pagina diversa
• Proprietà Softkey (per telefonini)
<mobile:Link id="lnkfrmResults" runat="server"
NavigateUrl="#frmResults">Go to Results</mobile:Link>
• PhoneCall control
• Genera mark-up
• Su un telefonino con possibilità di chiamata diretta
• Su un device visualizza il numero
www.microsoft.com/italy/msdn/studenti
Transfer Controls
• Command control
• Bottone tradizionale
• Può invocare eventi server-side
<mobile:Command id="cmdSelectProduct" runat="server“
softkeylabel=“Next”>Select Product</mobile:Command>
• Proprietà SoftkeyLabel
• Testo per la SoftKey del telefonino
• Demo 03: Notare Variabili in WML
• Demo 04
www.microsoft.com/italy/msdn/studenti
List Control
• Utile per costruire Menù
• Può avere Text e Value
• Sul click viene scatenato ItemCommand
<mobile:List id=“lstXXX" runat="server“
OnItemCommand=“lstXXX_Command”>
<Item Text=“Udine” Value=“UD” />
<Item Text=“Trento” Value=“TN” />
<Item Text=“Milano” Value=“MI” />
</mobile:List>
www.microsoft.com/italy/msdn/studenti
TextView Control
• Testo lungo
• Consente
•
•
•
•
•
•
Bold
Italic
Salti pagina
Paragrafi
Anchor nel testo
Supporta Paginazione
www.microsoft.com/italy/msdn/studenti
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
Customizatio
n
Interactive
Opzionale
Si
Opzionale
Controlli simili Datalist
in ASP.NET
ListBox,
Datagrid
CheckBox,
CheckBoxList,
RadioButton,
RadioButtonLis
www.microsoft.com/italy/msdn/studenti
t, &
ObjectList
• DataBinding
• Template
•
•
•
•
Header
Footer
Item
AlternatingItem
• Dettaglio automatico
• Demo
•
•
•
•
IE
Pocket PC
Nokia
SmartPhone
www.microsoft.com/italy/msdn/studenti
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
www.microsoft.com/italy/msdn/studenti
WAP/WML batte HTTP/HTML
• Gestione input numerico
• Mantenimento valore campi e variabili crossrequest
• Tutto gestito dietro le quinte
• In HTTP/HTML non sarebbe possibile
• Entra in gioco il ViewState di ASP.NET
www.microsoft.com/italy/msdn/studenti
Dati
• Caricamento dati da codice
• Esempio con
• Controllo SelectionList
• ComboBox, ListBox (anche multiselect)
• Demo 10
www.microsoft.com/italy/msdn/studenti
Device Extensibility
Creazione
Web Form
Presentation
Layer (controls)
Device
Device
Capability
Capabilitý
aggiornato
HTTP
Request
Mobile.aspx
Business Logic
Test
Device
Invio in
Produzione
Mobile Controls
Device Adapter
generano output
HTTP
Response
Aggiunta
Device Adapters
IIS
.NET Framework 1.1
(ASP.NET)
Sviluppo
W
A
P
Produzione
www.microsoft.com/italy/msdn/studenti
DeviceSpecific Customization
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
•<Choice Filter=“filtro” Proprietà=“xxx” />
•Template
•<Choice Filter=“filtro”>
•<ItemTemplate>...</ItemTemplate>
•</Choice>
www.microsoft.com/italy/msdn/studenti
Customization
ObjectList Control
Header
Template
Item Template
AlternateItem
Template
Separator
Template
Footer
Template
Pocket PC Customization
ItemDetails
Template
www.microsoft.com/italy/msdn/studenti
Phone: Limitazioni
Emulatori disponibili
• Link verso i vari emulatori
• http://support.microsoft.com/default.aspx?s
cid=kb;en-us;320977
• http://www.asp.net/mobile/DeviceSimulato
rs.aspx?tabindex=6
www.microsoft.com/italy/msdn/studenti
Scarica

mobile:Form runat="server"