TX Text Control provides developers with a Resource Kit to customize its interface elements in languages other than English and German. While English and German are the default built-in languages and cannot be modified, other languages can be added using the satellite assembly mechanism, which is the preferred localization method in .NET. This article walks you through the process of building a satellite assembly using the Resource Kit to customize the language of the TX Text Control interface in the Angular Document Editor.

Building and Installing the Satellite Assembly

Follow these steps to build and install a satellite assembly to change the language to French (as an example) in the Angular Document Editor:

  1. Self-host your backend server and keep it running.

    Prerequisites

    For guidance on building a backend application using TX Text Control to host the Document Editor, refer to this article:

    Building an ASP.NET Core Backend Application to Host the Document Editor and Document Viewer

    Host Backend Server

  1. Create your Angular application using the TX Text Control Document Editor.

    Learn More

    Use this reference as a guide:

    Getting Started: Document Editor with Angular CLI v17.0

  1. In your Angular project, update the webSocketURL attribute of the Document Editor component to match the URL of the backend application you created earlier.

    <tx-document-editor
    width="1000px"
    height="500px"
    webSocketURL="wss://localhost:7045/api/TXWebSocket">
    </tx-document-editor>
    view raw test.html hosted with ❤ by GitHub

    Ensure that wss is used if the backend is hosted over HTTPS and ws is used for HTTP.

  1. After building your Angular application, locate the Resource Kit directory. This directory is a subfolder within your TX Text Control .NET Server for ASP.NET main installation folder and contains all the necessary files:

    • TextControl.resx: An XML-based file that contains all built-in resources in a human-readable XML format. All parts of dialog boxes appear as strings.
    • buildres.bat: A command line batch file that calls the command line tools of the .NET Framework SDK necessary to build the satellite assembly.
    • txtextcontrol.public.snk: TX Text Control's public key file, which is also required to build the satellite assembly.

  1. Open the TextControl.resx file and translate the text resources found inside the value tags. For example, to test the French language, change the RibbonReportingTab name from Reporting to Rapports. After making changes, be sure to save the file. If prompted, grant admin permissions. Depending on the application's requirements, other .resx files (e.g., TXTextControl.Web.Server.Process.resx, TXBarcode.resx) can also be translated accordingly.

    Translate Text in Resource Kit

  1. Next, open your Developer Command Prompt for Visual Studio 2022, navigate to the Resource Kit directory, and call the buildres.bat batch file with the two-letter language code specified through ISO 639 as a parameter. To build the satellite assembly for French, enter buildres fr. This batch process generates all the necessary satellite assembly files in the Resource Kit.

    Build the Satellite Assembly

  1. In the TX Text Control .NET main installation directory, navigate to the Assembly subdirectory and create a new folder named fr for French. Then, copy all the .dll files from the Resource Kit directory into the newly created fr folder.

  1. To ensure that custom builds of satellite assemblies are used with your application, create the following registry keys:

    Method 1: Open Registry Editor → navigate in the left pane to HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\StrongName\Verification, and add the registry key: txtextcontrol.resources,6B83FE9A75CFB638 On a 64-bit system, repeat the same steps under: HKEY_LOCAL_MACHINE\SOFTWARE\WOW6432Node\Microsoft\StrongName\Verification

    Method 2: Alternatively, open Command Prompt as Administrator and run the following command:

    Loading...

    The below registry entry is also required on 64-bit systems.

    Loading...

    When translating other .resx files, other registry keys need to be added following the same pattern (e.g., txbarcode.resources,6B83FE9A75CFB638).

    Note: Exercise caution when adding registry keys. Create a backup of your registry before making changes for safety. For more information, see Microsoft's guide.

  1. Include both the uiCulture and culture attributes of the Document Editor component to French in your Angular project.

    <tx-document-editor
    width="1000px"
    height="500px"
    webSocketURL="wss://localhost:7045/api/TXWebSocket"
    uiCulture="fr-FR"
    culture="fr-FR">
    </tx-document-editor>
    view raw test.html hosted with ❤ by GitHub

    Learn More

    Refer to this blog article for a complete list of available attributes for the Angular Document Editor:

    Getting Started: Angular Document Editor Attributes Explained

  1. The satellite assembly for the French language has been successfully installed, and the Reporting ribbon tab has been updated to Rapports in French.

    Installed the Satellite Assembly

Conclusion

This tutorial demonstrated how to change the TX Text Control interface elements to a language other than English and German. This is achieved by building and installing satellite assemblies for the Angular Document Editor using the Resource Kit.