原文:
重新想象 Windows 8.1 Store Apps (77) - 控件增强: 文本类控件的增强, 部分控件增加了 Header 属性和 HeaderTemplate 属性, 部分控件增加了 PlaceholderText 属性
重新想象 Windows 8.1 Store Apps (77) - 控件增强: 文本类控件的增强, 部分控件增加了 Header 属性和 HeaderTemplate 属性, 部分控件增加了 PlaceholderText 属性
作者：webabcd
介绍
重新想象 Windows 8.1 Store Apps 之控件增强
- 文本类控件的增强
- 为一些控件增加了 Header 属性和 HeaderTemplate 属性
- 为一些控件增加了 PlaceholderText 属性
示例
1、演示文本类控件的新增功能
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"> <!--文本显示类控件新增了 MaxLines 属性：用于指定文本最大的显示行数--> <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> <!--文本输入类控件新增了 PreventKeyboardDisplayOnProgrammaticFocus 属性：当通过编程方式在文本框上设置焦点时，是否不显示屏幕触摸键盘--> <TextBox Margin="0 10 10 0" PreventKeyboardDisplayOnProgrammaticFocus="True" /> <!-- 文本显示类控件和文本输入类控件： IsTextSelectionEnabled - 用于指定文本是否可以选中 SelectionHighlightColor - 用于指定选中文本的颜色 --> <TextBlock Text="webabcd" FontSize="14.667" Margin="0 10 0 0" IsTextSelectionEnabled="True"> <TextBlock.SelectionHighlightColor> <SolidColorBrush Color="Red" /> </TextBlock.SelectionHighlightColor> </TextBlock> <!--文本输入类控件新增了 Paste 事件--> <TextBox Name="txtPaste" PlaceholderText="自定义粘贴文本数据" Paste="txtPaste_Paste" Margin="0 10 0 0" /> <!-- 文本显示类控件 TextTrimming.None - 不修整文本 TextTrimming.Clip - 在像素级别修整文本（win8.1 新增） TextTrimming.WordEllipsis - 在单词级别修整文本，同时用省略号代替剩余文本 TextTrimming.CharacterEllipsis - 在字符级别修整文本，同时用省略号代替剩余文本（win8.1 新增） --> <TextBlock FontSize="24" HorizontalAlignment="Left" Text="abcdefghijklmnopqrstuvwxyz" Width="200" Margin="0 10 0 0" TextTrimming="None"/> <TextBlock FontSize="24" HorizontalAlignment="Left" Text="abcdefghijklmnopqrstuvwxyz" 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"/> <!-- 新增的 TextWrapping.WrapWholeWords 仅针对文本显示类控件： TextWrapping.NoWrap - 不换行（文本显示类控件和文本输入类控件可用） TextWrapping.Wrap - 换行，必要时可截断单词（文本显示类控件和文本输入类控件） TextWrapping.WrapWholeWords - 换行，但是绝不截断单词，即使单词可能会显示不全（仅针对文本显示类控件，win8.1 新增） --> <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
/* * 本例演示文本类控件的新增功能 * * * 关于文本类控件的基础请参见： * 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(); } // 当在一个文本输入类控件中粘贴时触发的事件 private async void txtPaste_Paste(object sender, TextControlPasteEventArgs e) { // 关于剪切板的基础请参见：http://www.cnblogs.com/webabcd/archive/2013/07/08/3177123.html DataPackageView dataPackageView = Windows.ApplicationModel.DataTransfer.Clipboard.GetContent(); // 判断剪切板中是否有文本数据 if (dataPackageView.Contains(StandardDataFormats.Text)) { try { // 获取剪切板中的文本数据 string text = await dataPackageView.GetTextAsync(); // 用我们自定义的方式粘贴数据 txtPaste.Text = text + text; } catch { } } else { } // 已经处理粘贴操作了，其他路由不用再处理了 e.Handled = true; } } }
2、控件 ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, RichEditBox 增加了 Header 属性和 HeaderTemplate 属性
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"> <!-- 控件 ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, RichEditBox 增加了 Header 属性和 HeaderTemplate 属性 --> <!-- 设置 TextBox 的 HeaderTemplate --> <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
/* * 控件 ComboBox, Slider, DatePicker, TimePicker, TextBox, PasswordBox, RichEditBox 增加了 Header 属性和 HeaderTemplate 属性 * 1、Header - 可以设置一个纯文本，不能命中测试，空 Header 的话不会占用任何空间 * 2、HeaderTemplate - 可以将 Header 设置为任何 xaml，且支持命中测试 */ 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; // 设置 TextBox 的 HeaderTemplate 和 Header textBox.HeaderTemplate = null; textBox.Header = "Editable TextBox"; } } }
3、控件 ComboBox, PasswordBox, RichEditBox, SearchBox, TextBox 增加了 PlaceholderText 属性
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"> <!-- 控件 ComboBox, PasswordBox, RichEditBox, SearchBox, TextBox 增加了 PlaceholderText 属性 --> <!-- 设置 ComboBox 的 PlaceholderText --> <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> <!-- 设置 PasswordBox 的 PlaceholderText --> <PasswordBox Header="Password" PlaceholderText="Enter your password" Margin="0 20 20 0" /> </StackPanel> </Grid> </Page>
PlaceholderTextDemo.xaml.cs
/* * 控件 ComboBox, PasswordBox, RichEditBox, SearchBox, TextBox 增加了 PlaceholderText 属性 */ using Windows.UI.Xaml.Controls; namespace Windows81.Controls { public sealed partial class PlaceholderTextDemo : Page { public PlaceholderTextDemo() { this.InitializeComponent(); } } }
OK
[源码下载]
