Generate Image Description

• Jan 13, 2025
• 3 minutes to read

AI-powered “Generate Image Description” extension generates the description for the image.

Applies To

• Rich Text Editor
• Spreadsheet Control

How It Works

The following animation uses the AI-powered “Generate Image Description” extension in a WinForms Rich Text Editor to generate image description:

The “Generate Image Description” extension also enables you to generate alternative text for an image. This feature is available from the Alt Text form, as shown in the image below:

Activate Generate Image Description

Install DevExpress NuGet Packages

1. DevExpress.AIIntegration.WinForms
2. DevExpress.Win.Design (enables design-time features for DevExpress UI controls)

Read the following help topics for information on how to obtain the DevExpress NuGet Feed and install DevExpress NuGet packages:

• Choose Between Offline and Online DevExpress NuGet Feeds
• Install NuGet Packages in Visual Studio, VS Code, and Rider

Register AI Client

See the following help topic for information on required NuGet packages and system requirements: Register an AI Client.

The following code snippet registers the Azure OpenAI client:

C#

using Microsoft.Extensions.AI;
using DevExpress.AIIntegration;

internal static class Program {
    [STAThread]
    static void Main() {
        Application.EnableVisualStyles();
        Application.SetCompatibleTextRenderingDefault(false);
        IChatClient azureChatClient = new Azure.AI.OpenAI.AzureOpenAIClient(new Uri(AzureOpenAIEndpoint),
            new System.ClientModel.ApiKeyCredential(AzureOpenAIKey))
            .GetChatClient(ModelId).AsIChatClient();
        AIExtensionsContainerDesktop.Default.RegisterChatClient(azureChatClient);
        // Uncomment the following line if your project targets the .NET Framework and
        // you create AI-powered behaviors in code.
        // DevExpress.AIIntegration.WinForms.BehaviorInitializer.Initialize();
        Application.Run(new Form1());
    }
    static string AzureOpenAIEndpoint { get { return Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT"); } }
    static string AzureOpenAIKey { get { return Environment.GetEnvironmentVariable("AZURE_OPENAI_APIKEY"); } }
    static string ModelId { get { return "gpt-4o-mini"; } }
}

VB.NET

Imports Microsoft.Extensions.AI
Imports DevExpress.AIIntegration

Friend Module Program
    <STAThread>
    Sub Main()
        Application.EnableVisualStyles()
        Application.SetCompatibleTextRenderingDefault(False)
        ' Register Azure.OpenAI
        Dim azureChatClient As IChatClient = New Azure.AI.OpenAI.AzureOpenAIClient(New Uri(AzureOpenAIEndpoint),
            New System.ClientModel.ApiKeyCredential(AzureOpenAIKey)).
            GetChatClient(ModelId).AsIChatClient()
        AIExtensionsContainerDesktop.Default.RegisterChatClient(azureChatClient)
        ' Uncomment the following line if your project targets the .NET Framework and
        ' you create AI-powered behaviors in code.
        ' DevExpress.AIIntegration.WinForms.BehaviorInitializer.Initialize()
        Application.Run(New Form1())
    End Sub
    Private ReadOnly Property AzureOpenAIEndpoint() As String
        Get
            Return Environment.GetEnvironmentVariable("AZURE_OPENAI_ENDPOINT")
        End Get
    End Property
    Private ReadOnly Property AzureOpenAIKey() As String
        Get
            Return Environment.GetEnvironmentVariable("AZURE_OPENAI_APIKEY")
        End Get
    End Property
    Private ReadOnly Property ModelId As String
        Get
            Return "gpt-4o-mini"
        End Get
    End Property
End Module

Create and Configure Behavior

1. Drop the BehaviorManager component from the Toolbox onto a Form.

2. Add a GenerateImageDescriptionBehavior, configure its settings, and attach the behavior to a DevExpress WinForms Spreadsheet or Rich Text Edit control. You can do this at design time or in code:

   

   C#

   using DevExpress.AIIntegration.WinForms;
   
    //...
   public SpreadsheetForm() {
       InitializeComponent();
       behaviorManager1.Attach<GenerateImageDescriptionBehavior>(richEditControl1);
   }
   

   VB.NET

   Imports DevExpress.AIIntegration.WinForms
   
   '...
   Public Sub New()
       InitializeComponent()
       behaviorManager1.Attach(Of GenerateImageDescriptionBehavior)(richEditControl1)
   End Sub
   

Tip

Use GenerateImageDescriptionRequest to manually initiate a request to generate a description for the specified image:

var response = await defaultAIExtensionsContainer.GenerateImageDescriptionAsync(
    new GenerateImageDescriptionRequest(imageBase64)
);