• 41、XAML text editing


    1、Windows 8 text selection :

         文本的选择在 win8 中为触摸做了优化。手势为选择创建、处理和指挥(如剪切、复制、粘贴)都以触摸为中心的。单击一个单词就选中了

    它。一旦选中了文本,选取器就会在两端显示,这个选取器可以在控件中的文本向前或者向后进行拖动。

        静态文本控件拥有默认的上下文菜单用来存储操作,比如,复制,显示在你的指尖上。尝试着轻击或者保持按住,然后在选中的文本上拿

    开手指,就会弹出一个上下文菜单。

        在一个单词的前面或者后面插入表情符号,取决于你单击的 点 离单词的两端的哪端更近一些。一旦放置完一个表情符号,一个夹子

    就会在表情符号下面显示。这个夹子可以响应单击操作,并可以在附近拖拽。当你拖拽这个符号夹子时,在你手势的方向会创建一个

    选择区域。

          试着在可编辑的文本中调出上下文菜单,你可以注意到从中又更多的命令可以选择。

    显示截图:

      在只读的 TextBlock 中

    xaml:

    <TextBlock Height="250" Width="400"  IsTextSelectionEnabled="True" 
    TextWrapping
    ="Wrap" TextTrimming="WordEllipsis"
    Text
    ="Lorem ipsum dolor sit amet, consectetur adipiscing elit."/>

    在可以编辑的 TextBox 中:

    xaml :

    <TextBox Height="250" Width="400"  TextWrapping="Wrap" AcceptsReturn="True" 
    Text
    ="Lorem ipsum dolor sit amet, consectetur adipiscing elit." />

    2、Accessing Text selection:

           在 TextBox 和 TextBlock 这类文本控件中用户很容易控制选中的文本。这个实例演示怎样使用 SelectedText 属性用来获得一个

    TextBox 中选中的内容。

           当你选中下面 TextBox 中的文本时,选中的文本会映射到下面的 TextBlock 中。

    显示截图:

    页面中的 XAML :

     <TextBox x:Name="selectionTextBox" TextWrapping="Wrap" AcceptsReturn="True" 
    Width
    ="400" Height="200" Text="Lorem ipsum dolor sit amet,
    consectetur adipiscing elit. In ligula nisi, vehicula nec eleifend vel, rutrum non dolor."
    />

    <TextBlock Text="{Binding ElementName=selectionTextBox, Path=SelectedText}" Foreground="Gray" Width="400"/>


    3、Spell Checking:

             在 TextBox  和 RichEditBox 这两个文本控件中,通过设置 IsSpellCheckEnabled 布尔属性,拼写检查都可以使用的。

    这个特性检查用户通过键盘输入的内容。

           试着更改键盘的布局,并且注意到用于拼写检查的字典也会相应的进行更改。

     

      xaml :

     <TextBox   IsSpellCheckEnabled="True" Width="400" Height="200"/>

    4、Text predication:

         文本预测在  XAML 文本编辑控件中是另一个很棒的功能支持。当使用软键盘,为了预测目前正在输入的这个词的组成,XAML 文本控件会追踪用户的输入。

    在插入符号附近显示一个建议的单词。如果用户点击这个词, 就会进入文本控件。

    <TextBox  IsTextPredictionEnabled="True"  Width="400" Height="200" />


    5、Input scopes :

           这个 input scope 告诉软键盘一些关于开发人员期望用户输入文本区域的数据类型。

    xaml:

    <!--Default-->
    <TextBox Width="200" HorizontalAlignment="Left" InputScope="Default"/>
    
    <!--Search-->
     <TextBox Width="200" HorizontalAlignment="Left" InputScope="Search"/>
    
    <!--Url-->
     <TextBox Width="200" HorizontalAlignment="Left" InputScope="Url"/>
    
    <!--EmailSmtpAddress-->
     <TextBox Width="200" HorizontalAlignment="Left" InputScope="EmailSmtpAddress" />
    
    <!--TelephoneNumber-->
     <TextBox Width="200" HorizontalAlignment="Left" InputScope="TelephoneNumber" />
    
    
    <!--Number-->
     <TextBox Width="200" HorizontalAlignment="Left" InputScope="Number" />

    6、RichEditBox and WinRT  TOM:

        在 RichEditBox 控件中的文档属性,暴露了 WinRT 文本对象模型 (TOM)中一些很强大的 APIs。如果你曾经用过

    富文本编辑你会对这个 TOM 模型很容易理解。

       

        文档(ITextDocument):

     ·  内容的序列化

    ·  获取选中内容

    ·  撤销/重做 功能

    ·  默认内容格式化

       安排(ITextRange)

    ·  内容修正

    ·  包含搜索的内容导航

        选择(ITextSelection)

    ·  选取内容的修正

       段落属性(ITextParagrahFormat)

    ·  列表

    ·  对齐

    ·  缩进

    ·  行距

       字符属性(ITextCharacterFormat)

    ·  前景色/背景色

    ·  样式、拉伸

    ·  超链接

    ·  其它格式化(例如,字距调整、下划线、删除线,等等……)

    显示截图:

    点击 “Font Color” 按钮 :

    页面的 xaml :

       <StackPanel Orientation="Horizontal">
    
      <!--加粗-->
      <Button Click="BoldButtonClick" IsTabStop="False" Margin="0, 0, 20, 0">Bold</Button>
                   
    
    <!--斜体--> <Button Click="ItalicButtonClick" IsTabStop="False" Margin="0, 0, 20, 0">Italic</Button>

    <TextBlock Style="{StaticResource BasicTextStyle}" Text="Find:" VerticalAlignment="Center"/> <!--输入查找文字--> <TextBox x:Name="findBox" Width="200" Height="20" TextChanged="FindBoxTextChanged"
    GotFocus
    ="FindBoxGotFocus" LostFocus="FindBoxLostFocus" Margin="0, 0, 20, 0"/> <Grid x:Name="fontColorGrid"> <Button x:Name="fontColorButton" Click="FontColorButtonClick" IsTabStop="False"
    LostFocus
    ="FontColorButtonLostFocus">Font Color</Button> <!--字体颜色弹出框, 默认 IsOpen="False"--> <Popup x:Name="fontColorPopup" IsOpen="False"> <Border BorderBrush="Gray" BorderThickness="2" Background="White"> <Grid> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Button x:Name="black" Click="ColorButtonClick"> <Button.Content> <Rectangle Fill="Black" Width="50" Height="25"/> </Button.Content> </Button> <Button x:Name="gray" Click="ColorButtonClick" Grid.Row="1"> <Button.Content> <Rectangle Fill="Gray" Width="50" Height="25"/> </Button.Content> </Button> <Button x:Name="darkgreen" Click="ColorButtonClick" Grid.Column="1"> <Button.Content> <Rectangle Fill="DarkGreen" Width="50" Height="25"/> </Button.Content> </Button> <Button x:Name="green" Click="ColorButtonClick" Grid.Row="1" Grid.Column="1"> <Button.Content> <Rectangle Fill="Green" Width="50" Height="25"/> </Button.Content> </Button> <Button x:Name="blue" Click="ColorButtonClick" Grid.Column="2"> <Button.Content> <Rectangle Fill="Blue" Width="50" Height="25"/> </Button.Content> </Button> <Button Click="ColorButtonClick" Grid.Row="2" Grid.Column="2">Close</Button> </Grid> </Border> </Popup> </Grid> </StackPanel> <!--进行操作的文本框--> <RichEditBox x:Name="editor" ScrollViewer.VerticalScrollBarVisibility="Visible" Grid.Row="1" Height="300" Width="500" VerticalAlignment="Top" />

    相应的  C#  :

    给富文本框添加文本,在页面的构造函数中调用下面的方法 :

     private async void LoadContentAsync()
            {
                //工程中的文件
                StorageFile file = await Windows.ApplicationModel.Package.Current.InstalledLocation.GetFileAsync("TextFile.RTF ");
                IRandomAccessStream randAccStream = await file.OpenAsync(FileAccessMode.Read);
    
                // 从流中加载文档。
                //  将输入文本作为 RTF 格式(RTF 文本将得到验证)。
                editor.Document.LoadFromStream(TextSetOptions.FormatRtf, randAccStream);
            }

    //首先声明一个全局的列表

    // ITextRange  :  表示文档中持续文本的范围并提供强大的编辑与数据
    //绑定属性以及允许应用程序对文档文本进行选择、检查和更改的方法。
     List<ITextRange> m_highlightedWords =  new List<ITextRange>();


    加粗选中的文本:

    private void BoldButtonClick(object sender, RoutedEventArgs e)
    {
    
        // Document : 获取一个对象,该对象为 RichEditBox 中包含的文本启用对文本对象模型的访问。
        ITextSelection selectedText = editor.Document.Selection;
        if (selectedText != null)
        {
            ITextCharacterFormat charFormatting = selectedText.CharacterFormat;  //获取或设置文本范围的字符格式特性。
    
    
            //切换当前设置。
            charFormatting.Bold = FormatEffect.Toggle;
    
            //获取或设置文本范围的字符格式特性。
            selectedText.CharacterFormat = charFormatting;
        }
    }

    倾斜选择文本:

     private void ItalicButtonClick(object sender, RoutedEventArgs e)
     {
         ITextSelection selectedText = editor.Document.Selection;
         if (selectedText != null)
         {
             ITextCharacterFormat charFormatting = selectedText.CharacterFormat;
    
             // 获取或设置字符是否是斜体。
             charFormatting.Italic = FormatEffect.Toggle;
             selectedText.CharacterFormat = charFormatting;
         }
     }


    字体颜色按钮,点击弹出  Popup:

    private void FontColorButtonClick(object sender, RoutedEventArgs e)
    {
        fontColorPopup.IsOpen = true;
    
    // 尝试设置控件的焦点。
        fontColorButton.Focus(Windows.UI.Xaml.FocusState.Keyboard);
    }
    private void FontColorButtonLostFocus(object sender, RoutedEventArgs e)
    {
        fontColorPopup.IsOpen = false;
    }

    点击颜色弹出框中的按钮 :

     private void ColorButtonClick(object sender, RoutedEventArgs e)
     {
         Button clickedColor = (Button)sender;
    
         ITextCharacterFormat charFormatting = editor.Document.Selection.CharacterFormat;
         switch (clickedColor.Name)
         {
             case "black":
                 {
    
                     // 获取或设置前景色或文本颜色。
                     charFormatting.ForegroundColor = Colors.Black;
                     break;
                 }
    
             case "gray":
                 {
                     charFormatting.ForegroundColor = Colors.Gray;
                     break;
                 }
    
             case "darkgreen":
                 {
                     charFormatting.ForegroundColor = Colors.DarkGreen;
                     break;
                 }
    
             case "green":
                 {
                     charFormatting.ForegroundColor = Colors.Green;
                     break;
                 }
    
             case "blue":
                 {
                     charFormatting.ForegroundColor = Colors.Blue;
                     break;
                 }
    
             default:
                 {
                     charFormatting.ForegroundColor = Colors.Black;
                     break;
                 }
         }
         editor.Document.Selection.CharacterFormat = charFormatting;
    
         editor.Focus(Windows.UI.Xaml.FocusState.Keyboard);
         fontColorPopup.IsOpen = false;
     }

    搜索文本框  获取焦点、失去焦点事件:

     private void FindBoxTextChanged(object sender, TextChangedEventArgs e)
     {
         string textToFind = findBox.Text;
    
         if (textToFind != null)
             FindAndHighlightText(textToFind);
     }
    
    
    private void FindBoxLostFocus(object sender, RoutedEventArgs e)
    {
        ClearAllHighlightedWords();
    }
    
    private void FindBoxGotFocus(object sender, RoutedEventArgs e)
    {
        string textToFind = findBox.Text;
    
        if (textToFind != null)
            FindAndHighlightText(textToFind);
    }
    
    
    //清除之前的高亮的文本
    private void ClearAllHighlightedWords()
    {
        ITextCharacterFormat charFormat;
        for (int i = 0; i < m_highlightedWords.Count; i++)
        {
            charFormat = m_highlightedWords[i].CharacterFormat;
    
            //获取或设置文本背景(突出显示)色。
            charFormat.BackgroundColor = Colors.Transparent;
            m_highlightedWords[i].CharacterFormat = charFormat;
        }
    
         //从 List<T> 中移除所有元素。
        m_highlightedWords.Clear();
    }
    
    //查找搜索的文本,并且高亮显示
    private void FindAndHighlightText(string textToFind)
    {
        ClearAllHighlightedWords();
    
        // 检索文档的有效情景的新文本范围。
        //   startPosition:  相对于情景开头的新文本范围的起始位置。
        //   endPosition:  新文本范围的结束位置。
        // 返回结果:  新的文本范围。
        ITextRange searchRange = editor.Document.GetRange(0, TextConstants.MaxUnitCount); //获取最大单位计数。
    
        // 按 units 指定的数量向前或向后移动插入点。如果文本范围非退化,
        //则它将折叠到文本范围的开始或结束位置的插入点,具体取决于 
        //count,然后移动。
        searchRange.Move(0, 0);
    
        bool textFound = true;
        do
        {
    
             // 搜索范围中特定文本字符串,如果找到,则选择该字符串 
            if (searchRange.FindText(textToFind, TextConstants.MaxUnitCount, FindOptions.None) < 1)
                textFound = false;
            else
            {
                //创建与此文本范围对象相同的新对象。      
    m_highlightedWords.Add(searchRange.GetClone()); ITextCharacterFormat charFormatting
    = searchRange.CharacterFormat; //把匹配的文本的背景,显示为黄色 charFormatting.BackgroundColor = Colors.Yellow; searchRange.CharacterFormat = charFormatting; } } while (textFound); }

    7、PasswordBox :

        用户可以输入密码的 PasswordBox  控件,是一个安全的,并且开发人员可定制。你可以指定用户输入内容的显示的符号。注意到下面的

    文本框为每个字符显示 “ ? ” (默认是圆点)。另一个 Win8 提供的特性是密码框添加了一个 “显示文本” 的按钮。如果用户按住按钮 2秒钟

    ,密码框就会显示密码框中的文本。这样用户可以验证他们输入文本框中的内容。

    显示效果 :

     

    相应的  xaml :

      <PasswordBox   PasswordChar="?" IsPasswordRevealButtonEnabled="True"/>
  • 相关阅读:
    MyBatis学习之输入输出类型
    MyBatis学习之多表查询
    javascript学习之this
    Elasticsearch学习之Java操作1
    CSS学习之定位
    CSS学习之浮动
    CSS学习之盒子模型
    java学习之导出Excel
    转载:手把手教你做iOS推送
    拳头公司聊天服务架构:服务器篇
  • 原文地址:https://www.cnblogs.com/hebeiDGL/p/2771341.html
Copyright © 2020-2023  润新知