Embedding the Bing Translator Control in an Application


This article describes how to incorporate the Bing Translator Control into a XAML application. The simple solution is to add the control directly to your XAML page, either by dragging it from the Toolbox or by declaring it in markup. You can also create an instance of the control in code, which allows you to dynamically add the control to the page.

You can use the Bing Translator control with any Visual C#, Visual C++, or JavaScript Windows Store Application project type in Visual Studio. For a JavaScript example, see the TranslatorLibrary Class documentation. For information on installing and registering the control, see Bing Translator Requirements.

Published date: October 21, 2013

Declaring the Translator control in markup is the easiest way to work with Bing Translator, and is sufficient for most applications.


The Translator control has no visible UI. You must add other controls or code to receive the text to translate, and to render the result of the translation.

To add the Translator control to a XAML page

  1. From Solution Explorer, open MainPage.XAML.

  2. From the Toolbox, expand the Bing node, and then drag the TranslatorControl onto the design surface. This declares the Bing.Translator Namespace on your page and adds an instance of the control.

    <Page xmlns:Translator="using:Bing.Translator" ...>
    <Grid ...>
        <Translator:TranslatorControl .../>
  3. In the markup for the control, assign a Name attribute.

    <Translator:TranslatorControl x:Name="Trans" .../>
  4. Open MainPage.xaml.cs.

  5. Create an event handler for the page load event.

    public MainPage()
        this.Loaded += MainPage_Loaded;
    private async void MainPage_Loaded(object sender, RoutedEventArgs e)
  6. In the page load event handler, set the ClientId and ClientSecret properties for the control. These are required for web service authentication. To obtain a client ID and Secret, see How to: Register the Bing Translator Control with the Azure Data Marketplace.

    private async void MainPage_Loaded(object sender, RoutedEventArgs e)
        Trans.ClientId = <your client id>;
        Trans.ClientSecret = <your client secret>;
  7. Add a text source. This could be a textbox on the page, a function that reads text files or web pages, an The Bing Optical Character Recognition (OCR) Control, an RSS reader, or anything that provides a text string.

  8. Use the TranslatorLibrary.TranslateAsync(string, string, string, string) Method to translate the source text into the target language, and then receive the result of the translation from either the TranslatorControl.TextTranslated property or the TranslationResult.TextTranslated Property.

    var result = await Trans.TranslatorAPI.TranslateAsync("es", "en", "",<your source text>);
    string textOut = result.TextTranslated;

    Alternatively, if your text source is a XAML control, you can use Binding to automatically update the translation without making explicit API calls.

    <Translator:TranslatorControl x:Name="Translator2" LanguageFrom="en" 
    <TextBox Text="{Binding TextToTranslate, ElementName=Translator2, Mode=TwoWay}"
    <TextBox Text="{Binding TextTranslated, ElementName=Translator2}" />

    For the rest of this example, see the TranslatorControl Class documentation.