WPF, Silverlight, Windows Phone 8 und Windows Store Apps

Windows Phone 8.1: TextBox-Steuerelement mit Header und Placeholder, DatePicker und TimePicker
Kommentare

In der Kolumne „XAML Expertise“ präsentiert Gregor Biswanger Top-How-tos zum Thema XAML. Einsteiger und Fortgeschrittene XAML-Experten sollen hier durch geballtes Wissen gesättigt werden. Heute gibt es folgende Expertise: „Windows Phone 8.1: TextBox-Steuerelement mit Header und Placeholder, DatePicker und TimePicker’“. Viel Spaß mit XAML Expertise.

Die Implementierung eines TextBox-Steuerelements mit Header und Placeholder wurde mit Windows Phone 8.1 vereinfacht. So wird der TextBox einfach als Property der Header und der Placeholder via XAML mitgegeben:


  

Windows Phone 8.1 mit TextBox-Steuerelement

Der Vorteil des Headers ist, dass er immer linear zur TextBox angezeigt wird (Abb. 1).

Abb. 1: TextBox mit Header und Placeholder

DatePicker und TimePicker

Zwei weitere Neuerungen sind der DatePicker und der TimePicker. Auch diese beiden Steuerelemente sind ganz einfach in die Anwendung zu integrieren. Hierzu wird der MainPage.xaml der folgende Code hinzugefügt:


      
     

Wie man sehen kann, stellt auch der Date- und TimePicker die Property Header zur Verfügung (Abb. 2). Der TimePicker zeigt als Standardwert immer die aktuelle Uhrzeit. Der DatePicker stellt verschiedene Möglichkeiten zur Anzeige bereit (Tabelle 1).

Abb. 2: Anzeige des DatePicker- und TimePicker-Steuerelements

Tabelle 1: Möglichkeiten zur Anzeige des DatePickers

Format Code
Jan/01/14

DayFormat=“{}{day.integer(2)}“

MonthFormat=“{}{month.full}“

YearFormat=“{}{year.abbreviated(2)}“

Jan/1/14

DayFormat=“{}{day.integer}“

MonthFormat=“{}{month.abbreviated}“

YearFormat=“{}{year.abbreviated(4)}“

January/1 Sat/14

DayFormat=“{}{day.integer} {dayofweek.abbreviated}“

MonthFormat=“{}{month.full}“

YearFormat=“{}{year.abbreviated}“

02/1 Wednesday/2014

DayFormat=“{}{day.integer} {dayofweek.full}“

MonthFormat=“{}{month.integer(2)}“

YearFormat=“{}{year.full}“/>

Startet man nun die Anwendung, kann man mit einem Klick bzw. Touch auf die Steuerelemente ein Datum oder eine Uhrzeit auswählen (Abb. 3 und Abb. 4).

Abb. 3: Auswahl eines Datums

Abb. 4: Auswahl eines Datums

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -