界面控件DevExpress中文教程 - 如何拓展具有AI功能的文本编辑器(二)

server/2025/2/12 21:48:39/

NLP是人工智能的一个分支,它允许计算机与人类语言进行交互,这包括以有意义/有用的方式理解、解释、生成和回应文本(和语音)的能力。基于NLP的功能允许更好的数据分析、个性化体验、高效的沟通,并导致更明智的决策和提高效率。例如:

  • 机器翻译
  • 文本摘要
  • 文本生成
  • 文本分类
  • 以及更多…

P.S:DevExpress拥有.NET开发需要的所有平台控件,包含600多个UI控件、报表平台、DevExpress Dashboard eXpressApp 框架、适用于 Visual Studio的CodeRush等一系列辅助工具。

在上文中(点击这里回顾>>)我们介绍了如何开始使用DevExpress AI支持的扩展,本文讲继续介绍如何在UI中启用AI驱动的扩展。

获取DevExpress v24.1正式版下载

开始使用DevExpress AI支持的扩展

在本节中,我将向您展示如何在WinForms、WPF和Blazor的DevExpress UI组件中启用DevExpress AI驱动的扩展。我们设计了不同的方式来与组件交互,并将前面提到的AI功能集成到您的DevExpress驱动的应用程序中。

WinForms — AI文本转换

AI驱动的文本转换扩展(操作)可以附加到以下DevExpress WinForms控件:

  • MemoEdit
  • Rich Text Editor
  • Spreadsheet Control

安装完DevExpress AI Client NuGet包过后,还需要安装以下DevExpress WinForms NuGet包:

  • DevExpress.AIIntegration.WinForms
  • DevExpress.Win.Design(启用DevExpress WinForms UI控件的设计时功能)

安装完成后,您需要在应用程序启动时注册AI客户端,DevExpress支持AI的扩展在AIExtensionsContainerDesktop容器中运行。这个容器管理所有注册的AI客户端,以便DevExpress WinForms UI控件可以自动利用适当的AI服务:

AIExtensionsContainerDesktop.Default.RegisterChatClientOpenAIService(
new AzureOpenAIClient(
new Uri(azureOpenAIEndpoint),
new System.ClientModel.ApiKeyCredential(azureOpenAIKey)),
deploymentName);

在工具箱中,找到BehaviorManager组件并将其拖放到窗体上。打开控件的智能标签菜单,点击"Edit Behaviors"。在屏幕上出现的Collection Editor中,创建所需的AI驱动操作,将他们附加到相应的UI控件,并配置操作设置(例如,温度)。

<a class=界面控件DevExpress中文教程 - 如何拓展具有AI功能的文本编辑器" height="1200" src="https://img-blog.csdnimg.cn/img_convert/fb17c872cff3957954e3941ffef4a1ea.png" width="1200" />

提示:如果您没有安装DevExpress.AIIntegration.WinForms包,BehaviorManager的智能标签菜单显示 "Register AI-Powered Behaviors",点击它来安装NuGet包(或在 .NET Framework应用程序中的程序集)。

<a class=界面控件DevExpress中文教程 - 如何拓展具有AI功能的文本编辑器" height="228" src="https://img-blog.csdnimg.cn/img_convert/b6f09121595026b46bd0c7b00e0a814b.png" width="650" />

WinForms — 智能粘贴

“SmartPaste”是一种人工智能驱动的功能,可以分析复制的信息,并智能地将正确的值分配给DevExpress数据网格中适当的数据字段/行单元格或基于布局控件的表单。

下图演示了这种功能的实际应用:

<a class=界面控件DevExpress中文教程 - 如何拓展具有AI功能的文本编辑器" height="299" src="https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=https%3A%2F%2Fimage.evget.com%2F2024%2F09%2F30%2F3lnu66joxsvtdlj2i.gif&pos_id=SKROoNI6" width="534" />

WPF — AI文本转换

对于早期预览版本(v24.2),AI驱动的功能可以在DevExpress WPF RichEdit、SpreadsheetControl和TextEdit组件中启用,并将TextWrapping属性设置为Wrap来实现多行编辑功能。

一旦您安装了一个DevExpress AI Client NuGet包,应该安装以下DevExpress WPF NuGet包:

  • DevExpress.AIIntegration.Wpf
  • DevExpress.Wpf

就像WinForms一样,在应用程序启动时在AIExtensionsContainerDesktop容器中注册一个AI客户端:

App.xaml.cs

protected override void OnStartup(StartupEventArgs e) {
base.OnStartup(e);
ApplicationThemeHelper.ApplicationThemeName = "Office2019Colorful";AIExtensionsContainerDesktop.Default.RegisterChatClientOpenAIService(
new AzureOpenAIClient(
new Uri(azureOpenAIEndpoint),
new System.ClientModel.ApiKeyCredential(azureOpenAIKey)),
deploymentName);
}

要在DevExpress WPF组件中启用AI支持的功能,请在承载它们的窗口中添加以下命名空间:

xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm"
xmlns:wpf="clr-namespace:DevExpress.AIIntegration.Wpf;assembly=DevExpress.AIIntegration.Wpf.v24.2"
xmlns:desktop="clr-namespace:DevExpress.AIIntegration.Desktop;assembly=DevExpress.AIIntegration.Desktop.v24.2"

并以以下方式将操作附加到控件上:

<dxe:TextEdit TextWrapping="Wrap">
<dxmvvm:Interaction.Behaviors>
<wpf:SummarizeBehavior/>
<wpf:ExplainBehavior/>
<wpf:ShortenBehavior/>
<wpf:ExpandBehavior />
<wpf:ToneStyleBehavior />
<wpf:ProofreadBehavior/>
<wpf:RewriteStyleBehavior/>
<wpf:CustomRequestBehavior/>
<wpf:TranslateBehavior>
<desktop:LanguageInfo Culture="de-DE"/>
<desktop:LanguageInfo Culture="es-ES"/>
<desktop:LanguageInfo Culture="pt-BR"/>
</wpf:TranslateBehavior>
</dxmvvm:Interaction.Behaviors>
</dxe:TextEdit>
Blazor

一旦您安装了DevExpress AI Client NuGet包,必须安装以下DevExpress Blazor NuGet包:

  • DevExpress.AIIntegration.Web
  • DevExpress.AIIntegration.Blazor.Common
  • DevExpress.AIIntegration.Blazor
  • DevExpress.AIIntegration.Blazor.RichEdit and/or DevExpress.AIIntegration.Blazor.HtmlEditor

在应用程序启动时调用AddDevExpressAI方法为Blazor平台注册AI服务:

Startup.cs:

using DevExpress.AIIntegration;
...
string azureOpenAIEndpoint = Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT");
string azureOpenAIKey = Environment.GetEnvironmentVariable("AZURE_OPENAI_API_KEY");
string deploymentName = "YourModelDeploymentName"
...
builder.Services.AddDevExpressAI((config) => {
var client = new AzureOpenAIClient(
new Uri(azureOpenAIEndpoint),
new AzureKeyCredential(azureOpenAIKey));
config.RegisterChatClientOpenAIService(client, deploymentName);
config.RegisterOpenAIAssistants(client, deploymentName);
});

DxRichEdit 和/或 DxHtmlEditor打开Razor页面,并声明如下的AdditionalSettings:

DxHtmlEditor:

@using DevExpress.AIIntegration.Blazor.HtmlEditor<DxHtmlEditor @bind-Markup="Value" CssClass="my-editor" BindMarkupMode="HtmlEditorBindMarkupMode.OnLostFocus">
<AdditionalSettings>
<SummaryAISettings />
<ExplainAISettings />
<ProofreadAISettings />
<ExpandAISettings />
<ShortenAISettings />
<CustomAISettings />
<RewriteAISettings />
<ToneAISettings />
<TranslateAISettings Languages="@("German, French, Chinese")" />
</AdditionalSettings>
</DxHtmlEditor>

DxRichEdit:

