9 Aspnet Mobile

ASP.NET & MobilityASP.NET & Mobility

Roberto Brunetti Roberto Brunetti [email protected]@DevLeap.comhttp://blogs.devleap.com/robhttp://blogs.devleap.com/robhttp://thinkmobile.it/blogs/robhttp://thinkmobile.it/blogs/rob

http://blogs.devleap.com/rob

http://thinkmobile.it/blogs/rob

La sfidaLa sfida

Web Site

La sfiga La sfiga

• Device DiversiDevice Diversi• Schermi diversiSchermi diversi• Dimensioni diverseDimensioni diverse• Supporto Markup Language DiversoSupporto Markup Language Diverso• Html e Http li conosciamoHtml e Http li conosciamo• Diamo uno sguardo a Diamo uno sguardo a WML rispetto a HTMLWML rispetto a HTML

• Ricordiamoci che il WAP Gateway gira le richieste Ricordiamoci che il WAP Gateway gira le richieste in Http verso il serverin Http verso il server

Simile a HTMLSimile a HTML

<?xml version=“1.0”?><?xml version=“1.0”?><!DOCTYPE wml PUBLIC ...........><!DOCTYPE wml PUBLIC ...........><wml><wml>

<card id=“card1” title=“Prima card”><card id=“card1” title=“Prima card”>Primo esempioPrimo esempio

</card></card></wml></wml>

MultiCardMultiCard

<?xml version=“1.0”?><?xml version=“1.0”?><!DOCTYPE wml PUBLIC ...........><!DOCTYPE wml PUBLIC ...........>

<wml><wml><card id=“card1” title=“Prima card”><card id=“card1” title=“Prima card”>

PrimaPrima</card></card><card id=“card2” title=“Seconda card”><card id=“card2” title=“Seconda card”>

SecondaSeconda</card></card>

</wml></wml>

WML: Tag e ElementWML: 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

VariabiliVariabili• In HTML in quanto tale non esistono !In HTML in quanto tale non esistono !• Sono case sensitiveSono case sensitive• Si impostano conSi impostano con

• <setvar name=“variab1” value=“valore”/><setvar name=“variab1” value=“valore”/>

• Durante la navigazioneDurante la navigazione• <go href=“#card2”><setvar...../></go><go href=“#card2”><setvar...../></go>

• Si leggono i valori conSi leggono i valori con• $(variab1)$(variab1)

• Mantengono il contesto (!= HTTP)Mantengono il contesto (!= HTTP)• Se l’utente naviga interagendo con l’applicazioneSe l’utente naviga interagendo con l’applicazione• Può essere perso se naviga verso altri deck non interagendo con Può essere perso se naviga verso altri deck non interagendo con

l’applicazionel’applicazione

Torniamo al problemaTorniamo al problema

• WML e HTML sono diversiWML e HTML sono diversi• Per la gestione dei formPer la gestione dei form• Per la gestione delle variabiliPer la gestione delle variabili• In WML non esistono molti dei tag HTMLIn WML non esistono molti dei tag HTML

• Inoltre abbiamo schermi di dimensioni diversi da device a Inoltre abbiamo schermi di dimensioni diversi da device a devicedevice

• Potremmo scrivere codice che testa il device Potremmo scrivere codice che testa il device (HTTP_USER_AGENT) e si comporta di conseguenza(HTTP_USER_AGENT) e si comporta di conseguenza• Che fare per ogni nuovo device che esce ?Che fare per ogni nuovo device che esce ?• Ci potremmo fare una libreria e un file di configurazioneCi potremmo fare una libreria e un file di configurazione

ASP.NET Mobile Controls 1.1ASP.NET Mobile Controls 1.1

• Integrazione con Integrazione con VS.NET 2002/2003VS.NET 2002/2003

.NET Framework

Services Framework

ASP.NET

Common Language Runtime

System Services

Windows Forms&

.NET Compact Framework

Base Data Debug …

Web Forms

MobileWeb Forms

Web Services

• Estendono ASP.NET Estendono ASP.NET per app mobileper app mobile

• Multi-DeviceMulti-Device

• Multi-LanguageMulti-LanguageHTML/WML…HTML/WML…

