> ## Documentation Index
> Fetch the complete documentation index at: https://docs.abbyy.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Création d’une application avec une interface utilisateur graphique

> Créez une application OCR ABBYY FineReader Engine avec une interface utilisateur graphique sous Windows à l’aide de composants visuels pour l’affichage des images, la navigation et la vérification de la reconnaissance.

<Warning>
  Les composants visuels sont disponibles dans FRE pour Windows.
</Warning>

Lors de la création d’une application avec une interface utilisateur, vous pouvez utiliser les [composants visuels](/fr/fine-reader/engine/visual-components-reference) d’ABBYY FineReader Engine. Les composants visuels fournissent des blocs prêts à l’emploi pour créer votre propre interface utilisateur pour une application OCR.

Vous pouvez afficher à l’utilisateur de votre application les documents en cours de traitement, lui permettre de vérifier les résultats de la reconnaissance et de modifier le texte reconnu. Les composants visuels peuvent être utiles dans tous les scénarios de traitement. Par exemple, l’édition de texte peut être proposée dans le scénario [Document Conversion](/fr/fine-reader/engine/guided-tour/basic-usage-scenarios-implementation/document-conversion), tandis que la vérification est extrêmement utile dans le scénario [Field-Level Recognition](/fr/fine-reader/engine/guided-tour/basic-usage-scenarios-implementation/field-level-recognition).

Examinons une application OCR simple du point de vue de l’interface utilisateur. Un document passe par plusieurs étapes de traitement :

1. Ouverture de l’image

Vous pouvez afficher l’image ouverte à l’utilisateur et lui permettre de naviguer entre les pages du document en cours de traitement.

2. Reconnaissance

Pour extraire des données textuelles d’un document, celui-ci doit être reconnu. Vous pouvez afficher le texte reconnu à l’utilisateur et lui permettre de le modifier.

3. Vérification

Il peut être nécessaire de vérifier le texte reconnu. Vous pouvez afficher à l’utilisateur à la fois l’image source et le texte reconnu afin de pouvoir les comparer.

4. Exportation

Le document reconnu peut être enregistré dans un format adapté ou ouvert dans une application externe.

Vous trouverez ci-dessous une description détaillée de l’utilisation des composants visuels d’ABBYY FineReader Engine.

<Warning>
  Les composants visuels nécessitent Microsoft Windows Common Controls version 6.0 ou ultérieure.
</Warning>

