Imagine Windows 8.1 Store Apps (77)

[Download source code]

Re-imagine Windows 8.1 Store Apps (77)-control enhancement: Enhancement of text controls. Some controls Add the Header and HeaderTemplate attributes, and some controls Add the PlaceholderText attributes.

Author: webabcd


Introduction
Re-imagine Windows 8.1 Store Apps control enhancement

• Enhancement of text controls
• Added the Header and HeaderTemplate attributes for some controls.
• Added the PlaceholderText attribute for some controls.

Example
1. Demonstrate new functions of text controls
TextDemo. xaml

<Page x: Class = "Windows81.Controls. TextDemo" xmlns =" http://schemas.microsoft.com/winfx/2006/xaml /Presentation "xmlns: x =" http://schemas.microsoft.com/winfx/2006/xaml "Xmlns: local =" using: Windows81.Controls "xmlns: d =" http://schemas.microsoft.com/expression/blend/2008 "Xmlns: mc =" http://schemas.openxmlformats.org/markup-compatibility/2006 "Mc: Ignorable =" d "> <Grid Background =" Transparent "> <StackPanel Margin =" 120 0 0 0 "> <! -- Added the MaxLines attribute for the text display control: used to specify the maximum number of lines displayed in the text --> <TextBlock FontSize = "14.667" MaxLines = "3"> <TextBlock. inlines> <Run> 111111 </Run> <LineBreak/> <Run> 222222 </Run> <LineBreak/> <Run> 333333 </Run> <LineBreak/> <Run> 444444 </Run> <LineBreak/> <Run> 555555 </Run> <LineBreak/> <Run> 666666 </Run> </TextBlock. inlines> </TextBlock> <! -- The PreventKeyboardDisplayOnProgrammaticFocus attribute is added to the text input control: when the focus is set on the text box programmatically, whether or not to display the screen touch keyboard --> <TextBox Margin = "0 10 10 0" PreventKeyboardDisplayOnProgrammaticFocus = "True"/> <! -- Text display controls and text input controls: isTextSelectionEnabled-used to specify whether the Text can be selected SelectionHighlightColor-used to specify the color of the selected Text --> <TextBlock Text = "webabcd" FontSize = "14.667" Margin = "0 10 0 0" IsTextSelectionEnabled = "True"> <TextBlock. selectionHighlightColor> <SolidColorBrush Color = "Red"/> </TextBlock. selectionHighlightColor> </TextBlock> <! -- The Paste event is added to the text input control --> <TextBox Name = "txtPaste" PlaceholderText = "Custom pasted text data" Paste = "txtPaste_Paste" Margin = "0 10 0 0" /> <! -- TextTrimming. none-do not trim text TextTrimming. clip-trim text at pixel level (New in win8.1) TextTrimming. wordEllipsis-trim text at the word level and replace the remaining text TextTrimming with ellipsis. characterEllipsis-trim text at the character level and replace the remaining text with ellipsis (New in win8.1) --> <TextBlock FontSize = "24" HorizontalAlignment = "Left" Text = "abcdefghijklmnopqrstuvwxyz" Width = "200" Margin = "0 10 0 0" TextTrimming = "None"/> <textBlock FontSize = "24" HorizontalAlignment = "Left" Text = "abcde Margin "Width =" 200 "Margin =" 0 10 0 0 "TextTrimming =" Clip "/> <TextBlock FontSize =" 24 "HorizontalAlignment =" Left "Text =" abcdef ghijklm nopqrstuvwxyz "Width =" 200 "Margin =" 0 10 0 0 "TextTrimming =" WordEllipsis "/> <TextBlock FontSize =" 24 "HorizontalAlignment =" Left "Text =" abcdef ghijklm nopqrstuvwxyz" width = "200" Margin = "0 10 0 0" TextTrimming = "CharacterEllipsis"/> <! -- Added TextWrapping. wrapWholeWords is only a text display class control: TextWrapping. noWrap-do not wrap (text display controls and text input controls are available) TextWrapping. wrap-line feed. If necessary, word (text display control and text input control) TextWrapping can be truncated. wrapWholeWords-line feed, but never truncate the word, even if the word may not be displayed completely (only for the text display class control, win8.1 is added) --> <TextBlock FontSize = "24.667" HorizontalAlignment = "Left" Width = "100" Height = "60" Text = "iamwebabcd w" Margin = "0 10 0 0" TextWrapping = "NoWrap"/> <TextBlock FontSize = "24.667" HorizontalAlignment = "Left" Width = "100" Height = "60" Text = "iamwebabcd w" Margin = "0 10 0 0 "TextWrapping =" Wrap "/> <TextBlock FontSize =" 24.667 "HorizontalAlignment =" Left "Width =" 100 "Height =" 60 "Text =" iamwebabcd w "Margin =" 0 10 0 0 "TextWrapping =" WrapWholeWords "/> </StackPanel> </Grid> </Page>

