Upload
caterina-sacchi
View
224
Download
5
Embed Size (px)
Citation preview
DevLeap Pure .NET Training
Introduction to .NET Framework
Introduction to .NET Framework
Architecting Apps in .NET
Architecting Apps in .NET
Introduction toWeb Services
Introduction toWeb Services
Introduction to ASP.NET
Introduction to ASP.NET
Introduction to ADO.NET
Introduction to ADO.NET
Core ASP.NETCore ASP.NETCore ADO.NETCore ADO.NET CoreWeb Services
CoreWeb Services
Core .NET FrameworkCore .NET Framework
SOA Serviceswith WSE2
SOA Serviceswith WSE2
ASP.NET 2.0Preview/Core/Upgrade
ASP.NET 2.0Preview/Core/Upgrade
Intro toMobility Dev
Intro toMobility Dev
AdvancedMobility DevAdvanced
Mobility Dev
DevLeap Training
Sharepoint 2003 Development
Sharepoint 2003 Development
Data Warehouse e DTS
Data Warehouse e DTS
OLAP Analysis Services
OLAP Analysis Services
Longhorn Preview
Longhorn Preview
WinFXPreviewWinFX
Preview
WCF (Indigo) Preview
WCF (Indigo) Preview
SQL 2005 PreviewSQL 2005 Preview
Introduction to ASP.NET
Introduction to ASP.NET
WPF (Avalon) Preview
WPF (Avalon) Preview
SQL 2005 Analysis Services Preview
SQL 2005 Analysis Services Preview
SQL Server Reporting Services
SQL Server Reporting Services
VSTS for Technicians
VSTS for Technicians
ThinkMobile.it
Il 12/7/2005 ho aperto il sitoObiettivo: creare la comunità italiana per lo sviluppo in .NET su dispositivi Mobile
.NET Compact FrameworkSQL Server for Windows CERepliche dei datiApplicazioni Server-side
Blogs – Forum
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 Socket o Web Request - Vecchio stile Utilizzo di XML - Vecchio Stile Utilizzo di Web Service !!! Download e uso dei dati sul device !!!
La sfida
Web SiteWeb Site
Problematiche
Device DiversiSchermi diversiDimensioni diverseSupporto Markup Language Diverso
WML, HTML, XHTML, cHTML, HDML
WAP Gateway gira le richieste in Http verso il server
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 ?
Altra problematica
WML e HTML sono diversi ! Per la gestione dei form Per la gestione delle variabili In WML non esistono molti dei tag HTML
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
Mobile Controls Altra produttività Gestione semplice Supporto XML Web Services integrati Performance Device Extension Event-based
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
ASP.NET, ASP.NET, Mobile Mobile ControlsControls
Native / Native / XSLTXSLT
Mobile Mobile Web BrowseWeb Browse ??
Scelte Server-side
Mobile Controls, XSLT o Hand Coded
ASP.NET Mobile Controls 1.1
Integrazione con VS.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 per applicazioni mobile
Multi-Device
Multi-LanguageHTML/WML…
Supporto Device – 250 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),
Caratteristiche
Adaptive RenderingMobile Control
Sviluppo Espongono Proprieta’, Metodi, Eventi
Adapter Producono l’Output Un adapter per ogni tipo di “ML” da inviare Inviano ML corretto Configurati nel machine.config
CustomizationModello estendibile per customizzare il rendering per un
particolare device
Adaptive RenderingCalendario
WMLWML
cHTMLcHTML HTMLHTML
CalendarCalendar
MobileMobileCapabilitiesCapabilities
HTTP RequestHTTP Request
Invio super-TABLE Invio super-TABLE HTMLHTML
Mobile.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
Web Form e Mobile Web Form
Mobile Web Form
<<mobilemobile:Form runat="server">:Form runat="server"><<mobilemobile:Label runat=“server">:Label runat=“server">
Ciao CiaoCiao Ciao</</mobilemobile:Label>:Label>
</</mobilemobile:Form>:Form>
<Form runat="server"><Form runat="server"><<aspasp:Label runat=“server">:Label runat=“server">
Ciao CiaoCiao Ciao </</aspasp:Label>:Label></Form></Form>
Web FormWeb Form
Text Display Controls
Label ControlPiccole quantità di info – read only
TextBox ControlSingle-line input (text box)
DemoSempliceTrace per diverso rendering
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
Transfer Controls
Link control Testo con hyperlink
Verso un form diverso (card in WML) Verso una pagina diversa
Proprietà SoftkeyLabel (per telefonini)
<mobile:Link id="lnkfrmResults" runat="server" <mobile:Link id="lnkfrmResults" runat="server" NavigateUrl="#frmResults">Go to Results</mobile:Link>NavigateUrl="#frmResults">Go to Results</mobile:Link>
Transfer Controls
Command controlBottone tradizionalePuò invocare eventi server-side
Demo 03Demo 04
<mobile:Command id="cmdSelectProduct" runat="server“ <mobile:Command id="cmdSelectProduct" runat="server“ softkeylabel=“Next”>Select Product</mobile:Command>softkeylabel=“Next”>Select Product</mobile:Command>
Phone Call
PhoneCall controlSu browser o Pocket PC
Visualizza il numeroGenera solo il testo
Sul un PPC Phone, SPChiamata direttaA HREF verso il numero
Su WAPChiamata direttaTag WML per la chiamata
List Control
Utile per costruire MenùPuò avere Text e ValueSul click viene scatenato ItemCommand<mobile:List id=“lstXXX" runat="server“ <mobile:List id=“lstXXX" runat="server“
OnItemCommand=“lstXXX_Command”>OnItemCommand=“lstXXX_Command”><Item Text=“Udine” Value=“UD” /><Item Text=“Udine” Value=“UD” /><Item Text=“Trento” Value=“TN” /><Item Text=“Trento” Value=“TN” /><Item Text=“Milano” Value=“MI” /><Item Text=“Milano” Value=“MI” />
</mobile:List></mobile:List>
TextView Control
Testo lungoConsente
BoldItalicSalti paginaParagrafiAnchor nel testoSupporta Paginazione
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
ObjectList
DataBindingTemplate
Header Footer Item AlternatingItem
Dettaglio automaticoDemo
IE Pocket PC SmartPhone
Un po’ di stile
Aggiungere un po’ di informazioni di style3 stili predefiniti
titleErrorSubcommand
Associabili con StyleReferenceEstendibile con propri stili
Demo 07
Immagini
<mobile:DynamicImageDynamicImageSource=“path”AutoSizeImage=true/falseAutoConvert=true/false
Cache in MobileDynamicImagesPer performance !
Non incluso in ASP.NETScaricabile da http://asp.net/ControlGallery/Disclaimer.aspx?
downloadControl=185&tabindex=2
Casi particolari
Se escono nuovi device ?Device Update dal sito Microsoft
Comprende eventuali nuovi adapterDefinizione device diretta da machine.config
Se vogliamo cambiare qualcosa ?Proprerty Override
Semplice Modificare valore proprietà in base al device Stesso Render
Custom Adapter Riscriviamo il processo di Render Più complesso ma controllo totale
IISIIS.NET Framework 1.1 .NET Framework 1.1
(ASP.NET)(ASP.NET)
SviluppoSviluppo ProduzioneProduzione
CreazioneCreazioneWeb FormWeb Form
Business LogicBusiness Logic
PresentationPresentation Layer (controls)Layer (controls)
Test Test DeviceDevice
Invio inInvio inProduzioneProduzione
HTTPHTTPRequestRequest
DeviceDeviceCapabilitýCapabilitý
Mobile Controls Mobile Controls Device AdapterDevice Adapter
generano outputgenerano output
AggiuntaAggiuntaDevice AdaptersDevice Adapters
DeviceDeviceCapabilityCapabilityaggiornatoaggiornato
HTTPHTTPResponseResponse
Mobile.aspxMobile.aspx
Device Extensibility
WWAAPP
Device Update
Siamo alla versione 4 per ASP.NET 1.xSono cumulativiDU2 aggiunge Adapter per XHTMLLe prossime versioni conterranno solo supporto a eventuali nuovi linguaggi
Device Profiling Tool http://www.asp.net/mobile/profile/default.aspx Step by Step online per creare la configurazione
Restituisce il <browserCaps> Spettacolo !!!
Custom Config
CustomDevice.config in C:\WINDOWS\Microsoft.NET\Framework\v1.1.4322\CONFIG
Edit machine.config Cercare browserCaps “Add reference”
<browserCaps><browserCaps> <result type="System.Web.Mobile.MobileCapabilities, …/><result type="System.Web.Mobile.MobileCapabilities, …/> <file src="deviceUpdate.config" /><file src="deviceUpdate.config" /> <file src="deviceUpdate3.config" /><file src="deviceUpdate3.config" /> <file src="deviceUpdate4.config" /><file src="deviceUpdate4.config" /> <file src="customdeviceUpdate.config" /><file src="customdeviceUpdate.config" />
MobileCapabilities Object
ASP.NET Runtime Utilizza l’header HTTP USER-AGENT per identificare il browserMozilla/4.0 (compatible; MSIE 4.01; Windows CE;
SmartPhone; 176x220) Cerca il browser nella sezione <browserCaps> nel .config Crea un’istanza di MobileCapabilities impostando le proprietà definite
nel <browserCaps>
MobileCapabilities identifica le “capacità” del browser MobileDeviceModel
ScreenPixelsHeight, ScreenPixelsWidth PreferredRenderingType (html32, wml11, xhtml-basic, etc.) PreferredImageMime …
Property Override
Modificare una qualunque proprietà di un controllo in base al device
Size = 100 se DesktopSize = 60 se Pocket PCSize = 20 se SmartPhoneSize = 45 se Nokia Comunicator ImageUrl verso GIF se Desktop / Pocket ImageUrl verso WBMP se WAP Browser
DeviceSpecific Customization
Step 1:Step 1: Selezionare il Device•Filtri Predefiniti•Filtri Custom
Step 1:Step 1: Selezionare il Device•Filtri Predefiniti•Filtri Custom
Step 3:Step 3: Applicare Customization Using•Property Overrides
•<Choice Filter=“filtro” Proprietà=“xxx” />•Template
•<Choice Filter=“filtro”>•<ItemTemplate>...</ItemTemplate>
•</Choice>
Step 3:Step 3: Applicare Customization Using•Property Overrides
•<Choice Filter=“filtro” Proprietà=“xxx” />•Template
•<Choice Filter=“filtro”>•<ItemTemplate>...</ItemTemplate>
•</Choice>
Step 2:Step 2: DeviceSpecific•Selezionare il Controllo•Taggarlo con DeviceSpecific
Step 2:Step 2: DeviceSpecific•Selezionare il Controllo•Taggarlo con DeviceSpecific
Template Override
<mobile:Form id="Form1" runat="server"><mobile:Form id="Form1" runat="server"> <mobile:DeviceSpecific id="DeviceSpecific1" runat="server"><mobile:DeviceSpecific id="DeviceSpecific1" runat="server"> <Choice Filter="<Choice Filter="isHTML32isHTML32">"> <HeaderTemplate><HeaderTemplate> <mobile:Label id="Label1" runat="server" <mobile:Label id="Label1" runat="server" StyleReference="title" ForeColor="Firebrick">StyleReference="title" ForeColor="Firebrick"> Contoso Inc.</mobile:Label>Contoso Inc.</mobile:Label> </HeaderTemplate></HeaderTemplate> <FooterTemplate><FooterTemplate> <mobile:Label id="Label2" runat="server" <mobile:Label id="Label2" runat="server" Font-Size="Small">(c) Contoso, 2004.</mobile:Label>Font-Size="Small">(c) Contoso, 2004.</mobile:Label> </FooterTemplate></FooterTemplate> </Choice></Choice> </mobile:DeviceSpecific></mobile:DeviceSpecific> … … </mobile:Form></mobile:Form>
Injecting Markup
Es isHTML32 o isWML per markup specifico
<mobile:Form id="Form1" runat="server"><mobile:Form id="Form1" runat="server"> <mobile:DeviceSpecific id="DeviceSpecific1" runat="server"><mobile:DeviceSpecific id="DeviceSpecific1" runat="server"> <Choice Filter="<Choice Filter="isHTML32isHTML32">"> <HeaderTemplate><HeaderTemplate> <table width=“90%” cellspacing=“1”><table width=“90%” cellspacing=“1”> <tr><td bgcolor=“#003366” valign=“top” height=“100%”><tr><td bgcolor=“#003366” valign=“top” height=“100%”> </HeaderTemplate></HeaderTemplate> <FooterTemplate><FooterTemplate> </td></tr></table></td></tr></table> </FooterTemplate></FooterTemplate> </Choice></Choice> </mobile:DeviceSpecific></mobile:DeviceSpecific> ...... ......
Form e Script
<body> <mobile:Form id="Form1" …> <mobile:Label id="Label1"...> Name: </mobile:Label> <mobile:TextBox id="TextBox1" …/> <mobile:Label id="Label2" …> Password: </mobile:Label> <mobile:TextBox id="TextBox2" …/> </mobile:Form></body>
<html><body><form id="Form1" name="Form1" method="post"… <input type="hidden" name="__EVENTTAR… <input type="hidden" name="__EVENTARG… <script language=javascript><!-- function __doPostBack(target, argument){ var theform = document.Form1 theform.__EVENTTARGET.value=target theform.__EVENTARGUMENT.value=argument theform.submit() } // --> </script>Name:<input name="TextBox1"/><br>Password:<input name="TextBox2"/></form></body></html>
<mobile:DeviceSpecific <mobile:DeviceSpecific id="DeviceSpecific1" runat="server">id="DeviceSpecific1" runat="server"> <Choice Filter="supportsJavaScript"><Choice Filter="supportsJavaScript"> <ScriptTemplate><ScriptTemplate> <Script for="window" <Script for="window" event="onload“ event="onload“ language="jscript">language="jscript"> window.alert("Hello, World!");window.alert("Hello, World!"); window.Form1.TextBox1.focus();window.Form1.TextBox1.focus(); </Script></Script> </ScriptTemplate></ScriptTemplate> </Choice></Choice></mobile:DeviceSpecific></mobile:DeviceSpecific>
<head><head> <Script for="window" event="onload" <Script for="window" event="onload" language="jscript">language="jscript"> window.alert("Hello, World!");window.alert("Hello, World!"); window.Form1.TextBox1.focus();window.Form1.TextBox1.focus(); </Script></Script></head></head>
ASP.NET 2.0
For Device
Property Override ovunque
Control adapter architecture per server control
Simile a ASP.NET 1.1 Mobile ControlsConsente ai server control di comportarsi diversamente in base ai
browserBeta 1 includeva alcuni mobile device adapterDalla Beta 2 non ci sono più !
Mobile Controls 1.x inclusi in ASP.NET 2.0
Aggiornata la configurazione al Device Update 4
Property Override supportata da <asp:
Mobile Control 1.x in ASP.NET 2.0
Possono sfruttare Auto-detection dei browser cookieless Membership, Profiles, Role management ADO.NET 2.0 MARS & Async
ASP.NET 1.x Mobile Controls non supportano
Master pages, Web parts, Themes
Nessuna modifica al codice Cambiare CodeBehind con CodeFile Mettere partial alla classe del CodeFile Togliere definizione controlli e WebForm Designer Generated Code Occhio AutoeventWiredUp
Quindi !?!?
ASP.NET 2.0 Server Controls per XHTML 1.1 o HTML3.2 (enableLegacyRendering)
Ottimo anche per device con browser “bravi” Pocket Internet Explorer su Pocket PC and Smartphone
Non adatti a XHTML-MP browsers (Es. Sony-Ericsson) WAP 1.1, WAP 2.0 o cHTML
Usare V1.x Mobile Controls
ASP.NET 2.0 Controls hanno molti vantaggi se si possono usare
Master pages, Login Controls, Themes ASP.NET 2.0 DataSource Controls
Sapete il mio parere
Supporto per Device
1.1 c’erano i Device UpdatesIn ASP.NET 2.0
Microsoft non certifica più i nuovi device Gli adapter esistenti rimangono
HTML, cHTML, XHTML Mobile Profile e CHTML I produttori di Device possono fornire la configurazione
E Device Adapter Device Profiling http://
www.asp.net/mobile/profile/default.aspx Aggiornato all’uscita di ASP.NET 2.0 per supportare il nuovo
formato di configurazione
Config Changes
.browser per la configurazioneGlobal %WINDIR%\Microsoft.Net\xx\config\browsersApplication: directory <app>\browsers
Nuova classe HttpBrowserCapabilities Oggetto basato sui file .browser
Assegnato all’oggetto Request (Request.Browser)Global class
Richiede rebuild per modifiche aspnet_regbrowsers.exe
Application class FileSystemWatcher - rebuild automatico
Propery Override 2.0
BrowserID incluso come filtro per le proprietà<%@ Page theme=”BlueSky” <%@ Page theme=”BlueSky” Nokia:themeNokia:theme=”NokiaTheme” ... %>=”NokiaTheme” ... %>
<asp:Label runat=“server”<asp:Label runat=“server”text=”Ciao” text=”Ciao” IE:TextIE:Text=”Ciao IE” =”Ciao IE” IE6to9IE6to9:text=“Ciao IE versione 6 o 7 o 8 o 9 :text=“Ciao IE versione 6 o 7 o 8 o 9 ””MyOwnFilterMyOwnFilter:text=“Ciao da Filtro custom” ... />:text=“Ciao da Filtro custom” ... />
<asp:Repeater ..><asp:Repeater ..> <itemtemplate><%# Databinding expr %></itemtemplate><itemtemplate><%# Databinding expr %></itemtemplate> <IE:<IE:itemtemplateitemtemplate>> <p style=”color:blue;font:arial”><p style=”color:blue;font:arial”> Hi <%# Databinding expr %>Ciao, come stai ?</p>Hi <%# Databinding expr %>Ciao, come stai ?</p> </</IE:IE:itemtemplate>itemtemplate></asp:Repeater></asp:Repeater>
<%@ Page theme=”BlueSky” <%@ Page theme=”BlueSky” Nokia:themeNokia:theme=”NokiaTheme” ... %>=”NokiaTheme” ... %>
<asp:Label runat=“server”<asp:Label runat=“server”text=”Ciao” text=”Ciao” IE:TextIE:Text=”Ciao IE” =”Ciao IE” IE6to9IE6to9:text=“Ciao IE versione 6 o 7 o 8 o 9 :text=“Ciao IE versione 6 o 7 o 8 o 9 ””MyOwnFilterMyOwnFilter:text=“Ciao da Filtro custom” ... />:text=“Ciao da Filtro custom” ... />
<asp:Repeater ..><asp:Repeater ..> <itemtemplate><%# Databinding expr %></itemtemplate><itemtemplate><%# Databinding expr %></itemtemplate> <IE:<IE:itemtemplateitemtemplate>> <p style=”color:blue;font:arial”><p style=”color:blue;font:arial”> Hi <%# Databinding expr %>Ciao, come stai ?</p>Hi <%# Databinding expr %>Ciao, come stai ?</p> </</IE:IE:itemtemplate>itemtemplate></asp:Repeater></asp:Repeater>
Altre Informazioni
Dove posso ottenere maggiori informazioniwww.DevLeap.itwww.pocketpcdn.comwww.asp.net/mobile
Developer resourcesMicrosoft Visual Studio.NETMicrosoft .NET Framework SDKMicrosoft Developer Network