Mobile Internet Toolkit Michael Klopstock, Frank Lange Technologieberater Developer Group Microsoft GmbH

Präsentation zum Thema: "Mobile Internet Toolkit Michael Klopstock, Frank Lange Technologieberater Developer Group Microsoft GmbH"—  Präsentation transkript:

1 Mobile Internet Toolkit Michael Klopstock, Frank Lange Technologieberater Developer Group Microsoft GmbH mikeklop@microsoft.commikeklop@microsoft.com, franklan@microsoft.com franklan@microsoft.com mikeklop@microsoft.comfranklan@microsoft.com

2 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

3 Worum es geht... Portale für Mobilgeräte Portale für Mobilgeräte ASP.NET-Technologie ASP.NET-Technologie VS.NET als Entwicklungsumgebung VS.NET als Entwicklungsumgebung UI-Anpassung an Endgeräte etc. UI-Anpassung an Endgeräte etc. Erweiterbarkeit für neue Geräte Erweiterbarkeit für neue Geräte

4 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe Der WAP-Standard Der WAP-Standard WAP Application Environment WAP Application Environment Markup Languages Markup Languages VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

5 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe Der WAP-Standard Der WAP-Standard WAP Application Environment WAP Application Environment Markup Languages Markup Languages VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

6 Der WAP-Standard Wireless Application Protocol Wireless Application Protocol WAP Forum (Ericsson, Motorola, Nokia,...) definiert WAP Industriestandard WAP Forum (Ericsson, Motorola, Nokia,...) definiert WAP Industriestandard WML-Nutzung (Cooperation White Paper zwischen WAP Formum und W3C) WML-Nutzung (Cooperation White Paper zwischen WAP Formum und W3C) Bedarf, da Mobilgeräte (noch) zu leistungsschwach für übliche HTML- Seiten via HTTP sind a) HTML-Interpretation (RAM, CPU) b) Display (Farbgrafik, Größe) c) kleine Stromakkus Bedarf, da Mobilgeräte (noch) zu leistungsschwach für übliche HTML- Seiten via HTTP sind a) HTML-Interpretation (RAM, CPU) b) Display (Farbgrafik, Größe) c) kleine Stromakkus

7 WAP-Historie HDML=Handheld Markup Language (Fa. Unwired Planet, jetzt-Name: Openwave) HDML=Handheld Markup Language (Fa. Unwired Planet, jetzt-Name: Openwave) WAP 1.0 - 1998, wenig beachtet WAP 1.0 - 1998, wenig beachtet WAP 1.1 – viele Services entstanden WAP 1.1 – viele Services entstanden WAP 1.2 – 1999 WTA, Push, WMLScript WAP 1.2 – 1999 WTA, Push, WMLScript WAP 2.0 – 2001 WML nun als XHTML, viele Standard-Integrationen (TCP/IP, HTTP, TLS,...) – Gerät muß also WAP1 und HTTP unterstützen! Also der Schritt zu HTTP und WAP1 nur noch Historie? WAP 2.0 – 2001 WML nun als XHTML, viele Standard-Integrationen (TCP/IP, HTTP, TLS,...) – Gerät muß also WAP1 und HTTP unterstützen! Also der Schritt zu HTTP und WAP1 nur noch Historie? WAP = Wireless Application Protocol WTA = Wireless Telephone Application

8 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe Der WAP-Standard Der WAP-Standard WAP Application Environment WAP Application Environment Markup Languages Markup Languages VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