Supporto Device – 250 c.a.Supporto Device – 250 c.a.• ACCESS Compact: NetFront 2.0, Fujitsu F503i, Mitsubishi D502i, Mitsubishi D503i, NEC N210i, NEC ACCESS Compact: NetFront 2.0, Fujitsu F503i, Mitsubishi D502i, Mitsubishi D503i, NEC N210i, NEC

N502i, Sony SO503iN502i, Sony SO503i• Ericsson 2.0: Ericsson R380, Ericsson R320, Ericsson R520m, Ericsson T20sEricsson 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 GoAmerica Go.Web: Compaq iPAQ H3650, Palm Vx, RIM Blackberry 857, RIM Blackberry 950, RIM

Blackberry 957, Blackberry 957, • Microsoft Mobile Explorer: Sony CMD-Z5, Sony CMD-J5, Benefon Q, Microsoft Mobile Explorer: Sony CMD-Z5, Sony CMD-J5, Benefon Q, • Microsoft Pocket Internet Explorer: Casio Cassiopeia E-125, Compaq iPAQ H3630, Compaq iPAQ Microsoft Pocket Internet Explorer: Casio Cassiopeia E-125, Compaq iPAQ H3630, Compaq iPAQ

H3650, HP Jornada 720, Compaq iPAQ H3670H3650, HP Jornada 720, Compaq iPAQ H3670• Nokia: Nokia 3330, Nokia 6210, Nokia 7110, Nokia 9110iNokia: Nokia 3330, Nokia 6210, Nokia 7110, Nokia 9110i• Openwave UP.Browser 3.x: Audiovox CDM-9000, Ericsson R280LX, Hitachi C407H, Kyocera QCP 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 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, 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, Sanyo C401SA, Sanyo SCP-4500, Sanyo SCP-5000, Sprint Touchpoint, Sprint Touchpoint 2200, Sprint Touchpoint 3000Sprint Touchpoint 3000

• Openwave UP.Browser 4.x: Alcatel One Touch 701, Audiovox CDM-135, Audiovox CDM-9100, 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 Motorola i1000plus, Motorola i2000plus, Motorola i50sx, Motorola i85s, Motorola T2288, Motorola TimePort P7382i, Motorola TimePort P7389, Motorola V100, Motorola V120c, Motorola V2288, TimePort P7382i, Motorola TimePort P7389, Motorola V100, Motorola V120c, Motorola V2288, Motorola V60c, Siemens C35i, Siemens S35i, Siemens SL45Motorola V60c, Siemens C35i, Siemens S35i, Siemens SL45

• Miscellaneous Browsers: Handspring Visor Platinum (Qualcomm Eudora Internet Suite 2.1; Blazer 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 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 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, 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 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-Equipment Manufacturer's Version 6.1), Sony CLIE PEG-N700C (ilinz Palmscape 4.0SJ), Toshiba J-T05 (Original Equipment Manufacturer's Version 3.0), T05 (Original Equipment Manufacturer's Version 3.0),

CaratteristicheCaratteristiche

• Adaptive RenderingAdaptive Rendering• Mobile ControlMobile Control

• SviluppoSviluppo• Espongono Proprieta’, Metodi, EventiEspongono Proprieta’, Metodi, Eventi

• AdapterAdapter• Producono l’OutputProducono l’Output• Un adapter per ogni tipo di “ML” da inviareUn adapter per ogni tipo di “ML” da inviare• Inviano ML correttoInviano ML corretto• Configurati nel machine.configConfigurati nel machine.config

• CustomizationCustomization• Modello estendibile per customizzare il rendering per Modello estendibile per customizzare il rendering per

un particolare deviceun particolare device

Adaptive RenderingAdaptive RenderingCalendarioCalendario

WMLWML

cHTMLcHTML HTMLHTML

CalendarCalendar

MobileMobileCapabilitiesCapabilities

HTTP RequestHTTP Request

Invio super-TABLE Invio super-TABLE HTMLHTML

Mobile.ASPXMobile.ASPX

Recupero Recupero Device AdapterDevice Adapter

Recupero info Recupero info Browser e Browser e

DeviceDeviceSelezione Selezione Device AdapterDevice Adapter

Recupero Recupero Device AdapterDevice Adapter WAPWAP

ASP.NET and IISASP.NET and IIS Invio testo WMLInvio testo WML

InizializzazioneInizializzazioneControlliControlli

Technology

9 Aspnet Mobile