syncfusion-wpf-smart-text-editor

实现 Syncfusion WPF 智能文本编辑器

何时使用此技能

当用户需要以下功能时，请使用此技能：

• 实现 AI 驱动的文本输入，提供预测建议和上下文感知补全
• 在 WPF 应用程序的多行文本编辑器中添加智能自动补全
• 集成 AI 服务（Azure OpenAI、OpenAI、Ollama 或自定义提供程序）以生成文本
• 创建智能文本字段，用于客户支持、撰写电子邮件或创作内容
• 构建响应式文本编辑器，支持内联或弹出式建议显示模式
• 自定义建议行为，支持用户角色、自定义短语和样式选项
• 处理文本更改事件并为文本编辑器实现命令模式
• 在 AI 不可用时通过自定义短语库提供离线建议

智能文本编辑器（SfSmartTextEditor）适用于需要智能输入辅助、品牌化回复模板和 AI 增强型用户输入的场景。

组件概览

Syncfusion WPF 智能文本编辑器是一种多行输入控件，可通过预测建议加快输入速度。它可集成 AI 推理服务，提供上下文感知补全，并支持内联或弹出式建议显示模式。主要功能包括：

核心功能：

• 通过 IChatInferenceService 提供 AI 驱动的建议
• 内联和弹出式建议显示模式
• 用于离线建议的自定义短语库
• 键盘集成（按 Tab、向右箭头键接受建议）
• 手势支持（点击以显示弹出式建议）
• 最大长度验证
• 支持自定义样式的占位文本
• 完整的 UI 自定义功能（字体、颜色、大小）
• 命令支持（TextChangedCommand）

支持的 AI 提供程序：

• Azure OpenAI
• OpenAI
• Ollama（可自托管模型）
• 通过 IChatInferenceService 接口接入的自定义服务
• Claude AI（Anthropic）
• DeepSeek AI
• Google Gemini AI
• Groq AI

文档和导航指南

入门和安装

📄 阅读： references/getting-started.md

• 安装 Syncfusion.SfSmartComponents.WPF NuGet 包
• 通过设计器、XAML 或 C# 添加控件
• 配置用于建议的 UserRole 和 UserPhrases
• 在 App.xaml.cs 中注册 AI 服务
• 运行应用程序并验证 AI 功能

**何时阅读：**开始实现新的智能文本编辑器、设置开发环境，或将控件添加到现有 WPF 项目时。

建议显示模式

📄 阅读： references/suggestion-display-modes.md

• 内联模式：在插入符后就地呈现建议
• 弹出模式：在插入符附近显示紧凑提示浮层
• 键盘快捷键（Tab、向右箭头键）
• 手势支持（点击）
• 在内联和弹出模式之间进行选择

**何时阅读：**用户需要配置建议的显示方式、切换显示模式，或针对桌面设备与触控设备进行优化时。

自定义和样式

📄 阅读： references/customization.md

• 自定义文本样式（FontSize、Foreground、字体）
• 自定义占位文本和颜色
• 建议文本颜色（SuggestionInlineStyle）
• 建议弹出窗口背景（SuggestionPopupStyle）
• 最大输入长度（MaxLength 属性）
• 完整的样式示例

**何时阅读：**自定义外观以匹配应用程序主题、更改文本样式、配置占位文本或设置字符限制时。

命令

📄 阅读： references/commands.md

• TextChangedCommand 概述和实现
• 在 XAML 中绑定命令
• 用于命令处理的 ViewModel 模式
• 事件处理模式
• 跟踪文本更改的使用场景

**何时阅读：**实现文本更改通知、MVVM 命令模式或自定义事件处理逻辑时。

AI 服务配置（内置提供商）

📄 阅读： references/ai-service-configuration.md

• 在 App.xaml.cs 中注册聊天客户端
• Azure OpenAI 配置（部署、API 密钥、终结点）
• OpenAI 配置（API 密钥、模型选择）
• Ollama 可自托管模型（安装、本地设置）
• 各提供商所需的 NuGet 包
• 内置 AI 提供商故障排除

何时阅读： 为 AI 驱动的建议配置 Azure OpenAI、OpenAI 或 Ollama。使用本文设置官方/内置 AI 提供商。

常见模式

模式 1：支持工单回复编辑器

场景： 带品牌化回复的客户支持应用。

<syncfusion:SfSmartTextEditor
    Placeholder="Write your response..."
    UserRole="Technical support engineer helping customers with product issues"
    MaxLength="2000"
    SuggestionDisplayMode="Inline">
    <syncfusion:SfSmartTextEditor.UserPhrases>
        <sys:String>Thanks for contacting Syncfusion support.</sys:String>
        <sys:String>Could you please share a reproducible sample?</sys:String>
        <sys:String>We've logged this as a bug and will update you soon.</sys:String>
        <sys:String>Let us know if you need further assistance.</sys:String>
    </syncfusion:SfSmartTextEditor.UserPhrases>
</syncfusion:SfSmartTextEditor>

模式 2：使用自定义样式撰写电子邮件

