WPF 中用于原地编辑的可编辑 TextBlock

• 下载演示项目和源代码 - 14.12 KB

引言

当在 Windows 资源管理器文件夹树中重命名文件夹时，包含文件夹名称的 TextBlock 会更改为 TextBox，从而允许在树中编辑文件夹名称。 我找不到任何完整的示例，所以我决定自己做一个。EditableTextBlock 控件基于 WPF 中注释图像 这篇文章，作者是 Josh Smith.

Using the Code

基本上，该控件由一个用于显示文本的 TextBlock 和一个用于编辑的 TextBox 组成。 下面描述的 IsInEditMode 属性确定当前显示哪个。

EditableTextBlock 控件公开了四个属性

• string Text - 显示给用户的可编辑文本（注意下面的 TextFormat）。
• bool IsEditable - 控件是否可编辑。 如果不是，它就像一个普通的 TextBlock 一样运行。
• bool IsInEditMode - 控件当前是否正在被编辑。
• string TextFormat - 用于可编辑文本应被更多文本包围的情况，例如上面截图中的根节点。

在截图中标为“项目 1.1”的项目在 XAML 中定义如下

<TreeViewItem>
    <TreeViewItem.Header>
        <local:EditableTextBlock Text="Item 1.1" />
    </TreeViewItem.Header>
</TreeViewItem>

为了让用户编辑控件的内容，您必须将 IsInEditMode 属性设置为 true。 例如，当按下 F2 键时，演示应用程序允许用户编辑 TreeView 中选定的项目，通过使用 TreeView 的 KeyDown 事件

private void treeView1_KeyDown(object sender, KeyEventArgs e)
{
    if (e.Key == Key.F2)
        SetCurrentItemInEditMode(true);
}

private void SetCurrentItemInEditMode(bool EditMode)
{
    // Make sure that the SelectedItem is actually a TreeViewItem
    // and not null or something else
    if (treeView1.SelectedItem is TreeViewItem)
    {
        TreeViewItem tvi = treeView1.SelectedItem as TreeViewItem;

        // Also make sure that the TreeViewItem
        // uses an EditableTextBlock as its header
        if (tvi.Header is EditableTextBlock)
        {
            EditableTextBlock etb = tvi.Header as EditableTextBlock;

            // Finally make sure that we are
            // allowed to edit the TextBlock
            if (etb.IsEditable)
                etb.IsInEditMode = EditMode;
        }
    }
}

当发生以下四种情况之一时，控件将退出编辑模式

• 控件失去焦点，例如，当用户单击另一个控件时。
• 用户点击回车键，在这种情况下，编辑后的文本将保存在 Text 属性中。
• 用户点击 Escape 键，在这种情况下，恢复编辑开始之前的原始文本。
• IsInEditMode 属性被手动设置为 false。

TextFormat 属性

TextFormat 属性使用 String.Format 函数来格式化文本，这意味着可编辑文本由 {0} 在 string 中引用。 例如，演示应用程序中的根节点在 XAML 中定义如下

<TreeViewItem>
    <TreeViewItem.Header>
        <local:EditableTextBlock Text="Root" TextFormat="Root Item '{0}'" />
    </TreeViewItem.Header>
</TreeViewItem>

如果 TextFormat 属性设置为空 string ("")，仅包含 {0} ("{0}") 的 string，或者根本未设置，则控件将仅显示来自 Text 属性的 string。

历史

• 2008 年 12 月 8 日 - 创建了这篇文章
• 2008 年 12 月 8 日 - 更新了源代码