TextDemo. xaml. cs

/** This example shows how to add a text control. ** for the basics of text control, see :* http://www.cnblogs.com/webabcd/archive/2013/01/07/2848564.html */Using System; using Windows. applicationModel. dataTransfer; using Windows. UI. xaml. controls; namespace Windows81.Controls {public sealed partial class TextDemo: Page {public TextDemo () {this. initializeComponent ();} // event private async void txtPaste_Paste (object sender, TextControlPasteEventArgs e) triggered when pasted in a text input control) {// For more information about the foundation of the clipboard, see: http://www.cnblogs.com/webabcd/archive/2013/07/08/3177123.html DataPackageView dataPackageView = Windows. applicationModel. dataTransfer. clipboard. getContent (); // determines whether the Clipboard contains text data if (dataPackageView. contains (StandardDataFormats. text) {try {// obtain the text data in the clipboard string Text = await dataPackageView. getTextAsync (); // paste the data txtPaste in our custom method. text = text + text;} catch {} else {} // The paste operation has been processed. Other routes do not need to process e. handled = true ;}}}

2. added the Header and HeaderTemplate attributes to the ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, and RichEditBox controls.
ControlHeader. xaml

<Page x: Class = "Windows81.Controls. ControlHeader" xmlns =" http://schemas.microsoft.com/winfx/2006/xaml /Presentation "xmlns: x =" http://schemas.microsoft.com/winfx/2006/xaml "Xmlns: local =" using: Windows81.Controls "xmlns: d =" http://schemas.microsoft.com/expression/blend/2008 "Xmlns: mc =" http://schemas.openxmlformats.org/markup-compatibility/2006 "Mc: Ignorable =" d "> <Grid Background =" Transparent "> <StackPanel Margin =" 120 0 0 0 "> <! -- Controls ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, and RichEditBox Add the Header attribute and HeaderTemplate attribute --> <! -- Set the HeaderTemplate of TextBox --> <TextBox Name = "textBox" IsReadOnly = "True" Margin = "0 0 20 0"> <TextBox. headerTemplate> <DataTemplate> <Button Content = "Click to edit" Click = "Button_Click"/> </DataTemplate> </TextBox. headerTemplate> </TextBox> </StackPanel> </Grid> </Page>

ControlHeader. xaml. cs

/** Controls ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, and RichEditBox Add the Header attribute and HeaderTemplate attribute * 1. Header-you can set a plain text parameter and cannot hit the test, empty headers do not occupy any space * 2. HeaderTemplate-you can set the Header to any xaml and support hit testing */using Windows. UI. xaml; using Windows. UI. xaml. controls; namespace Windows81.Controls {public sealed partial class ControlHeader: Page {public ControlHeader () {this. initializeComponent ();} private void Button_Click (object sender, RoutedEventArgs e) {textBox. isReadOnly = false; // set the HeaderTemplate and Header TextBox of textBox. headerTemplate = null; textBox. header = "Editable TextBox ";}}}

3. The PlaceholderText attribute is added to the ComboBox, PasswordBox, RichEditBox, SearchBox, and TextBox controls.
PlaceholderTextDemo. xaml

<Page x: Class = "Windows81.Controls. PlaceholderTextDemo" xmlns =" http://schemas.microsoft.com/winfx/2006/xaml /Presentation "xmlns: x =" http://schemas.microsoft.com/winfx/2006/xaml "Xmlns: local =" using: Windows81.Controls "xmlns: d =" http://schemas.microsoft.com/expression/blend/2008 "Xmlns: mc =" http://schemas.openxmlformats.org/markup-compatibility/2006 "Mc: Ignorable =" d "> <Grid Background =" Transparent "> <StackPanel Margin =" 120 0 0 0 "> <! -- The PlaceholderText attribute is added to the ComboBox, PasswordBox, RichEditBox, SearchBox, and TextBox controls --> <! -- Set PlaceholderText for ComboBox --> <ComboBox Header = "Colors" PlaceholderText = "Pick a color" Margin = "0 0 20 0"> <x: String> Blue </x: string> <x: String> Green </x: String> <x: String> Red </x: String> <x: String> Yellow </x: string> </ComboBox> <! -- Set PlaceholderText of PasswordBox --> <PasswordBox Header = "Password" PlaceholderText = "Enter your password" Margin = "0 20 0"/> </StackPanel> </Grid> </Page>

PlaceholderTextDemo. xaml. cs

/** The PlaceholderText attribute is added to the ComboBox, PasswordBox, RichEditBox, SearchBox, and TextBox controls */using Windows. UI. xaml. controls; namespace Windows81.Controls {public sealed partial class PlaceholderTextDemo: Page {public PlaceholderTextDemo () {this. initializeComponent ();}}}

OK
[Download source code]