Multilingual support in Canvas Apps Using Microsoft Translator
Problem Statement: Multilingual support remains a significant challenge for organizations developing applications in PowerApps. Without an efficient solution, users from different linguistic backgrounds may struggle to understand the application interface, leading to reduced adoption rates and inefficiencies.
Solution: By leveraging the Microsoft Translator Connector within PowerApps, organizations can effectively address the challenge of multilingual support. Here's a streamlined approach:
Implementation Steps:
- Navigate to https://make.powerapps.com
- Click Apps
- Click New Apps --> Page Design
- Click Data Source at the Left Side and Search MICROSOFT TRANSLATOR
Now in On Start of App write Below Code to get the Language of User (based on Browser)
Set(selectedLanguage,"en") - Add dropdown for selecting any language from it
- In Items of dropdown write below Code to get all the languages which is available in Microsoft Translator:
MicrosoftTranslator.Languages() - Select following fields for dropdown
- Now in OnChange of dropdown write Below Code to get the Language of User:
Set(selectedLanguage,comboBoxLanguages.Selected.Code) -
Use below format for .Text property of label, button, other supported controls to see the translated text based in selected language:
MicrosoftTranslator.Translate("your text", selectedLanguage) -
Example:
Added multiple labels in Power App as shown in image and their corresponding value of Text property are:Label
Text Property
LabelPageHeader
MicrosoftTranslator.Translate("Multilingual Support", selectedLanguage)
LabelSelectLanguage
MicrosoftTranslator.Translate("Select Language:", selectedLanguage)
LabelAboutPowerPlatform
MicrosoftTranslator.Translate("About Power Platform:", selectedLanguage)
LabelPowerPlatform
MicrosoftTranslator.Translate("The Power Platform provides organizations…", selectedLanguage)
LabelAboutMSTranslator
MicrosoftTranslator.Translate("About Microsoft Translator:", selectedLanguage)
LabelMSTranslator
MicrosoftTranslator.Translate("Microsoft Translator lets…”,selectedLanguage)
- Change the language from dropdown, Microsoft Translator will convert the text to desired language and same will be displayed on page
- Refer below screenshots:
English
French
- Note: With Microsoft Translator, you gain access to over 60 languages, and the flexibility to incorporate any language of your choice
Comments
-
Multilingual support in Canvas Apps Using Microsoft Translator
I was hopping that I could avoid the variable in between and thought that it is possible to set translation directly to label.Text but thought that I was doing something wrong.
Thank you, you confirmed that this is the only correct way to do it. 🙂
-
Multilingual support in Canvas Apps Using Microsoft Translator
Set Up the Translation in a Behavior-Based Property: You need to call the MicrosoftTranslatorV2.Translate function in a behavior-based property and then store the result in a variable. This is typically done in the OnVisible property of the screen or the OnSelect property of a button.
Bind the Result to the Label: Bind the Text property of the label to the variable where the translation result is stored.
Example Implementation
Let's walk through a simple example:
1. Setting Up the Variable for the Translation
- Go to the OnVisible property of the screen where you want to display the translation.
- Set up the translation and store it in a variable using the Set function.
PowerApps// OnVisible property of the screen Set(varTranslatedText, MicrosoftTranslatorV2.Translate(varCurrentLanguage, "Hello World"));2. Bind the Variable to the Label
- Add a Label control to your screen.
- Set the Text property of the Label control to the variable.
PowerApps// Text property of the Label varTranslatedTextDetailed Steps
Initialize the Variable for Language:
In the App's OnStart property, initialize the language variable:
PowerAppsSet(varCurrentLanguage, "fr"); // French language codeSet Up the Translation on Screen Load:
In the OnVisible property of the screen, call the translation function and store the result in a variable:
PowerAppsSet(varTranslatedText, MicrosoftTranslatorV2.Translate(varCurrentLanguage, "Hello World"));Display the Translation in a Label:
In the Text property of the Label, use the variable:
PowerAppsvarTranslatedText
Summary
- Behavior functions like MicrosoftTranslatorV2.Translate should be used in behavior-based properties (OnSelect, OnVisible, etc.).
- Store the result in a variable using the Set function.
- Bind the variable to the Text property of your label or any other non-behavior property.
By following these steps, you can use the MicrosoftTranslatorV2 service to translate text and display it in your app without encountering the error you're seeing. If you have any further questions or need more specific assistance, feel free to ask!
-
Multilingual support in Canvas Apps Using Microsoft Translator
1. Setting Up MicrosoftTranslatorV2
First, ensure that you have added the MicrosoftTranslatorV2 connector to your Power Apps environment.
2. Configuring MicrosoftTranslatorV2
You need to make sure you are correctly using the Translate function provided by MicrosoftTranslatorV2. Here’s how to use it properly:
Add the connector:
- Go to Data -> Add data.
- Search for MicrosoftTranslatorV2 and add it.
Setting up a variable for the current language:
- In the App's OnStart property, set up a variable for the current language.PowerAppsSet(varCurrentLanguage, "en");
- In the App's OnStart property, set up a variable for the current language.
Using the Translate function:
- Use the Translate function to translate text. Here is how you can set the Text property of a label to a translated string:PowerAppsMicrosoftTranslatorV2.Translate(varCurrentLanguage, "any text")
- Use the Translate function to translate text. Here is how you can set the Text property of a label to a translated string:
3. Example Implementation
Let’s say you want to translate the text "Hello World" to the language specified in varCurrentLanguage and display it in a label:
OnStart Property:
PowerAppsSet(varCurrentLanguage, "fr"); // French language codeLabel Control:
- Add a Label control to your screen.
- Set the Text property of the Label control to:PowerAppsMicrosoftTranslatorV2.Translate(varCurrentLanguage, "Hello World")
4. Error Handling
If you encounter an error, ensure:
- API Key Configuration: Make sure the API key for the MicrosoftTranslatorV2 service is correctly configured in your connector.
- Network Issues: Ensure there are no network issues preventing access to the Microsoft Translator service.
- Language Code Validity: Ensure the varCurrentLanguage contains a valid language code supported by Microsoft Translator.
5. Troubleshooting
If the error persists, try the following steps to debug:
- Direct API Call: Test the translation by making a direct call in the Power Apps formula bar:PowerAppsMicrosoftTranslatorV2.Translate("fr", "Hello World")
- Variable Check: Ensure that varCurrentLanguage is set correctly and is not null or empty:PowerAppsSet(varCurrentLanguage, "fr"); // Ensure this is in the OnStart property
- Connector Status: Check the status of the MicrosoftTranslatorV2 connector to ensure it is properly connected and authenticated.
By following these steps, you should be able to set up and use the MicrosoftTranslatorV2 connector in your Power Apps application without encountering errors. If you have any further issues or specific error messages, please share those details for more targeted assistance.
-
Multilingual support in Canvas Apps Using Microsoft Translator
Hello, this looks really ease to setup with Microsoft Translator. Since I cannot add Microsoft Translator but only Microsoft Translator 2, I tried this approach but when trying to set property .Text for label with:
MicrosoftTranslatorV2.Translate(varCurrentLanguage, "any text")I am getting errorps. varCurrentLanguage was set at App OnStart
Does anyone knows how to use this with MicrosoftTranslatorV2?
-
Multilingual support in Canvas Apps Using Microsoft Translator
I'm amazed by the seamless integration of multiple languages in this PowerApps creation. It's truly a testament to modern technology and the commitment to inclusivity. Well done!
-
Multilingual support in Canvas Apps Using Microsoft Translator
The article demonstrates a time-saving approach to dynamically translating text, eliminating the need for manual hardcoding.
-
Multilingual support in Canvas Apps Using Microsoft Translator
Thanks for sharing the article.
It saves time by translating the text dynamically, without the need for hardcoding.
*This post is locked for comments