9 WAE = WAP Application Environment WAP Umgebung PPG = Push Proxy Gateway (Push-Nachrichten zum Mobilgerät) PAP = Push Access Protocol SI = Service Indication (Web Server sendet an Gateway eine Meldung samt URL (z.B. Mail eingegangen) SL = Service Loading (Web Server sendet an Gateway eine URL zwecks Datenabgriff) WTA Server = stellt WTA-Dienste bereit (WML und WMLScript für typische Handyfunktionalität auf dem Mobilgerät) WTA = Wireless Tolephony Application

10 WAP(1) Protocol Stack WAE = Wireless Application Environment WTAI = Wireless Telephony Application Interface WSP = Wireless Session Protocol WTP = Wireless Transaction Protocol WTLS = Wireless Transport Layer Security (vergleichbar mit TLS=Transport Layer Security oder SSL=Secure Socket Layer) WDP = Wireless Datagram Protocol meist GSM (auch CSD, USSD, HSCSD, GPRS) Verbinden, Senden, Empfangen,... (Datagram Protocol) (Optionaler Security Layer) 3 Klassen an Serveranforderungen: unsicher, Zustellgarantie, Antwortgarantie Ob verbindungslos oder verb.orientiert Formate, Schnittstellen (z.B. WML, WMLScript, Script-Libraries, WTAI)

11 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe Der WAP-Standard Der WAP-Standard WAP Application Environment WAP Application Environment Markup Languages Markup Languages VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

12 Markup: HTML & Co SGML = Standard Generalized Markup Language (hat sehr viele Optionen) SGML = Standard Generalized Markup Language (hat sehr viele Optionen) XML = Extensible Markup Language (handhabbarer als SGML durch eingeschränktes Regelwerk) XML = Extensible Markup Language (handhabbarer als SGML durch eingeschränktes Regelwerk) HTML = Hypertext Markup Language (mit SGML definiert) HTML = Hypertext Markup Language (mit SGML definiert) XHTML = Extensible Hypertext Markup Language (vergleichbar HTML, aber mit XML definiert) XHTML = Extensible Hypertext Markup Language (vergleichbar HTML, aber mit XML definiert) DHTML = Dynamic HTML, Erweiterungen auf Client via Scripting nutzbar DHTML = Dynamic HTML, Erweiterungen auf Client via Scripting nutzbar Diverse XML-Markups: WML, MathML, CML (Chemie), SVG (Vektorgrafik),...

13 Eine XML-Sprache XML-Header und DocTypeDef-Verweis Eine XML-Sprache XML-Header und DocTypeDef-Verweis Erweiterungen für Handybereich (Navigation, Softkeys,..) Erweiterungen für Handybereich (Navigation, Softkeys,..) Cards und Decks Deck (Kartenstapel) kann in einer Übertragung zum Handy geschickt werden. Der kleine Textbildschirm zeigt nur einzelne Cards. Cards und Decks Deck (Kartenstapel) kann in einer Übertragung zum Handy geschickt werden. Der kleine Textbildschirm zeigt nur einzelne Cards. Markup: WML = Wireless Markup Language......

14 WML-Darstellung im Emulator Demo mit Nokia WAP- Toolkit

15 Markup: Mobilbereich cHTML (Compact HTML) ein HTML-Subset ohne JPGs,...aber GIFs,... Vorteil: HTML-Editor nutzen "Compact HTML for Small Information Appliances" http://www.w3.org/TR/1998/NOTE-compactHTML- 19980209/ cHTML (Compact HTML) ein HTML-Subset ohne JPGs,...aber GIFs,... Vorteil: HTML-Editor nutzen "Compact HTML for Small Information Appliances" http://www.w3.org/TR/1998/NOTE-compactHTML- 19980209/ iMode große Verbreitung in Japan ab 1999 http://www.nttdocomo.com/ iMode große Verbreitung in Japan ab 1999 http://www.nttdocomo.com/ WML 1.1 "Wireless Markup Language Specification Version 1.1 http://www.wapforum.org/docs/technical1.1/WML-3-Feb- 1999.pdf WML 1.1 "Wireless Markup Language Specification Version 1.1 http://www.wapforum.org/docs/technical1.1/WML-3-Feb- 1999.pdf XHTML (in WAP 2.0) Vorteil: wohlgeformtes XML "XHTML 1.0: The Extensible HyperText Markup Language - A Reformulation of HTML 4.0 in XML 1.0 http://www.w3.org/TR/xhtml1/ XHTML (in WAP 2.0) Vorteil: wohlgeformtes XML "XHTML 1.0: The Extensible HyperText Markup Language - A Reformulation of HTML 4.0 in XML 1.0 http://www.w3.org/TR/xhtml1/

16 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Verfügbarkeit Verfügbarkeit Entwicklungsumgebung und Doku Entwicklungsumgebung und Doku Zielgeräte und Emulatoren Zielgeräte und Emulatoren Auch ohne VS.NET Auch ohne VS.NET Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

17 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Verfügbarkeit Verfügbarkeit Entwicklungsumgebung und Doku Entwicklungsumgebung und Doku Zielgeräte und Emulatoren Zielgeräte und Emulatoren Auch ohne VS.NET Auch ohne VS.NET Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

18 Mobile Internet Toolkit Webseiten für Mobilgeräte entwickeln Webseiten für Mobilgeräte entwickeln Beta 1 hiess.NET Mobile Web SDK Beta 1 hiess.NET Mobile Web SDK ASP.NET-Technik Gemeinsames Programmiermodell und Technologie mit normalen HTML- Webseiten im.NET Framework ASP.NET-Technik Gemeinsames Programmiermodell und Technologie mit normalen HTML- Webseiten im.NET Framework MIT integriert sich in VS.NET MIT integriert sich in VS.NET VS.NET muß nicht zwingend genutzt werden (ASPX-Seite mit Editor erstellen) VS.NET muß nicht zwingend genutzt werden (ASPX-Seite mit Editor erstellen) Download unter http://www.microsoft.com/mobile/developer/ downloads Download unter http://www.microsoft.com/mobile/developer/ downloads http://www.microsoft.com/mobile/developer/ downloads http://www.microsoft.com/mobile/developer/ downloads

19 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Verfügbarkeit Verfügbarkeit Entwicklungsumgebung und Doku Entwicklungsumgebung und Doku Zielgeräte und Emulatoren Zielgeräte und Emulatoren Auch ohne VS.NET Auch ohne VS.NET Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

20 MIT Entwicklungsumgebung Bestandteile Bestandteile Mobile Internet Toolkit Visual Studio.NET.NET – Laufzeitumgebung (.NET Component Update, XP Server) Geräte-Emulatoren Mobilgeräte über WAP Gateway

21 Integration ins VS.NET Demo: Neuer Projekttyp...

22 Dokumentation Online Hilfe im VS.NET Visual Studio.NET /SDKs und Tools /Visual Studio SDK /Mobile Internet Toolkit (no filter-Einstellung im Content View) Online Hilfe im VS.NET Visual Studio.NET /SDKs und Tools /Visual Studio SDK /Mobile Internet Toolkit (no filter-Einstellung im Content View)

23 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Verfügbarkeit Verfügbarkeit Entwicklungsumgebung und Doku Entwicklungsumgebung und Doku Zielgeräte und Emulatoren Zielgeräte und Emulatoren Auch ohne VS.NET Auch ohne VS.NET Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

24 Auszug aus der Geräteliste WML Cell Phones WML Cell Phones Mitsubishi T250 Mitsubishi T250 Nokia 7110 Nokia 7110 Siemens C-35i Siemens C-35i Ericsson R380 Ericsson R380 Nokia 6210 Nokia 6210 Samsung 850 Samsung 850 Siemens S-35i Siemens S-35i Sprint Touchpoint Sprint Touchpoint Imode: Imode: Mitsubishi D502i, Mitsubishi D502i, NEC N502i NEC N502i Panasonic P502i Panasonic P502i Pocket PC (Microsoft Pocket Internet Explorer)Pocket PC (Microsoft Pocket Internet Explorer) Palm VIIx (default HTML); Palm V (Go America)Palm VIIx (default HTML); Palm V (Go America) RIM Blackberry 950; RIM Blackberry 957 (Go America)RIM Blackberry 950; RIM Blackberry 957 (Go America) Device Emulators:Device Emulators: Microsoft Mobile Explorer v 2.01 emulatorMicrosoft Mobile Explorer v 2.01 emulator Pocket PCPocket PC Phone.com UP.SDK 4.1 emulator with generic skinPhone.com UP.SDK 4.1 emulator with generic skin Phone.com UP.SDK 3.2 for WML emulator with Mitsubishi T250 skinPhone.com UP.SDK 3.2 for WML emulator with Mitsubishi T250 skin DoCoMo 502 emulatorDoCoMo 502 emulator Microsoft Internet Explorer 5.5 and 6.0Microsoft Internet Explorer 5.5 and 6.0 Andere Geräte/Emulatoren mögen auch gehen, wurden aber nicht offiziell getestet.

25 Rendering je nach Gerät Demo

26 Emulatoren zum Testen Mobile Internet Explorer Mobile Internet Explorer YourWAP Wireless Companion YourWAP Wireless Companion Nokia WAP Toolkit Nokia WAP Toolkit......

27 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Verfügbarkeit Verfügbarkeit Entwicklungsumgebung und Doku Entwicklungsumgebung und Doku Zielgeräte und Emulatoren Zielgeräte und Emulatoren Auch ohne VS.NET Auch ohne VS.NET Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

28 Beispiel ohne VS.NET *.ASPX-Seite auf Webshare *.ASPX-Seite auf Webshare.NET-Framework muß installiert sein (Windows Component Update).NET-Framework muß installiert sein (Windows Component Update) <%@ Register TagPrefix="Mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %> Hallo Welt! <%@ Register TagPrefix="Mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile" %> Hallo Welt!

29 Anzeige im IE6 HTML (Demo) HTML (Demo) <!-- function __doPostBack(target, argument){ var theform = document.ctrl0 theform.__EVENTTARGET.value = target theform.__EVENTARGUMENT.value = argument theform.submit() } // --> Hallo Welt! <!-- function __doPostBack(target, argument){ var theform = document.ctrl0 theform.__EVENTTARGET.value = target theform.__EVENTARGUMENT.value = argument theform.submit() } // --> Hallo Welt!

30 Anzeige im WAP-Emulator WML (gleiches Demo) WML (gleiches Demo) Hallo Welt! Hallo Welt!

31 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Page, Forms und Controls Page, Forms und Controls Website portieren Website portieren MMIT und das.NET Framework MMIT und das.NET Framework Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

32 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Page, Forms und Controls Page, Forms und Controls Website portieren Website portieren MMIT und das.NET Framework MMIT und das.NET Framework Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

33 Namespace "mobile" Hello, Mobile World Hello, Mobile World Hello, World Hello, World Web Form System.Web.UI.MobileControls System.Web.UI.MobileControls statt: System.Web.UI [.Control,.Page,..] statt: System.Web.UI [.Control,.Page,..] Mobile Web Form

34 Beispiel: Minimal Form mit Push Button und Label Form mit Push Button und Label Push-Event: Labeltext setzen Push-Event: Labeltext setzen Mit File/Browse With kann Default Browser geändert werden. Nokia WAP Toolkit akzeptiert URL als Kommandozeile – gut! Das Nokia Toolkit kann das erzeugte WML anzeigen. Der IE vom PC kann das erzeugte HTML darstellen.

35 Page mit Forms, Controls Programmiertechnisch Forms/Controls sind Members der Page Controls gehören nicht der Form, sondern Page Programmiertechnisch Forms/Controls sind Members der Page Controls gehören nicht der Form, sondern Page Designdarstellung (Page/HTML) Form-Zugehörigkeit der Controls sichtbar Designdarstellung (Page/HTML) Form-Zugehörigkeit der Controls sichtbar Geräte laden die Page evtl. mehrere Forms gleichzeitig, falls der Wechsel von einer Form zur andern nicht über eine serverseitige Event-Funktion implementiert wird (d.h. z.B. einfacher Link zur anderen Form) Geräte laden die Page evtl. mehrere Forms gleichzeitig, falls der Wechsel von einer Form zur andern nicht über eine serverseitige Event-Funktion implementiert wird (d.h. z.B. einfacher Link zur anderen Form)

36 Beispiel :Page mit zwei Forms Page mit zwei Forms Page mit zwei Forms Form1: Push Button stetzt die Properties Label::Text und Page::ActiveForm Form1: Push Button stetzt die Properties Label::Text und Page::ActiveForm Form2: Label Form2: Label

37 Control-Überblick Form, Panel zur logischen Gruppierung Form, Panel zur logischen Gruppierung Label, TextView z.B..Text auf um lokale Textdatei als Quelle anzugeben Label, TextView z.B..Text auf um lokale Textdatei als Quelle anzugeben Link z.B..NavigateURL auf #Form2 oder Webadresse Link z.B..NavigateURL auf #Form2 oder Webadresse Call z.B..PhoneNumber auf +49 (89) 3176-1000 Call z.B..PhoneNumber auf +49 (89) 3176-1000 Image.URL oder.AlternateText falls nicht darstellbar (weiteres siehe später bei Geräteeigenschaften...) Image.URL oder.AlternateText falls nicht darstellbar (weiteres siehe später bei Geräteeigenschaften...) Calender.SelectedDate, Bereich nur über zweimal Tag auswählen Calender.SelectedDate, Bereich nur über zweimal Tag auswählen

38 List-Control1/2 Einfache Darstellung Einfache Darstellung List1.Items.Clear(); for(int i=1; i<=10; i++) List1.Items.Add(i.ToString()); List1.Items.Clear(); for(int i=1; i<=10; i++) List1.Items.Add(i.ToString()); Anwahl eines Items Anwahl eines Items private void List1_ItemCommand(object source, System.Web.UI.MobileControls.ListCommandEventArgs e) { Label1.Text=e.ListItem.Text; this.ActiveForm=Form1; //mit Label1 } private void List1_ItemCommand(object source, System.Web.UI.MobileControls.ListCommandEventArgs e) { Label1.Text=e.ListItem.Text; this.ActiveForm=Form1; //mit Label1 }

39 List-Control2/2 Anzeigestring und Wertestring Anzeigestring und Wertestring string[] staedte = { "Berlin", "München", "Hamburg" }; string[] links = { "17°C Wolken", "15°C Sonne", "19° Regen" }; List1.Items.Clear(); for(int i=0; i<staedte.GetLength(0); i++) List1.Items.Add(new MobileListItem(staedte[i], links[i])); string[] staedte = { "Berlin", "München", "Hamburg" }; string[] links = { "17°C Wolken", "15°C Sonne", "19° Regen" }; List1.Items.Clear(); for(int i=0; i<staedte.GetLength(0); i++) List1.Items.Add(new MobileListItem(staedte[i], links[i])); SelectionList.SelectType = DropDown|MultiSelectListBox|... SelectionList.SelectType = DropDown|MultiSelectListBox|... ObjectList für Data Binding ObjectList für Data Binding private void List1_ItemCommand(…) //Selection { Label1.Text=e.ListItem.Value; // Wetterdaten } private void List1_ItemCommand(…) //Selection { Label1.Text=e.ListItem.Value; // Wetterdaten }

40 Validators (v.a. TextBoxes) RequiredFieldValidator.ControlToValidate,.InitialValue /*was als leer gilt*/,.ErrorMessage RequiredFieldValidator.ControlToValidate,.InitialValue /*was als leer gilt*/,.ErrorMessage CompareValidator.ControlToValidate,.Type,.ValueToCompare,.Operator CompareValidator.ControlToValidate,.Type,.ValueToCompare,.Operator RangeValidator.ControlToValidate,.Type,.MinimumValue,.MaximumValue RangeValidator.ControlToValidate,.Type,.MinimumValue,.MaximumValue RegularExpressionValidator RegularExpressionValidator CustomValidator CustomValidator ValidationSummary ValidationSummary private void Command1_Click(…) { if (Page.IsValid)//Validation! this.ActiveForm = Form2; } private void Command1_Click(…) { if (Page.IsValid)//Validation! this.ActiveForm = Form2; }

41 ff Validators CustomValidator Doppelklick.ServerValidate-Eventfunction,.ControlToValidate,.ErrorMessage evtl. zusätzlich einen RequiredFieldValidator oder Form.Validate überschreiben CustomValidator Doppelklick.ServerValidate-Eventfunction,.ControlToValidate,.ErrorMessage evtl. zusätzlich einen RequiredFieldValidator oder Form.Validate überschreiben ValidationSummary oft auf anderen Form gelegt, Anzeige alles Validator-Errorstrings automatisch mit -Button.FormToValidate ValidationSummary oft auf anderen Form gelegt, Anzeige alles Validator-Errorstrings automatisch mit -Button.FormToValidate private void CustomValidator1_ServerValidate(…) { // nur aufgerufen, wenn Inputfeld nicht leer ist! try // ungerade Zahl ist OK { args.IsValid = (int.Parse(args.Value) & 1)>0; } catch (FormatException) { args.IsValid=false; } } private void CustomValidator1_ServerValidate(…) { // nur aufgerufen, wenn Inputfeld nicht leer ist! try // ungerade Zahl ist OK { args.IsValid = (int.Parse(args.Value) & 1)>0; } catch (FormatException) { args.IsValid=false; } }

42 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Page, Forms und Controls Page, Forms und Controls Website portieren Website portieren MMIT und das.NET Framework MMIT und das.NET Framework Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

43 Realität und Grenzen Webseiten sind nicht einfach vom Desktop PC übertragbar Webseiten sind nicht einfach vom Desktop PC übertragbar Desktop-Webseiten-Design (Farben, Formen, Motive, Emotionen,...) ist ein anderer Ansatz Desktop-Webseiten-Design (Farben, Formen, Motive, Emotionen,...) ist ein anderer Ansatz Seitendesign für das mobile Gerät orientiert sich an der reinen Funktionalität Seitendesign für das mobile Gerät orientiert sich an der reinen Funktionalität Page-Aufteilung kann übernommen werden. Auf der Page dann mehrere Forms. Page-Aufteilung kann übernommen werden. Auf der Page dann mehrere Forms. Keine freie Positionierbarkeit der Controls auf der Form Keine freie Positionierbarkeit der Controls auf der Form

44 Filtern einer Webseite? Das bin ich im Urlaub. Klicken Sie auf das Bild! Hier das Ergebnisdiagramm: Viel Spaß mit diesem Download: 8 MB Bilder weg - Lösung? Bilder weg - Lösung?

45 Logik auf der Seite? Gewünschte Navigationslogik schwer automatisiert erkennbar Gewünschte Navigationslogik schwer automatisiert erkennbar Name Anschrift Alter Größe * * * optional Bestellen Name Anschrift Optionale Angaben Alter Größe Bestellen

46 Design der Mobile App1/2 Ein Generischer Ansatz Ein Generischer Ansatz Idee, mobile Geräte einzubeziehen Modell der Funktionalität Organisation in Web Pages UI der Web Forms UI der Mobile Forms Logik-Feindesign der Forms Analyse bestehender Geschäftsprozesse

47 Design der Mobile App2/2 Ableiten aus bestehender Web Page Ableiten aus bestehender Web Page Bestehende Web Page Entdecke was wichtig ist: Trick: Bilder weg, Farben weg, Kopie zum Texteditor UI und Feinlogik für Mobile Forms Microsoft Press Books Newsletters Microsoft Jobs Privacy Statement Get Windows 2000 Professional, the most reliable Windows ever. See how Office 2000 at home can pay dividends in school and at work. Today's News

48 Demo: Page mit Forms ASP.NET Web Forms: Page hat 1 Form ASP.NET Web Forms: Page hat 1 Form Mobile Web Forms: Page hat n Forms Page-Organisationslogik wie PC, Form paßt zu kleinem Display Mobile Web Forms: Page hat n Forms Page-Organisationslogik wie PC, Form paßt zu kleinem Display......

49 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Page, Forms und Controls Page, Forms und Controls Website portieren Website portieren MMIT und das.NET Framework MMIT und das.NET Framework Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

50 DB-Binding 1. Form mit ObjektList 2. Data-Tab/OleDbAdapter auf Form ziehen Wizard erzeugt Adapter und Connection 3. Data-Menü/Generate Dataset 4. ObjectList: DataSource=DataSet1 DataMember=mytable 5. Init-Binding-Code DataSet1.Clear(); OleDbAdapter1.Fill(DataSet1); ObjectLis1.DataBind(); 6. Mit ObjectList / Rclick / Property Builder die Tabellenanzeige definieren

51 SOAP RCP Add Web Reference... Add Web Reference...

52 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Geräteeigenschaften abfragen Geräteeigenschaften abfragen Eigene Controls entwicklen Eigene Controls entwicklen Neue Geräte integrieren Neue Geräte integrieren Fazit und Literatur Fazit und Literatur

53 Windows 2000 (with IIS).NET Framework Mobile Internet Toolkit Development Environment Production Environment Prinzip: Geräteunterstützung Create mobile Web Form Integrate Business Logic Mobile Presentation Layer (controls) Test Target Devices Post to Web Servers HTTP Request Device Capabilities Mobile Controls & Device Adapters generate display Add Device Adapters Update Device Capabilities HTTP Response Mobile.aspx Pages Mobil- geräte

54 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Geräteeigenschaften abfragen Geräteeigenschaften abfragen Eigene Controls entwicklen Eigene Controls entwicklen Neue Geräte integrieren Neue Geräte integrieren Fazit und Literatur Fazit und Literatur

55 Geräteeigenschaften1/1 Request.Browser-Properties Request.Browser-Properties String propName; PropertyDescriptorCollection properties = TypeDescriptor.GetProperties (Request.Browser); StreamWriter fOut = File.CreateText("C:\\TEST.TXT"); for(int i=0; i<properties.Count; i++) { propName = properties[i].Name; fOut.WriteLine ( propName + " = " + Request.Browser[propName] ); } fOut.Close(); String propName; PropertyDescriptorCollection properties = TypeDescriptor.GetProperties (Request.Browser); StreamWriter fOut = File.CreateText("C:\\TEST.TXT"); for(int i=0; i<properties.Count; i++) { propName = properties[i].Name; fOut.WriteLine ( propName + " = " + Request.Browser[propName] ); } fOut.Close();

56 Geräteeigenschaften2/2 RequiresUniqueHtmlCheckboxNames JavaScript ScreenCharactersWidth RendersWmlDoAcceptsInline GatewayMinorVersion Browser ScreenCharactersHeight ScreenPixelsHeight Crawler GatewayMajorVersion IsColor AOL Beta MinorVersion Win32 Cookies RequiresUrlQuerySuffixForInitialRequest MobileDeviceModel MobileDeviceManufacturer W3CDomVersion ClrVersion CanRenderSetvarZeroWithMultiSelectionList RequiresHandheldFriendlyMetaTag PreferredImageMIME GatewayVersion RequiresUniqueHtmlCheckboxNames JavaScript ScreenCharactersWidth RendersWmlDoAcceptsInline GatewayMinorVersion Browser ScreenCharactersHeight ScreenPixelsHeight Crawler GatewayMajorVersion IsColor AOL Beta MinorVersion Win32 Cookies RequiresUrlQuerySuffixForInitialRequest MobileDeviceModel MobileDeviceManufacturer W3CDomVersion ClrVersion CanRenderSetvarZeroWithMultiSelectionList RequiresHandheldFriendlyMetaTag PreferredImageMIME GatewayVersion VBScript RequiresPhoneNumbersAsPlainText RendersBreaksAfterHtmlLists CanSendMail RendersBreaksAfterWmlAnchor RendersWmlSelectsAsMenuCards MSDomVersion PreferredRenderingType HasBackButton Frames Type SupportsCSS JavaApplets CDF Version NumberOfSoftkeys MaximumSoftkeyLabelLength PreferredRenderingMIME EcmaScriptVersion InputType CanInitiateVoiceCall Tables Win16 CanRenderOneventAndPrevElementsTogether TagWriter RequiresUrlEncodedPostfieldValues ScreenPixelsWidth VBScript RequiresPhoneNumbersAsPlainText RendersBreaksAfterHtmlLists CanSendMail RendersBreaksAfterWmlAnchor RendersWmlSelectsAsMenuCards MSDomVersion PreferredRenderingType HasBackButton Frames Type SupportsCSS JavaApplets CDF Version NumberOfSoftkeys MaximumSoftkeyLabelLength PreferredRenderingMIME EcmaScriptVersion InputType CanInitiateVoiceCall Tables Win16 CanRenderOneventAndPrevElementsTogether TagWriter RequiresUrlEncodedPostfieldValues ScreenPixelsWidth ActiveXControls ScreenBitDepth BackgroundSounds Platform IsMobileDevice MajorVersion ActiveXControls ScreenBitDepth BackgroundSounds Platform IsMobileDevice MajorVersion

57 Filter Festgelegt in WEB.CONFIG Festgelegt in WEB.CONFIG

58 Demo: Neue Filter hinzufügen VS: RClick auf Control Templating Options / Applied Device Filter / Edit / Available Device Filter / Edit VS: RClick auf Control Templating Options / Applied Device Filter / Edit / Available Device Filter / Edit VS: RClick auf Control Templating Options / Applied Device Filter / Edit Reihenfolge: first match! VS: RClick auf Control Templating Options / Applied Device Filter / Edit Reihenfolge: first match! Templating Option aktueller Filter im Editor Templating Option aktueller Filter im Editor

59 Templates editieren für aktuellen Filter können die Templates verändert werden für aktuellen Filter können die Templates verändert werden Templates bestimmen die Darstellung z.B. List Control: Header, Item, Seperator, AlternateItem, Footer Templates bestimmen die Darstellung z.B. List Control: Header, Item, Seperator, AlternateItem, Footer RClick: Edit Template / Auswahl RClick: Edit Template / Auswahl... (siehe kommende Folie)... (siehe kommende Folie) RClick: End Template Editing RClick: End Template Editing

60 Template editieren hier: List Control für "isHTML32"-Filter hier: List Control für "isHTML32"-Filter Ins Item-Template wurde ein Label gezogen Ins Item-Template wurde ein Label gezogen Label-DataBindings: hier wurde "Text" an Container.Text gebunden (Darstellung der Item-Texte) Label-DataBindings: hier wurde "Text" an Container.Text gebunden (Darstellung der Item-Texte)

61 HTML-Servercode Filterabhängige Template-Veränderungen Filterabhängige Template-Veränderungen Hallo <mobile:Label id=Label1 runat="server" BackColor="Yellow" Text='<%# DataBinder.Eval(Container, "Text") %>' ForeColor="#C0C000"> Hallo <mobile:Label id=Label1 runat="server" BackColor="Yellow" Text='<%# DataBinder.Eval(Container, "Text") %>' ForeColor="#C0C000">

62 Resultat Erster Filter: PocketPC: Erster Filter: PocketPC: Zweiter Filter: HTML32 (Änderung): Zweiter Filter: HTML32 (Änderung): Header Template Item Template (Labels, keine Links!)

63 Device Specific Control Prinzip wie zuvor ohne Default- Implementierung mit Header- und Footer-Template Prinzip wie zuvor ohne Default- Implementierung mit Header- und Footer-Template

64 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Geräteeigenschaften abfragen Geräteeigenschaften abfragen Eigene Controls entwicklen Eigene Controls entwicklen Neue Geräte integrieren Neue Geräte integrieren Fazit und Literatur Fazit und Literatur

65 User Controls *.ASCX-File (Text) *.ASCX-File (Text) ähnlich wie eine Page, aber als Control Entity ähnlich wie eine Page, aber als Control Entity An Container-Sprache gebunden (z.B. C#) da Text ist, nicht IL. An Container-Sprache gebunden (z.B. C#) da Text ist, nicht IL. Wizard (Project/Add-Menü) in Beta2 nur Web User Control (nicht mobile) Wizard (Project/Add-Menü) in Beta2 nur Web User Control (nicht mobile) Beispiel siehe "Walkthrough: Creating Web User Controls" nicht Beta2: "Walkthrough: Converting a Web Forms Page to a User Control" Beispiel siehe "Walkthrough: Creating Web User Controls" nicht Beta2: "Walkthrough: Converting a Web Forms Page to a User Control"

66 Composite Control ein Assembly (IL in DLL) ein Assembly (IL in DLL) Besteht aus Child Controls, welche das Rendering erledigen Besteht aus Child Controls, welche das Rendering erledigen

67 Sonstige Controls Controls, die das Rendering nicht den Child-Controls überlassen Controls, die das Rendering nicht den Child-Controls überlassen brauchen Adapter... brauchen Adapter...

68 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Geräteeigenschaften abfragen Geräteeigenschaften abfragen Eigene Controls entwicklen Eigene Controls entwicklen Neue Geräte integrieren Neue Geräte integrieren Fazit und Literatur Fazit und Literatur

69 Device Adapter Anpassung an neue Geräte oder neue eigenständige Controls entwicklen Anpassung an neue Geräte oder neue eigenständige Controls entwicklen Adapter sind für's Rendering Adapter sind für's Rendering Vorhandene Controls/Forms/Pages werden anhgepaßt – sollte vom Gerätehersteller kommen (neue Standards) Vorhandene Controls/Forms/Pages werden anhgepaßt – sollte vom Gerätehersteller kommen (neue Standards) Adapter klinken sich in die Mobile Runtime ein Adapter klinken sich in die Mobile Runtime ein Online-Hilfe noch leere Seiten! The device adapter code included in Beta 2 is subject to change Online-Hilfe noch leere Seiten! The device adapter code included in Beta 2 is subject to change

70 Device Adapter Quelltext C:\Program Files\Microsoft.NET\Mobile Internet Toolkit\Adapter Source Quelltext C:\Program Files\Microsoft.NET\Mobile Internet Toolkit\Adapter Source z.B. WmlLinkAdapter.CS Basisklasse: WmlControlAdapter public override void Render(WmlMobileTextWriter writer) z.B. WmlLinkAdapter.CS Basisklasse: WmlControlAdapter public override void Render(WmlMobileTextWriter writer) z.B. HtmlLinkAdapter.CS Basisklasse: HtmlControlAdapter public override void Render(HtmlMobileTextWriter writer) z.B. HtmlLinkAdapter.CS Basisklasse: HtmlControlAdapter public override void Render(HtmlMobileTextWriter writer) Der gesamte Adapter hat das Interface: IControlAdapter Der gesamte Adapter hat das Interface: IControlAdapter Assembly Kompilieren Csc /target:library /out:System.Web.UI.MobileControls.ShippedAdapterSource.dll /r:System.Web.Mobile.dll /D:COMPILING_FOR_SHIPPED_SOURCE *.cs Assembly Kompilieren Csc /target:library /out:System.Web.UI.MobileControls.ShippedAdapterSource.dll /r:System.Web.Mobile.dll /D:COMPILING_FOR_SHIPPED_SOURCE *.cs

71 Device Adapters & Server Controls Add New Mobile Server Controls HTML 3.2 JScript WML 1.1 cHTML Add New Device Adapters HTML 3.2 Mitsubishi T250,Nokia 7110, Pocket PC, Siemens C-35i, Ericsson R380, Mitsubishi D502i, NEC N502i Nokia 6210,Palm VIIx, Palm V and more Update Device Capabilities Call Label Command AdRotator Link Image CalendarTextBox List TextView Validators Object List Mobile Internet Controls Mobile Server Controls Device Adapters Device Capabilities

72 Neues vergleichbares Gerät Kopieren und Ändern von Geräteeigenschaften Kopieren und Ändern von Geräteeigenschaften Erweitern von Machine.config C:\WINNT\Microsoft.NET\Framework\v1.0.2914\CONFIG\machine.config Erweitern von Machine.config C:\WINNT\Microsoft.NET\Framework\v1.0.2914\CONFIG\machine.config <case match="R380 (?'browserMajorVersion'\w*) (?'browserMinorVersion'\.\w*) WAP1\.1"> browser = "Ericsson" type = "Ericsson R380" version = ${browserMajorVersion}.${browserMinorVersion} majorVersion = ${browserMajorVersion} minorVersion = ${browserMinorVersion} isMobileDevice = "true" preferredRenderingType = "wml11" preferredRenderingMIME = "text/vnd.wap.wml" preferredImageMIME = "image/vnd.wap.wbmp" inputType = "virtualKeyboard" canInitiateVoiceCall = "true" mobileDeviceManufacturer = "Ericsson" mobileDeviceModel = "R380" screenPixelsWidth = "310" …… <case match="R380 (?'browserMajorVersion'\w*) (?'browserMinorVersion'\.\w*) WAP1\.1"> browser = "Ericsson" type = "Ericsson R380" version = ${browserMajorVersion}.${browserMinorVersion} majorVersion = ${browserMajorVersion} minorVersion = ${browserMinorVersion} isMobileDevice = "true" preferredRenderingType = "wml11" preferredRenderingMIME = "text/vnd.wap.wml" preferredImageMIME = "image/vnd.wap.wbmp" inputType = "virtualKeyboard" canInitiateVoiceCall = "true" mobileDeviceManufacturer = "Ericsson" mobileDeviceModel = "R380" screenPixelsWidth = "310" ……

73 Agenda Worum es geht... Worum es geht... WAP – ein paar Grundbegriffe WAP – ein paar Grundbegriffe VS.NET und Mobile Internet Toolkit VS.NET und Mobile Internet Toolkit Programmierung mit dem MMIT Programmierung mit dem MMIT Geräteeigenschaften und neue Controls Geräteeigenschaften und neue Controls Fazit und Literatur Fazit und Literatur

74 Fazit MMIT als Add-On zum VS.NET MMIT als Add-On zum VS.NET ASP.NET-Technologie ASP.NET-Technologie Mobile Controls rendern Markup entsprechend dem Client-Gerät Mobile Controls rendern Markup entsprechend dem Client-Gerät Gateway schickt Markup ins Mobilfunknetz Gateway schickt Markup ins Mobilfunknetz Liste der Geräteeigenschaften auf Server gespeichert Liste der Geräteeigenschaften auf Server gespeichert Anpassung an neue Geräte möglich Anpassung an neue Geräte möglich

75 Literatur http://www.wapforum.com/ WAP Forum http://www.wapforum.com/ WAP Forum http://www.wapforum.com/ http://www.w3.org/ World Wide Web Consortium http://www.w3.org/ World Wide Web Consortium http://www.w3.org/ http://www.w3.org/TR/1998/NOTE- WAP-19981030 (WAP Forum - W3C Cooperation White Paper) http://www.w3.org/TR/1998/NOTE- WAP-19981030 (WAP Forum - W3C Cooperation White Paper) http://www.w3.org/TR/1998/NOTE- WAP-19981030 http://www.w3.org/TR/1998/NOTE- WAP-19981030 http://www.microsoft.com/mobile/devel oper/downloads http://www.microsoft.com/mobile/devel oper/downloads http://www.microsoft.com/mobile/devel oper/downloads http://www.microsoft.com/mobile/devel oper/downloads http://www.forum.nokia.com http://www.forum.nokia.com http://www.forum.nokia.com http://msdn.microsoft.com/vstudio/ http://msdn.microsoft.com/vstudio/ http://msdn.microsoft.com/vstudio/

76 Diskussion MMIT-Ansatz pro/cons? MMIT-Ansatz pro/cons? Zukunft Mobilmarkt? (WinCE-Geräte können HTML!) Zukunft Mobilmarkt? (WinCE-Geräte können HTML!) Kunden leichter mit Handy-Portal als mit Pocket PC-Portal zu gewinnen? Kunden leichter mit Handy-Portal als mit Pocket PC-Portal zu gewinnen?......