@using DevExpress.AIIntegration.Blazor.RichEdit
@using DevExpress.Blazor.RichEdit<DxRichEdit DocumentContent="DocumentContent" CssClass="my-editor">
<AdditionalSettings>
<SummaryAISettings />
<ExplainAISettings />
<ProofreadAISettings />
<ExpandAISettings />
<ShortenAISettings />
<CustomAISettings />
<RewriteAISettings />
<ToneAISettings />
<TranslateAISettings Languages="@("German, French, Chinese")" />
</AdditionalSettings>
</DxRichEdit>
大文本输入的用户体验

为了防止资源繁重的操作(在API成本和处理时间方面),我们的实现基于AIIntegration.ChatMaxTokensDefault属性值自动将大的文本块分成块(例如,段落、句子、单词等)。当用户选择的文本超过定义的限制时,系统会警告他们不能在单个操作中处理请求,并且系统会计算处理任务所需的阶段数。对话框出现后,用户可以选择按顺序处理文本并逐步查看结果,也可以选择同时完成所有操作。

此功能在所有支持的平台(WinForms, WPF和Blazor)上实现。


http://www.ppmy.cn/server/131641.html

相关文章

C#使用ITextSharp生成PDF文件实例详解

许多项目开发中需要生成PDF, 常规办法使用官方提供的Microsoft.Office.Interop.Worddll插件,但是这种方法需要完全安装OFFICE,另外版本不一致还会出现很多错误。一般不推荐使用。 下面介绍这种巧妙的用法,定能事半功倍。 本文使用ITextSharp完成功能。 首先,通过NuGet…

C++关于树的基础知识

首先区分概念 “度为m的树”指的是至少有一个结点的度是m&#xff0c;一定是非空树 “m叉树”指的是允许所有的结点都小于m&#xff0c;且可以是空树 常见考点&#xff1a; 度为m的树的第i层最多有个结点 &#xff08;对于m叉树也相同&#xff09; 第一层m的0次方 第二层m的…

JVM进阶调优系列(1)类加载器原理一文讲透

今天开始写JVM调优系列&#xff0c;并发编程系列也会继续穿插连载&#xff0c;让各位同学闲暇之余有更多阅读选择。 起笔写第一篇&#xff0c;并不好写。首先要构思整个系列的大概框架&#xff0c;一个好的框架一定是深度上由浅入深、逻辑上有严格顺序&#xff0c;读者订阅跟踪…

Python酷库之旅-第三方库Pandas(144)

目录 一、用法精讲 651、pandas.Timestamp.min属性 651-1、语法 651-2、参数 651-3、功能 651-4、返回值 651-5、说明 651-6、用法 651-6-1、数据准备 651-6-2、代码示例 651-6-3、结果输出 652、pandas.Timestamp.minute属性 652-1、语法 652-2、参数 652-3、功…

【HarmonyOS开发笔记 1】 -- 开发环境的搭建

DevEco Studio 的下载与安装 下载 下载路径&#xff1a; https://developer.huawei.com/consumer/cn/download/ 安装 解压后双击 deveco-studio-5.0.3.814.exe 指定安装目录&#xff0c;或者默认&#xff0c;然后下一步 一直“下一步”&#xff0c; 直到最后安装完成 新…

Unity中搜索不到XR Interaction Toolkit包解决方法

问题&#xff1a; 针对Unity版本2020.3在中PackageManager可能搜素不到XR Interaction Toolkit包 在Package Manager中未显示XR Interaction Toolkit包 解决方法&#xff1a; Package manager左上角&#xff0c;点加号&#xff0c;选择 Add package from git URL..&#xff0c;…

实用Linux脚本

MySQL备份 #!/bin/bashset -eUSER"backup" PASSWORD"backup" # 数据库数据目录 # DATA_DIR"/data/mysql" BIN_INDEX$DATA_DIR"/mysql-bin.index" # 备份目录 # BACKUP_DIR"/data/backup/mysql" BACKUP_LOG"/var/log/m…

数据分析进度条制作

先看效果 第一个图 1.新建一个完整进度条度量值 2.选取簇状条形图 3.拖拽字段&#xff0c;进度达成的总和是Excel已经处理好的百分比 4.将条形模块的重叠和翻转重叠开启&#xff0c;类别间距20%&#xff0c;系列间距100% 5.注意点来了&#xff0c;这个图的条形模块数据系…