场景： 带自定义主题和弹出建议的电子邮件客户端。

<syncfusion:SfSmartTextEditor
    Placeholder="Compose your email..."
    UserRole="Professional email author"
    SuggestionDisplayMode="Popup"
    MaxLength="5000">
    <syncfusion:SfSmartTextEditor.Style>
        <Style TargetType="{x:Type syncfusion:SfSmartTextEditor}">
            <Setter Property="FontSize" Value="14"/>
            <Setter Property="Foreground" Value="#333333"/>
            <Setter Property="FontFamily" Value="Segoe UI"/>
        </Style>
    </syncfusion:SfSmartTextEditor.Style>
    <syncfusion:SfSmartTextEditor.SuggestionPopupStyle>
        <Style TargetType="syncfusion:SuggestionPopup">
            <Setter Property="Background" Value="#0078D4"/>
            <Setter Property="Foreground" Value="White"/>
        </Style>
    </syncfusion:SfSmartTextEditor.SuggestionPopupStyle>
</syncfusion:SfSmartTextEditor>

模式 3：带更改跟踪的文本编辑器

场景： 跟踪文本更改，以便自动保存或验证。

<syncfusion:SfSmartTextEditor
    x:Name="smartTextEditor"
    TextChangedCommand="{Binding TextChangedCommand}"
    Placeholder="Start typing..."/>

public class EditorViewModel : INotifyPropertyChanged
{
    public ICommand TextChangedCommand { get; }

    public EditorViewModel()
    {
        TextChangedCommand = new RelayCommand(OnTextChanged);
    }

    private void OnTextChanged()
    {
        // Auto-save, validation, or tracking logic
        Debug.WriteLine("Text changed - triggering auto-save");
    }
}

模式 4：离线优先并使用自定义短语

场景： 无 AI 连接时也能正常工作的应用。

<syncfusion:SfSmartTextEditor
    Placeholder="Type your message..."
    UserRole="Sales representative responding to leads">
    <syncfusion:SfSmartTextEditor.UserPhrases>
        <sys:String>Thank you for your interest in our products.</sys:String>
        <sys:String>I'd be happy to schedule a demo.</sys:String>
        <sys:String>Our pricing starts at $99 per month.</sys:String>
        <sys:String>Let me connect you with our solutions team.</sys:String>
        <sys:String>Feel free to reach out with any questions.</sys:String>
    </syncfusion:SfSmartTextEditor.UserPhrases>
</syncfusion:SfSmartTextEditor>

注意： 如果未配置 AI 服务，编辑器会自动回退到 UserPhrases 来提供建议。

关键属性

属性	类型	说明	默认值
Text	string	获取或设置文本内容	""
Placeholder	string	编辑器为空时显示的占位文本	null
UserRole	string	描述输入者身份和意图（影响 AI 建议）	null
UserPhrases	List<string>	用于离线建议的自定义短语库	null
SuggestionDisplayMode	SuggestionDisplayMode	显示模式：Inline 或 Popup	Inline
MaxLength	int	最大字符数限制	0（不受限制）
TextChangedCommand	ICommand	文本更改时触发的命令	null
Style	Style	文本样式（FontSize、Foreground 等）	Default
PlaceholderStyle	Style	占位文本样式	Default
SuggestionInlineStyle	Style	内联建议文本样式	Default
SuggestionPopupStyle	Style	弹出建议背景样式	Default

常见用例

用户需要内联建议时（桌面端）

• 操作： 设置 SuggestionDisplayMode="Inline"
• 原因： 在键盘驱动的设备上实现自然的输入流程
• 参考： suggestion-display-modes.md

用户需要弹出建议时（触摸设备）

• 操作： 设置 SuggestionDisplayMode="Popup"
• 原因： 在移动设备/触摸屏上更容易点按
• 参考： suggestion-display-modes.md

用户需要集成 Azure OpenAI 时

• 操作： 在 App.xaml.cs 中配置 AzureOpenAIClient
• 原因： 借助 Azure 安全性与合规性，提供企业级 AI
• 参考： ai-service-configuration.md

用户需要字符数限制时

• 操作： 设置 MaxLength 属性
• 原因： 强制执行输入验证并防止文本过长
• 参考： customization.md

用户需要文本更改通知时

• 操作： 将 TextChangedCommand 绑定到 ViewModel
• 原因： 跟踪更改，以便自动保存、验证或进行分析
• 参考： commands.md

用户需要离线建议时

• 操作： 在不配置 AI 服务的情况下设置 UserPhrases
• 原因： 在 AI 不可用或已禁用时提供建议
• 参考： getting-started.md

用户需要自定义主题时

• 操作： 应用 Style、PlaceholderStyle、SuggestionInlineStyle
• 原因： 匹配应用品牌和设计系统
• 参考： customization.md

---

后续步骤：

1. 如需初始设置和安装 → 阅读 getting-started.md
2. 如需配置 AI 提供商 → 阅读 ai-service-configuration.md
3. 如需自定义外观 → 阅读 customization.md