<Accordion title="Étape 1. Ajout de composants visuels au formulaire de votre application">
  Visual Studio vous permet d’insérer des contrôles ActiveX dans votre boîte de dialogue. Vous pouvez ajouter des composants visuels à la fenêtre Toolbox (la Toolbox est accessible depuis le menu View) et travailler avec eux :

  1. Dans le menu Tools, cliquez sur Choose Toolbox Items (ou Add/Remove Toolbox Items).
  2. Dans la boîte de dialogue qui s’ouvre, cliquez sur l’onglet COM Components et sélectionnez les composants ABBYY DocumentViewer, ABBYY ImageViewer, ABBYY ZoomViewer, ABBYY TextEditor et ABBYY TextValidator.
  3. Cliquez sur OK. Les icônes des éléments sélectionnés sont maintenant disponibles dans la Toolbox. Vous pouvez faire glisser chaque icône de composant visuel sur la surface du concepteur. Cette action ajoute également le code de base nécessaire pour créer une instance du composant visuel dans le fichier de projet actif.
  4. Après avoir ajouté le composant visuel à un formulaire, vous pouvez spécifier les propriétés disponibles dans Visual Studio. Par exemple, la propriété [SettingsPath](/fr/fine-reader/engine/visual-components-reference/imageviewer#settingspath) de chaque composant doit être définie au moment de la conception.

  <Note>
    Le concepteur Visual Studio ne prend pas en charge les contrôles ActiveX 64 bits. De ce fait, vous ne pouvez pas ajouter de composants visuels 64 bits à une application Windows Form. Il s’agit d’un comportement connu ; des problèmes similaires sont décrits pour les contrôles Microsoft ActiveX, par exemple dans [http://support.microsoft.com/kb/980533/en-us](http://support.microsoft.com/kb/980533/en-us). Pour contourner ce problème, FineReader Engine installe à la fois les composants visuels 32 bits et 64 bits si vous sélectionnez l’installation des composants visuels pour développeurs sur un système 64 bits. Dans ce cas, dans le concepteur Visual Studio, vous pouvez travailler avec la version 32 bits des composants. Une application 64 bits qui utilise des composants visuels n’a pas besoin que les composants visuels 32 bits soient installés.
  </Note>
</Accordion>

<Accordion title="Étape 2. Synchronisation des composants visuels">
  Le composant Component Synchronizer vous permet de synchroniser les composants visuels dans l’application. Cela signifie que toutes les opérations d’affichage et d’édition seront exécutées de manière synchrone dans tous les composants connectés. Pour synchroniser les composants visuels :

  1. Lors du chargement du formulaire, créez un objet [ComponentSynchronizer](/fr/fine-reader/engine/visual-components-reference/supplementary-objects/componentsynchronizer).
  2. Utilisez les propriétés DocumentViewer, ImageViewer, ZoomViewer, TextEditor et TextValidator de l’objet ComponentSynchronizer pour connecter les composants au synchroniseur.

  Lorsqu’un composant est connecté au synchroniseur via l’API, Component Synchronizer fonctionne comme décrit dans [How Component Synchronizer Works](/fr/fine-reader/engine/guided-tour/advanced-techniques/using-gui-elements/how-component-synchronizer-works).

  ### C\#

  ```csharp theme={null}
  private void VisualComponentsForm_Load(object sender, System.EventArgs e)
  {
   // Attacher les composants à Synchronizer
   Synchronizer = new FineReaderVisualComponents.ComponentSynchronizerClass();
   Synchronizer.DocumentViewer = ( FineReaderVisualComponents.DocumentViewer ) documentViewer.GetOcx();
   Synchronizer.ImageViewer = ( FineReaderVisualComponents.ImageViewer ) imageViewer.GetOcx();
   Synchronizer.ZoomViewer = ( FineReaderVisualComponents.ZoomViewer ) zoomViewer.GetOcx();
   Synchronizer.TextEditor = ( FineReaderVisualComponents.TextEditor ) textEditor.GetOcx();
  }
  ```
</Accordion>

<Accordion title="Étape 3. Chargement d’ABBYY FineReader Engine">
  Pour commencer à utiliser ABBYY FineReader Engine, vous devez créer l’objet [Engine](/fr/fine-reader/engine/api-reference/engine-object-iengine-interface). Pour créer l’objet Engine, vous pouvez utiliser la fonction exportée [InitializeEngine](/fr/fine-reader/engine/api-reference/functions/initializeengine-function). Voir aussi [d’autres façons de charger l’objet Engine](/fr/fine-reader/engine/guided-tour/advanced-techniques/programming-aspects/different-ways-to-load-engine). Vous pouvez charger l’objet Engine lors du chargement de l’image ou de l’initialisation du formulaire.

  ### C\#

  ```csharp theme={null}
  [DllImport( "FREngine.dll", CharSet=CharSet.Unicode ), PreserveSig]
  private static extern int InitializeEngine(
   String customerProjectID,
   String licensePath,
   String licensePassword,
   String FREngineDataFolder,
   String FREngineTempFolder,
   Bool lsSharedCPUCoresMode,
   ref FREngine.IEngine engine );
  private void loadEngine()
  {
   int hresult = InitializeEngine( "<CustomerProjectID>",
   "<licensePath>",
   "<licensePassword>",
   "<FREngineDataFolder>",
   "<FREngineTempFolder>",
   false,
   ref Engine );
   Marshal.ThrowExceptionForHR( hresult );
  }
  ```
</Accordion>

<Accordion title="Étape 4. Ouverture de l’image">
  Pour afficher l’image dans les composants visuels, vous devez l’ouvrir. Vous pouvez mettre en œuvre la procédure suivante pour ouvrir l’image :

  1. Pour charger les images d’un même document, vous devez créer l’objet [FRDocument](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument) et y ajouter des images. Vous pouvez procéder de l’une des façons suivantes :
     * Créez l’objet FRDocument à l’aide de la méthode [CreateFRDocumentFromImage](/fr/fine-reader/engine/api-reference/engine-object-iengine-interface/creation-methods/createfrdocumentfromimage-method) de l’objet Engine. Cette méthode crée l’objet FRDocument et charge les images à partir du fichier spécifié.
     * Créez l’objet FRDocument à l’aide de la méthode [CreateFRDocument](/fr/fine-reader/engine/api-reference/engine-object-iengine-interface/creation-methods/createlessobjectgreater-methods) de l’objet Engine, puis ajoutez des images à l’objet FRDocument créé à partir du fichier (utilisez les méthodes [AddImageFile](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/addimagefile-method), [AddImageFileWithPassword](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/addimagefilewithpassword-method) ou [AddImageFileWithPasswordCallback](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/addimagefilewithpasswordcallback-method) de l’objet FRDocument).
  2. Attachez le document à Component Synchronizer à l’aide de la propriété Document de l’objet [ComponentSynchronizer](/fr/fine-reader/engine/visual-components-reference/supplementary-objects/componentsynchronizer).

  La procédure peut gérer l’événement « on click » d’un bouton qui ouvre des images.

  ### C\#

  ```csharp theme={null}
  private void openImage( string imageFileName )
  {
   // Charger ABBYY FineReader Engine
   if( Engine == null )
   {
    loadEngine();
    Engine.ParentWindow = this.Handle.ToInt32();
    Engine.ApplicationTitle = this.Text;
   }
   // Ouvrir l'image
   Document = Engine.CreateFRDocumentFromImage( imageFileName, null );
   // Attacher l'image aux composants visuels à l'aide de Synchronizer
   Synchronizer.Document = Document;
  }
  ```
</Accordion>

<Accordion title="Étape 5. Reconnaissance des documents">
  La reconnaissance d’une image dans les composants visuels peut être lancée soit à l’aide des commandes disponibles dans les composants, soit à l’aide de l’API FineReader Engine (voir, par exemple, la méthode [Process](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/process-method) de l’objet FRDocument).

  Vous pouvez implémenter la procédure de reconnaissance suivante :

  1. Reconnaissez le document à l’aide des méthodes de l’objet FRDocument.
  2. Le document a été modifié en dehors de l’interface graphique des composants visuels ; vous devez donc signaler les modifications aux composants visuels. Utilisez la méthode [Update](/fr/fine-reader/engine/api-reference/document-related-objects/frpage/update-method) de l’objet [FRPage](/fr/fine-reader/engine/api-reference/document-related-objects/frpage) pour chaque page du document.

  Cette procédure peut gérer l’événement « on click » d’un bouton qui lance la reconnaissance.

  ### C\#

  ```csharp theme={null}
  private void recognizeDocument()
  {
   // Reconnaître et synthétiser l'ensemble du document
   Document.Process( Synchronizer.ProcessingParams );
   // Signaler les modifications aux composants visuels
   for( int i = 0; i < Document.Pages.Count; i++ )
   {
    Document.Pages[i].Update();
   }
  }
  ```
</Accordion>

<Accordion title="Étape 6. Vérification des résultats de reconnaissance">
  Les données reconnues peuvent être vérifiées à l’aide du composant Text Validator. Il fournit une interface utilisateur qui vous permet de vérifier si un caractère a été correctement reconnu et de le corriger si nécessaire.

  Vous pouvez implémenter la procédure de vérification suivante :

  1. Ajoutez le composant Text Validator au formulaire actuel ou créez un nouveau formulaire pour celui-ci.
  2. Attachez le composant Text Validator à Component Synchronizer. Utilisez la propriété TextValidator de l’objet [ComponentSynchronizer](/fr/fine-reader/engine/visual-components-reference/supplementary-objects/componentsynchronizer).
  3. Démarrez le processus de vérification à l’aide de la méthode [Spell](/fr/fine-reader/engine/visual-components-reference/textvalidator/spell-method) de l’objet [TextValidator](/fr/fine-reader/engine/visual-components-reference/textvalidator).

  ### C\#

  ```csharp theme={null}
  private void validateButton_Click(object sender, System.EventArgs e)
  {
   if( validatorForm == null )
   {
    // Créer un nouveau formulaire pour la validation
    validatorForm = new ValidatorForm();
    validatorForm.Owner = this;
    // Attacher le validateur au synchroniseur
    Synchronizer.TextValidator = ( FineReaderVisualComponents.TextValidator ) validatorForm.TextValidator.GetOcx();
    validatorForm.Show();
    // Valider le texte reconnu dans le document attaché
    validatorForm.TextValidator.Spell( null );
   }
  }
  ```
</Accordion>

<Accordion title="Étape 7. Exportation des résultats">
  Le document reconnu peut être enregistré soit à l’aide des commandes disponibles dans le [Document Viewer](/fr/fine-reader/engine/visual-components-reference/documentviewer/document-viewer-commands), soit à l’aide de l’API FineReader Engine.

  Par exemple, utilisez la méthode [Export](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/export-method) de l’objet FRDocument en passant la constante [FileExportFormatEnum](/fr/fine-reader/engine/api-reference/enumerations/fileexportformatenum) comme l’un des paramètres. Une fois le traitement de l’objet FRDocument terminé, libérez toutes les ressources utilisées par cet objet. Utilisez la méthode [IFRDocument::Close](/fr/fine-reader/engine/api-reference/document-related-objects/frdocument/close-method). Cette procédure peut gérer l’événement « on click » d’un bouton qui lance l’exportation.

  ### C\#

  ```csharp theme={null}
  // Enregistrer un document reconnu au format RTF
  Document.Export( "<File name>", FREngine.FileExportFormatEnum.FEF_RTF, null );
  // Libérer l'objet FRDocument
  Document.Close();
  ```
</Accordion>

<Accordion title="Étape 8. Déchargement d’ABBYY FineReader Engine">
  Une fois votre travail avec ABBYY FineReader Engine terminé, vous devez décharger l’objet [Engine](/fr/fine-reader/engine/api-reference/engine-object-iengine-interface). Pour ce faire, utilisez la fonction exportée [DeinitializeEngine](/fr/fine-reader/engine/api-reference/functions/deinitializeengine-function).

  <Note>
    Nous vous recommandons de libérer Component Synchronizer avant la désinitialisation d’Engine.
  </Note>

  Cette procédure peut gérer l’événement « on click » d’un bouton qui ferme la fenêtre de l’application.

  ### C\#

  ```csharp theme={null}
  [DllImport( "FREngine.dll", CharSet=CharSet.Unicode ), PreserveSig]
  private static extern int DeinitializeEngine();
  private void unloadEngine()
  {
   if( Engine != null )
   {// Si Engine a été chargé, déchargez-le
    Engine = null;
    int hresult = DeinitializeEngine();
    Marshal.ThrowExceptionForHR( hresult );
   }
  }
  ```
</Accordion>

Vous trouverez un exemple d’implémentation de la procédure décrite dans l’exemple [VisualComponents](/fr/fine-reader/engine/guided-tour/samples#visualcomponents).

<div id="see-also">
  ## Voir aussi
</div>

[Personnalisation du menu contextuel et de la barre d’outils d’un composant visuel](/fr/fine-reader/engine/guided-tour/advanced-techniques/using-gui-elements/customizing-the-context-menu-and-toolbar-of-a-visual-component)