Introduction to Mobile Development Roberto Brunetti Email: roberto@devleap. it BLog: www. Dev. Leap. it/BLog/Rob. rss www. microsoft. com/italy/msdn/studenti
Chi siamo • www. Dev. Leap. 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/Smart. Phone 2002 • Collegheremo/Scollegheremo • Qualche crash… • • • SQL Server 2000 SQL Server for Windows CE C++ e C# WML/HTML/ASP. 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 Phone Edition Smart. Phone 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 : Lap. Top 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 Desk. Top Open invitation da Desktop Aggiustare Schermo Power. Point 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 (SP 1) • 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 • p. IE 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, Smart. Card 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) • Strong. ARM, 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](https://present5.com/presentation/3aab3779fde1b8a56c1c436b442eb936/image-20.jpg "Pocket PC 2002 Applications • Connettività • • [Modem] [Scheda Wireless] [Bluetooth] [Ethernet] VPN")
Pocket PC 2002 Applications • Connettività • • [Modem] [Scheda Wireless] [Bluetooth] [Ethernet] VPN (PPTP) Terminal Services Active. Sync • “Office” • Inbox (e-mail) • Contacts, Calendar, Tasks, Notes • Excel, Word • Reader • Internet Explorer • • • HTML 3. 2 XML WAP 1. 2. 1 JScript SSL Active. X • 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 Pocket. PC con il telefono • Nasce dal Pocket. PC 2002 • Pen-based e tastiera on-screen • Touch-Pad per la composizione • • • 32 Mb ROM 32 Mb RAM Processore Strong. ARM Infrared SD slot www. microsoft. com/italy/msdn/studenti
Pocket PC Phone Edition • Foto • Dimensione schermo • Normalmente uguale a Pocket PC • Potrebbe variare da produttore www. microsoft. com/italy/msdn/studenti
Pocket PC Phone Edition • • Applicazioni del Pocket PC 2002 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 120 MHz ARM 8 MB+ RAM 16 MB Flash ROM 176 x 220 16 -bit display SD Slot No Compact Flash E’ un telefono • No touch-screen • No Stylus www. microsoft. com/italy/msdn/studenti
Smart. Phone • Foto www. microsoft. com/italy/msdn/studenti
Smartphone 2002 Applications • Telefonia! • • • Tastierino on-screen Profile Shortcut GPRS Tri-band Active. Sync • 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 • Active. Sync www. microsoft. com/italy/msdn/studenti
SP Internet Explorer • HTML 3. 2 • • • No Frames HTML 4. 0 – inner. Text, inner. HTML, accesskey No Style Sheets • WAP 1. 2. 1 • Microsoft JScript® 1. 1 • c. HTML (i-Mode) • accesskey, tel: URL • • XML / XSL Microsoft Active. X® controls SSL security Imagini: JPEG, GIF, PNG, BMP, 2 BP, 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) • Smart. Phone consente Make. Call • Le caratteristiche non sono adatte allo Smart. Phone e non sicure www. microsoft. com/italy/msdn/studenti
Smart. Phone 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 • Consumer Schermo • 240 x 320 o maggiore • 176 x 220 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 • Mobile Outlook • Web access www. microsoft. com/italy/msdn/studenti
Pocket PC vs. Smart. Phone • • Full-screen dialog, 2 Soft. Keys, 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/Blue. Tooth www. microsoft. com/italy/msdn/studenti
Installazione applicazioni • Non sono telefoni !!!! • Cambia il paradigma • Download e Install file. CAB • Security su Smart. Phone • Per prevenire download “maligni” • Installazione da Desktop • Tramite Active. Sync • 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 • WAP + WML • Alcuni HTTP + HTML • PDA • Hand. Held 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 -> Desk. Top • Porta Seriale • In dotazione sui vecchi device • Porta USB • In dotazione sui nuovi device • Porta Infrarossi • Sempre • Rete • Scheda separata oppure integrata • Active. Sync • Per sincronizzare i dati • Outlook, File System, Favorites di IE etc. . . www. microsoft. com/italy/msdn/studenti
Connettività P 2 P • Perchè • PC -> PDA per sincronizzazione dati • PDA -> Cellulare come modem (gateway) • Cavo • Vecchio stile • 1 cavo per ogni coppia di Device • Ir. DA - Infrarossi • Eliminiamo i cavi • Necessità allineamento • Bluetooth • • • Elimina i cavi Discovering / Parnership Occhio quando siete fuori. . www. microsoft. com/italy/msdn/studenti
Active. Sync • 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
Active. Sync • • • 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, 1 x. RTT) 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 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
Win. Inet e Winsock • • • Simili alle API di Windows XP Supporto Winsock 2. 0 Win. Inet • • 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 • • • 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=“card 1” title=“Prima card”> <p>Primo esempio</p> </card> </wml> Demo Nokia Demo Smart. Phone 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 • c. HTML • Compact HTML • XHTML • Utilizza regole XML per HTML • Esempio 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. 11 x), Bluetooth, MPEG 4, IRDA, 802. 3 (Ethernet), POP 3, IMAP 4, WAP, VPN, Windows Media, MP 3, RDP protocol, SMTP, SMS, LDAP, JScript 1. 2, NNTP, SSL 2, SSL 3, PCT 1. 0, SGC) • Pocket PC 2002 Phone Edition (OBEX, HTTP, HTML, WAP, CHTML, XML, WLAN, Wi-Fi (802. 11 x), Bluetooth, MPEG 4, GSM, GPRS, IRDA, 802. 3 (Ethernet), POP 3, IMAP 4, WAP, VPN, Windows Media, MP 3, RDP protocol, SMTP, SMS, LDAP, JScript 1. 2, NNTP, SSL 2, SSL 3, PCT 1. 0, SGC, GSM/GPRS, CDMA/1 x. RTT) • Smartphone 2002 (OBEX, HTTP, HTML, WAP, CHTML, XML, WLAN, Wi-Fi (802. 11 x), Bluetooth, MPEG 4, GSM, GPRS, IRDA, 802. 3 (Ethernet), POP 3, IMAP 4, WAP, VPN, Windows Media, MP 3, TAPI, Ex. TAPI, WLTS, GSM/GPRS, CDMA/1 x. RTT) 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 • • 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, c. HTML 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 Smart. Phone 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 • Lap. Top / Tablet PC • VB 6, VC++, . NET • Driver C++ • Pocket PC 2000/2002 • e. VB 3. 0, e. VC++ 3. 0, . NET • Driver e. VC++ • HPC e Palm PC (vecchi) • e. VB 3. 0, e. VC++ 3. 0 • Smart. Phone 2002 • e. VC++ 3. 0 (per adesso) • CE. NET • e. VC++ 4. 0, . NET (Pocket PC 2003 occorre SP 2) www. microsoft. com/italy/msdn/studenti
Managed. NET CF (VB. NET, C# etc. ) e. VB e. VC e e. VB Scelte Smart Client native e. VC Tempo www. microsoft. com/italy/msdn/studenti
Visual Studio. NET + Smart Device Extensions e. VC Microsoft Smartphone OS Other Windows CE Devices Notebook PCs . NET Compact Framework . NET Framework Tablet PCs SDKs Pocket PC + PPC Phone Edition … Windows CE Windows XP www. microsoft. com/italy/msdn/studenti OS SDKs Tool Scelte Smart Client
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. NET CF Smart Client ? Native (e. VC) • • • 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 codice legacy • Smart. Phone. . . 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 2. Accesso 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=“card 1” title=“Prima card”> <p>Primo esempio</p> </card> </wml> www. microsoft. com/italy/msdn/studenti
Multi. Card <? xml version=“ 1. 0”? > <!DOCTYPE wml PUBLIC. . . > <wml> <card id=“card 1” title=“Prima card”> <p>Prima</p> </card> <card id=“card 2” 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=“card 1” title=“prima card”> <p> Seleziona <anchor>vai <go href=“#card 2”/> </anchor> per navigare </p> </card> <card id=“card 2” title=“seconda card”> <p>Informazioni</p> </card> </wml> www. microsoft. com/italy/msdn/studenti
Navigazione ACCEPT <wml> <card id=“card 1” title=“prima card”> <do type=“accept” label=“Vai”> <go href=“#card 2”/> </do> <p>Seleziona <b>vai</b> per navigare</p> </card> <card id=“card 2” 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=“variab 1” value=“valore”/> • Durante la navigazione • <go href=“#card 2”><setvar. . . /></go> • Si leggono i valori con • $(variab 1) • 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=“card 1” title=“Inserimento” <do type=“accept”> <go href=“#card 2”/> </do> <p>Immetti il tuo nome: <input name=“nome”/></p> </card> <card id=“card 2 title=“Visualizzazione”> <p>Ciao $(nome)</p> </card> </wml> www. microsoft. com/italy/msdn/studenti
WMLScript • Per validare gli input • Message. Box • 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(“Id. Card”)%>” title=“<%=rs(“Titolo. Card”)%>”>. . . </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 • 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 . NET Framework ASP. NET • Integrazione con VS. NET 2002/2003 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: Net. Front 2. 0, Fujitsu F 503 i, Mitsubishi D 502 i, Mitsubishi D 503 i, NEC N 210 i, NEC N 502 i, Sony SO 503 i Ericsson 2. 0: Ericsson R 380, Ericsson R 320, Ericsson R 520 m, Ericsson T 20 s Go. America Go. Web: Compaq i. PAQ H 3650, Palm Vx, RIM Blackberry 857, RIM Blackberry 950, RIM Blackberry 957, Microsoft Mobile Explorer: Sony CMD-Z 5, Sony CMD-J 5, Benefon Q, Microsoft Pocket Internet Explorer: Casio Cassiopeia E-125, Compaq i. PAQ H 3630, Compaq i. PAQ H 3650, HP Jornada 720, Compaq i. PAQ H 3670 Nokia: Nokia 3330, Nokia 6210, Nokia 7110, Nokia 9110 i Openwave UP. Browser 3. x: Audiovox CDM-9000, Ericsson R 280 LX, Hitachi C 407 H, Kyocera QCP 2035 A, Kyocera QCP 3035, LG V 111, Mitsubishi T 250, Motorola Star. TAC 7868 W, Motorola Time. Port P 8767, Samsung SCH-6100, Samsung SCH-8500, Samsung Up. Roar M 100, Sanyo C 401 SA, Sanyo SCP-4500, Sanyo SCP-5000, Sprint Touchpoint 2200, Sprint Touchpoint 3000 Openwave UP. Browser 4. x: Alcatel One Touch 701, Audiovox CDM-135, Audiovox CDM 9100, Motorola i 1000 plus, Motorola i 2000 plus, Motorola i 50 sx, Motorola i 85 s, Motorola T 2288, Motorola Time. Port P 7382 i, Motorola Time. Port P 7389, Motorola V 100, Motorola V 120 c, Motorola V 2288, Motorola V 60 c, Siemens C 35 i, Siemens SL 45 Miscellaneous Browsers: Handspring Visor Platinum (Qualcomm Eudora Internet Suite 2. 1; Blazer 1. 0 and Omnisky 2. 1. 0. 15), IBM Work. Pad c 505 (ilinx Xiino 1. 01 J), Kyocera QCP 6035 (Qualcomm Eudora 2. 0), Nokia 9210 (Symbian Crystal 6. 0), Palm VII (My. Palm 1. 0), Palm Vx (AU-Systems 2. 12181. 1 and Omnisky 2. 0. 04), Palm m 505 (My. Palm 1. 1), Panasonic P 210 i, Panasonic P 502 i, Sharp J-SH 04 (Original Equipment Manufacturer's Version 3. 0), Sharp Zaurus MI-E 1 (Original Equipment Manufacturer's Version 6. 1), Sony CLIE PEG-N 700 C (ilinz Palmscape 4. 0 SJ), Toshiba J-T 05 (Original Equipment Manufacturer's Version 3. 0), www. microsoft. com/italy/msdn/studenti
Web Form e Mobile Web Form <Form runat="server"> <asp: Label runat=“server"> Ciao </asp: Label> </Form> Mobile Web Form <mobile: Form runat="server"> <mobile: Label runat=“server"> 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 c. HTML 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 • Text. Box 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="lnkfrm. Results" runat="server" Navigate. Url="#frm. Results">Go to Results</mobile: Link> • Phone. Call 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="cmd. Select. Product" runat="server“ softkeylabel=“Next”>Select Product</mobile: Command> • Proprietà Softkey. Label • Testo per la Soft. Key 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 Item. Command <mobile: List id=“lst. XXX" runat="server“ On. Item. Command=“lst. XXX_Command”> <Item Text=“Udine” Value=“UD” /> <Item Text=“Trento” Value=“TN” /> <Item Text=“Milano” Value=“MI” /> </mobile: List> www. microsoft. com/italy/msdn/studenti
Text. View Control • Testo lungo • Consente • Bold • Italic • Salti pagina • Paragrafi • Anchor nel testo • Supporta Paginazione www. microsoft. com/italy/msdn/studenti
List e Selection List Selection. List Object. List Databound Opzionale Obbligatorio Pagination Si No Si Decoration None, Bulleted, Numbered Dropdown, List. Box, Radio Button, Check. Box, Multi. Select Solo con Customizatio n Interactive Opzionale Si Opzionale Controlli simili Datalist in ASP. NET List. Box, Datagrid Check. Box, Check. Box. List, Radio. Button. List, www. microsoft. com/italy/msdn/studenti &
Object. List • Data. Binding • Template • • Header Footer Item Alternating. Item • Dettaglio automatico • Demo • • IE Pocket PC Nokia Smart. Phone 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 Style. Reference • 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 View. State di ASP. NET www. microsoft. com/italy/msdn/studenti
Dati • Caricamento dati da codice • Esempio con • Controllo Selection. List • Combo. Box, List. Box (anche multiselect) • Demo 10 www. microsoft. com/italy/msdn/studenti
Device Extensibility Creazione Web Form Presentation Layer (controls) 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 Produzione W A P
Device. Specific Customization Step 1: Selezionare il Device • Filtri Predefiniti • Filtri Custom Step 2: Device. Specific • Selezionare il Controllo • Taggarlo con Device. Specific Step 3: Applicare Customization Using • Property Overrides • <Choice Filter=“filtro” Proprietà=“xxx” /> • Template • <Choice Filter=“filtro”> • <Item. Template>. . . </Item. Template> • </Choice> www. microsoft. com/italy/msdn/studenti
Customization Object. List Control Header Template Item Template Alternate. Item Template Separator Template Footer Template Pocket PC Customization Item. Details 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/Device. Simulato rs. aspx? tabindex=6 www. microsoft. com/italy/msdn/studenti
Скачать презентацию Introduction to Mobile Development Roberto Brunetti Email roberto devleap
3aab3779fde1b8a56c1c436b442eb936.ppt