Öğretici: WPF ile bir çeviri uygulaması oluşturmaTutorial: Create a translation app with WPF

Bu öğreticide, tek bir abonelik anahtarıyla metin çevirisi, dil algılama ve yazım denetimi için Azure bilişsel hizmetler 'i kullanan bir Windows Presentation Foundation (WPF) uygulaması oluşturacaksınız.In this tutorial, you'll build a Windows Presentation Foundation (WPF) app that uses Azure Cognitive Services for text translation, language detection, and spell checking with a single subscription key. Özellikle, uygulamanız Translator Metin Çevirisi ve Bing yazım denetimiAPI 'leri çağıracaktır.Specifically, your app will call APIs from Translator Text and Bing Spell Check.

WPF nedir?What is WPF? Masaüstü istemci uygulamaları oluşturan bir UI çerçevesidir.It's a UI framework that creates desktop client apps. WPF geliştirme platformu, uygulama modeli, kaynaklar, denetimler, grafikler, düzen, veri bağlama, belgeler ve güvenlik dahil olmak üzere çok sayıda uygulama geliştirme özelliği destekler.The WPF development platform supports a broad set of app development features, including an app model, resources, controls, graphics, layout, data binding, documents, and security. .NET Framework bir alt kümesidir, bu nedenle daha önce ASP.NET veya Windows Forms kullanarak .NET Framework ile uygulamalar oluşturduysanız, programlama deneyiminin tanıdık olması gerekir.It's a subset of the .NET Framework, so if you have previously built apps with the .NET Framework using ASP.NET or Windows Forms, the programming experience should be familiar. WPF, uygulama programlamaya yönelik bildirim temelli bir model sağlamak için Genişletilebilir uygulama biçimlendirme dili 'ni (XAML) kullanır. Bu, gelecek bölümlerde gözden geçireceğiz.WPF uses the Extensible app Markup Language (XAML) to provide a declarative model for app programming, which we'll review in the coming sections.

Bu öğreticide şunların nasıl yapıldığını öğreneceksiniz:In this tutorial, you'll learn how to:

  • Visual Studio 'da WPF projesi oluşturmaCreate a WPF project in Visual Studio
  • Projenize derlemeler ve NuGet paketleri ekleyinAdd assemblies and NuGet packages to your project
  • XAML ile uygulamanızın kullanıcı arabirimini oluşturmaCreate your app's UI with XAML
  • Dilleri almak, metin çevirmek ve kaynak dilini algılamak için Translator Metin Çevirisi API'si kullanınUse the Translator Text API to get languages, translate text, and detect the source language
  • Girişinizi doğrulamak ve çeviri doğruluğunu artırmak için Bing Yazım Denetimi API'si kullanınUse the Bing Spell Check API to validate your input and improve translation accuracy
  • WPF uygulamanızı çalıştırmaRun your WPF app

Bu öğreticide kullanılan bilişsel hizmetlerCognitive Services used in this tutorial

Bu liste, bu öğreticide kullanılan bilişsel hizmetleri içerir.This list includes the Cognitive Services used in this tutorial. Her bir özelliğin API başvurusuna gözatabilmek için bağlantıyı izleyin.Follow the link to browse the API reference for each feature.

HizmetService ÖzellikFeature AçıklamaDescription
Translator MetniTranslator Text Dilleri alGet Languages Metin çevirisi için desteklenen dillerin tüm listesini alın.Retrieve a complete list of supported languages for text translation.
Translator MetniTranslator Text ÇevirTranslate Metni 60 ' den fazla dile çevirin.Translate text into more than 60 languages.
Translator MetniTranslator Text AcağıDetect Giriş metninin dilini tespit edin.Detect the language of the input text. Algılama için güvenirlik puanı içerir.Includes confidence score for detection.
Bing Yazım DenetimiBing Spell Check Yazım DenetimiSpell Check Çeviri doğruluğunu artırmak için yazım hatalarını düzeltin.Correct spelling errors to improve translation accuracy.

Ön koşullarPrerequisites

Devam etmeden önce şunlar gerekir:Before we continue, you'll need the following:

Not

Bu öğretici için Batı ABD bölgede aboneliğin oluşturulmasını öneririz.We recommend creating the subscription in the West US region for this tutorial. Aksi takdirde, Bu alıştırmada çalışırken koddaki uç noktaları ve bölgeleri değiştirmeniz gerekir.Otherwise, you'll need to change endpoints and regions in the code as you work through this exercise.

Visual Studio 'da WPF uygulaması oluşturmaCreate a WPF app in Visual Studio

Yapmanız gereken ilk şey, Visual Studio 'da projemizi ayarladık.The first thing we need to do is set up our project in Visual Studio.

  1. Visual Studio’yu açın.Open Visual Studio. Yeni proje oluştur' u seçin.Select Create a new project.
  2. Yeni proje oluştur' da WPF uygulaması ' nı bulun ve seçin (.NET Framework) .In Create a new project, locate and select WPF App (.NET Framework). Seçenekleri daraltmak için C# dilden seçim yapabilirsiniz.You can select C# from Language to narrow the options.
  3. İleri' yi seçin ve ardından projenizin MSTranslatorTextDemoadını belirleyin.Select Next, and then name your project MSTranslatorTextDemo.
  4. Framework sürümünü .NET Framework 4.7.2 veya üzeri olarak ayarlayın ve Oluştur' u seçin.Set the framework version to .NET Framework 4.7.2 or later, and select Create. Visual Studio 'da adı ve Framework sürümünü girinEnter the name and framework version in Visual Studio

Projeniz oluşturuldu.Your project has been created. İki sekmeden açık olduğunu fark edeceksiniz: MainWindow.xaml ve MainWindow.xaml.cs.You'll notice that there are two tabs open: MainWindow.xaml and MainWindow.xaml.cs. Bu öğreticide, bu iki dosyaya kod ekliyoruz.Throughout this tutorial, we'll be adding code to these two files. Uygulamanın kullanıcı arabirimi için MainWindow.xaml değiştireceksiniz.We'll modify MainWindow.xaml for the app's user interface. Translator Metin Çevirisi ve Bing Yazım Denetimi çağrılarımız için MainWindow.xaml.cs değiştireceksiniz.We'll modify MainWindow.xaml.cs for our calls to Translator Text and Bing Spell Check. ortamınızı gözden geçirinReview your environment

Sonraki bölümde, JSON ayrıştırma gibi ek işlevler için projenize derlemeler ve bir NuGet paketi ekleyeceğiz.In the next section, we're going to add assemblies and a NuGet package to our project for additional functionality, like JSON parsing.

Projenize başvurular ve NuGet paketleri ekleyinAdd references and NuGet packages to your project

Projemiz .NET Framework derlemeleri ve NuGet Paket Yöneticisi 'ni kullanarak yükleytiğimiz NewtonSoft. json ' ı gerektirir.Our project requires a handful of .NET Framework assemblies and NewtonSoft.Json, which we'll install using the NuGet package manager.

.NET Framework derlemeleri EkleAdd .NET Framework assemblies

Nesneleri seri hale getirmek ve seri durumdan çıkarmak için ve HTTP isteklerini ve yanıtlarını yönetmek için projenize derleme ekleyelim.Let's add assemblies to our project to serialize and deserialize objects, and to manage HTTP requests and responses.

  1. Projenizi Visual Studio 'nun Çözüm Gezgini bulun.Locate your project in Visual Studio's Solution Explorer. Projenize sağ tıklayın ve ardından başvuru Yöneticisi'ni açan > Başvuru Ekle' yi seçin.Right-click your project, then select Add > Reference, which opens Reference Manager.
  2. Derlemeler sekmesi, başvuru için kullanılabilen tüm .NET Framework derlemeleri listeler.The Assemblies tab lists all .NET Framework assemblies that are available to reference. Başvuruları aramak için sağ üst köşedeki arama çubuğunu kullanın.Use the search bar in the upper right to search for references. derleme başvuruları EkleAdd assembly references
  3. Projeniz için aşağıdaki başvuruları seçin:Select the following references for your project:
  4. Bu başvuruları projenize ekledikten sonra, başvuru Yöneticisi'ni kapatmak için Tamam ' a tıklayabilirsiniz.After you've added these references to your project, you can click OK to close Reference Manager.

Not

Derleme başvuruları hakkında daha fazla bilgi edinmek istiyorsanız bkz. nasıl yapılır: başvuru Yöneticisi 'ni kullanarak başvuru ekleme veya kaldırma.If you'd like to learn more about assembly references, see How to: Add or remove reference using the Reference Manager.

NewtonSoft. JSON 'ı yüklerInstall NewtonSoft.Json

Uygulamamız JSON nesnelerinin serisini kaldırmak için NewtonSoft. JSON kullanacaktır.Our app will use NewtonSoft.Json to deserialize JSON objects. Paketi yüklemek için bu yönergeleri izleyin.Follow these instructions to install the package.

  1. Projenizi Visual Studio 'nun Çözüm Gezgini bulun ve projenize sağ tıklayın.Locate your project in Visual Studio's Solution Explorer and right-click on your project. NuGet Paketlerini Yönet' i seçin.Select Manage NuGet Packages.

  2. Araştır sekmesini bulun ve seçin.Locate and select the Browse tab.

  3. Arama çubuğuna Newtonsoft. JSON girin.Enter NewtonSoft.Json into the search bar.

    NewtonSoft. JSON öğesini bulun ve yükler

  4. Paketi seçin ve ardından yüklensin' e tıklayın.Select the package and click Install.

  5. Yükleme tamamlandığında sekmesini kapatın.When the installation is complete, close the tab.

XAML kullanarak WPF formu oluşturmaCreate a WPF form using XAML

Uygulamanızı kullanmak için bir kullanıcı arabirimine ihtiyacınız olacak.To use your app, you're going to need a user interface. XAML kullanarak, kullanıcıların giriş ve çeviri dillerini seçmesine, çevrilecek metni girmesine ve çeviri çıktısını görüntülemesine olanak tanıyan bir form oluşturacağız.Using XAML, we'll create a form that allows users to select input and translation languages, enter text to translate, and displays the translation output.

Biz oluşturduğumuzun bir bakalım.Let's take a look at what we're building.

WPF XAML kullanıcı arabirimi

Kullanıcı arabirimi şu bileşenleri içerir:The user interface includes these components:

AdName TürType AçıklamaDescription
FromLanguageComboBox ÖğesiComboBox Metin çevirisi için Microsoft Translator tarafından desteklenen dillerin listesini görüntüler.Displays a list of the languages supported by Microsoft Translator for text translation. Kullanıcı çeviri yaptığı kaynak dili seçer.The user selects the language they are translating from.
ToLanguageComboBox ÖğesiComboBox FromComboBoxdil listesini görüntüler, ancak kullanıcının çevirdiğini dili seçmek için kullanılır.Displays the same list of languages as FromComboBox, but is used to select the language the user is translating to.
TextToTranslate TextBoxTextBox Kullanıcının çevrilecek metin girmesine izin verir.Allows the user to enter text to be translated.
TranslateButton BuButton Metni çevirmek için bu düğmeyi kullanın.Use this button to translate text.
TranslatedTextLabel EtiketLabel Çeviriyi görüntüler.Displays the translation.
DetectedLanguageLabel EtiketLabel Çevrilecek metnin algılanan dilini görüntüler (TextToTranslate).Displays the detected language of the text to be translated (TextToTranslate).

Not

Bu formu XAML kaynak kodunu kullanarak oluşturuyoruz, ancak formu Visual Studio 'daki düzenleyiciyle oluşturabilirsiniz.We're creating this form using the XAML source code, however, you can create the form with the editor in Visual Studio.

Kodu projenize ekleyelim.Let's add the code to our project.

  1. Visual Studio 'da MainWindow.xamlsekmesini seçin.In Visual Studio, select the tab for MainWindow.xaml.
  2. Bu kodu projenize kopyalayın ve sonra değişikliklerinizi kaydetmek için dosya > MainWindow. xaml dosyasını Kaydet ' i seçin.Copy this code into your project, and then select File > Save MainWindow.xaml to save your changes.
    <Window x:Class="MSTranslatorTextDemo.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:MSTranslatorTextDemo"
            mc:Ignorable="d"
            Title="Microsoft Translator" Height="400" Width="700" BorderThickness="0">
        <Grid>
            <Label x:Name="label" Content="Microsoft Translator" HorizontalAlignment="Left" Margin="39,6,0,0" VerticalAlignment="Top" Height="49" FontSize="26.667"/>
            <TextBox x:Name="TextToTranslate" HorizontalAlignment="Left" Height="23" Margin="42,160,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="600" FontSize="14" TabIndex="3"/>
            <Label x:Name="EnterTextLabel" Content="Text to translate:" HorizontalAlignment="Left" Margin="40,129,0,0" VerticalAlignment="Top" FontSize="14"/>
            <Label x:Name="toLabel" Content="Translate to:" HorizontalAlignment="Left" Margin="304,58,0,0" VerticalAlignment="Top" FontSize="14"/>
    
            <Button x:Name="TranslateButton" Content="Translate" HorizontalAlignment="Left" Margin="39,206,0,0" VerticalAlignment="Top" Width="114" Height="31" Click="TranslateButton_Click" FontSize="14" TabIndex="4" IsDefault="True"/>
            <ComboBox x:Name="ToLanguageComboBox"
                    HorizontalAlignment="Left"
                    Margin="306,88,0,0"
                    VerticalAlignment="Top"
                    Width="175" FontSize="14" TabIndex="2">
    
            </ComboBox>
            <Label x:Name="fromLabel" Content="Translate from:" HorizontalAlignment="Left" Margin="40,58,0,0" VerticalAlignment="Top" FontSize="14"/>
            <ComboBox x:Name="FromLanguageComboBox"
                HorizontalAlignment="Left"
                Margin="42,88,0,0"
                VerticalAlignment="Top"
                Width="175" FontSize="14" TabIndex="1"/>
            <Label x:Name="TranslatedTextLabel" Content="Translation is displayed here." HorizontalAlignment="Left" Margin="39,255,0,0" VerticalAlignment="Top" Width="620" FontSize="14" Height="85" BorderThickness="0"/>
            <Label x:Name="DetectedLanguageLabel" Content="Autodetected language is displayed here." HorizontalAlignment="Left" Margin="39,288,0,0" VerticalAlignment="Top" Width="620" FontSize="14" Height="84" BorderThickness="0"/>
        </Grid>
    </Window>
    

Artık Visual Studio 'da uygulamanın kullanıcı arabiriminin önizlemesini görmeniz gerekir.You should now see a preview of the app's user interface in Visual Studio. Yukarıdaki görüntüye benzer görünmelidir.It should look similar to the image above.

Bu, formunuz için hazırlayın.That's it, your form is ready. Şimdi metin çevirisini ve Bing Yazım Denetimi kullanmak için kod yazalım.Now let's write some code to use Text Translation and Bing Spell Check.

Not

Bu formu ince ayar veya kendinizinkini oluşturabilirsiniz.Feel free to tweak this form or create your own.

Uygulamanızı oluşturunCreate your app

MainWindow.xaml.cs uygulamamızı denetleyen kodu içerir.MainWindow.xaml.cs contains the code that controls our app. Sonraki birkaç bölümde, açılan menülerinizi doldurmak ve Translator Metin Çevirisi ve Bing Yazım Denetimi tarafından sunulan el ile API 'yi çağırmak için kod ekleyeceğiz.In the next few sections, we're going to add code to populate our drop-down menus, and to call a handful of API exposed by Translator Text and Bing Spell Check.

  • Program başlatıldığında ve MainWindow örneği oluşturulduğunda, dil seçim açılır listelerimizi almak ve doldurmak için Translator Metin Çevirisi API'si Languages yöntemi çağırılır.When the program starts and MainWindow is instantiated, the Languages method of the Translator Text API is called to retrieve and populate our language selection drop-downs. Bu, her oturumun başlangıcında bir kez gerçekleşir.This happens once at the beginning of each session.
  • Çevir düğmesine tıklandığında, kullanıcının dil seçimi ve metni alınır, girişte yazım denetimi yapılır ve çeviri ve algılanan dil kullanıcı için görüntülenir.When the Translate button is clicked, the user's language selection and text are retrieved, spell check is performed on the input, and the translation and detected language are displayed for the user.
    • Translator Metin Çevirisi API'si Translate yöntemi TextToTranslatemetin çevirmek için çağrılır.The Translate method of the Translator Text API is called to translate text from TextToTranslate. Bu çağrıda Ayrıca açılır menüler kullanılarak seçilen to ve from dilleri de bulunur.This call also includes the to and from languages selected using the drop-down menus.
    • Translator Metin Çevirisi API'si Detect yöntemi TextToTranslatemetin dilini belirlemede çağrılır.The Detect method of the Translator Text API is called to determine the text language of TextToTranslate.
    • Bing Yazım Denetimi, TextToTranslate doğrulamak ve hatalı yazımları ayarlamak için kullanılır.Bing Spell Check is used to validate TextToTranslate and adjust misspellings.

Tüm projemiz MainWindow : Window sınıfında kapsüllenir.All of our project is encapsulated in the MainWindow : Window class. Abonelik anahtarınızı ayarlamak, Translator Metin Çevirisi ve Bing Yazım Denetimi için uç noktaları bildirmek ve uygulamayı başlatmak için kod ekleyerek başlayalım.Let's start by adding code to set your subscription key, declare endpoints for Translator Text and Bing Spell Check, and initialize the app.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini seçin.In Visual Studio, select the tab for MainWindow.xaml.cs.
  2. Önceden doldurulmuş using deyimlerini aşağıdaki kodla değiştirin.Replace the pre-populated using statements with the following.
    using System;
    using System.Windows;
    using System.Net;
    using System.Net.Http;
    using System.IO;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using Newtonsoft.Json;
    
  3. MainWindow : Window sınıfını bulun ve bu kodla değiştirin:Locate the MainWindow : Window class, and replace it with this code:
    {
        // This sample uses the Cognitive Services subscription key for all services. To learn more about
        // authentication options, see: https://docs.microsoft.com/azure/cognitive-services/authentication.
        const string COGNITIVE_SERVICES_KEY = "YOUR_COG_SERVICES_KEY";
        // Endpoints for Translator Text and Bing Spell Check
        public static readonly string TEXT_TRANSLATION_API_ENDPOINT = "https://api.cognitive.microsofttranslator.com/{0}?api-version=3.0";
        const string BING_SPELL_CHECK_API_ENDPOINT = "https://westus.api.cognitive.microsoft.com/bing/v7.0/spellcheck/";
        // An array of language codes
        private string[] languageCodes;
    
        // Dictionary to map language codes from friendly name (sorted case-insensitively on language name)
        private SortedDictionary<string, string> languageCodesAndTitles =
            new SortedDictionary<string, string>(Comparer<string>.Create((a, b) => string.Compare(a, b, true)));
    
        // Global exception handler to display error message and exit
        private static void HandleExceptions(object sender, UnhandledExceptionEventArgs args)
        {
            Exception e = (Exception)args.ExceptionObject;
            MessageBox.Show("Caught " + e.Message, "Error", MessageBoxButton.OK, MessageBoxImage.Error);
            System.Windows.Application.Current.Shutdown();
        }
        // MainWindow constructor
        public MainWindow()
        {
            // Display a message if unexpected error is encountered
            AppDomain.CurrentDomain.UnhandledException += new UnhandledExceptionEventHandler(HandleExceptions);
    
            if (COGNITIVE_SERVICES_KEY.Length != 32)
            {
                MessageBox.Show("One or more invalid API subscription keys.\n\n" +
                    "Put your keys in the *_API_SUBSCRIPTION_KEY variables in MainWindow.xaml.cs.",
                    "Invalid Subscription Key(s)", MessageBoxButton.OK, MessageBoxImage.Error);
                System.Windows.Application.Current.Shutdown();
            }
            else
            {
                // Start GUI
                InitializeComponent();
                // Get languages for drop-downs
                GetLanguagesForTranslate();
                // Populate drop-downs with values from GetLanguagesForTranslate
                PopulateLanguageMenus();
            }
        }
    // NOTE:
    // In the following sections, we'll add code below this.
    }
    
  4. Bilişsel hizmetler abonelik anahtarınızı ekleyin ve kaydedin.Add your Cognitive Services subscription key and save.

Bu kod bloğunda, çeviri için kullanılabilir diller hakkında bilgi içeren iki üye değişkeni bildirdik:In this code block, we've declared two member variables that contain information about available languages for translation:

DeğişkenVariable TürType AçıklamaDescription
languageCodes Dizeler dizisiArray of strings Dil kodlarını önbelleğe alır.Caches the language codes. Translator hizmeti dilleri belirlemek için kısa kodlar kullanır (örneğin İngilizce için en).The Translator service uses short codes, such as en for English, to identify languages.
languageCodesAndTitles Sıralanmış sözlükSorted dictionary Kullanıcı arabirimindeki "kolay anlaşılır" adları, API’de kullanılan kısa kodlarla eşleştirir.Maps the "friendly" names in the user interface back to the short codes used in the API. Büyük küçük harf kullanımından bağımsız olarak alfabetik sırayla tutulur.Kept sorted alphabetically without regard for case.

Sonra, MainWindow Oluşturucusu içinde HandleExceptionsile hata işleme ekledik.Then, within the MainWindow constructor, we've added error handling with HandleExceptions. Bu hata işleme, bir özel durum işlenmediğinde bir uyarının sağlandığından emin olmanızı sağlar.This error handling ensures that an alert is provided if an exception isn't handled. Daha sonra, belirtilen abonelik anahtarını doğrulamak için bir denetim çalıştırılır ve 32 karakter uzunluğunda olur.Then a check is run to confirm the subscription key provided is 32 characters in length. Anahtar 32 karakterden fazlaysa bir hata oluşur.An error is thrown if the key is less than/greater than 32 characters.

En azından doğru uzunlukta olan anahtarlar varsa, InitializeComponent() çağrısı, ana uygulama penceresinin XAML açıklamasını bularak, yükleyerek ve örnekleyerek Kullanıcı arabirimini alır.If there are keys that are at least the right length, the InitializeComponent() call gets the user interface rolling by locating, loading, and instantiating the XAML description of the main app window.

Son olarak, çeviri dillerini almak ve uygulamanın kullanıcı arabirimimizin açılan menülerini doldurmak için yöntemleri çağırmak için bir kod ekledik.Last, we've added code to call methods to retrieve languages for translation and to populate the drop-down menus for our app's user interface. Endişelenmeyin, bu çağrıların arkasındaki koda yakında başlayacağız.Don't worry, we'll get to the code behind these calls soon.

Desteklenen dilleri almaGet supported languages

Translator Metin Çevirisi API'si şu anda 60 'den fazla dili destekliyor.The Translator Text API currently supports more than 60 languages. Yeni dil desteği zamana göre eklenebileceğinden, uygulamanızdaki dil listesini sabit bir şekilde kodlamak yerine Translator Metin Çevirisi tarafından açığa çıkarılan diller kaynağını çağırmayı öneririz.Since new language support will be added over time, we recommend calling the Languages resource exposed by Translator Text rather than hardcoding the language list in your app.

Bu bölümde, çeviri için kullanılabilen dillerin bir listesini istediğimizden önce, diller kaynağına bir GET isteği oluşturacağız.In this section, we'll create a GET request to the Languages resource, specifying that we want a list of languages available for translation.

Not

Diller kaynağı, dil desteğini Şu sorgu parametreleriyle filtrelemenizi sağlar: alfabe, sözlük ve çeviri.The Languages resource allows you to filter language support with the following query parameters: transliteration, dictionary, and translation. Daha fazla bilgi için bkz. API başvurusu.For more information, see API reference.

Daha fazla ilerleyebilmemiz için, diller kaynağı çağrısı için örnek çıktıya göz atalım:Before we go any further, let's take a look at a sample output for a call to the Languages resource:

{
  "translation": {
    "af": {
      "name": "Afrikaans",
      "nativeName": "Afrikaans",
      "dir": "ltr"
    },
    "ar": {
      "name": "Arabic",
      "nativeName": "العربية",
      "dir": "rtl"
    }
    // Additional languages are provided in the full JSON output.
}

Bu çıktıdan, dil kodunu ve belirli bir dilin name ayıklayabiliriz.From this output, we can extract the language code and the name of a specific language. Uygulamamız JSON nesnesinin serisini kaldırmak için NewtonSoft. JSON kullanıyor (JsonConvert.DeserializeObject).Our app uses NewtonSoft.Json to deserialize the JSON object (JsonConvert.DeserializeObject).

Son bölümde kaldığınız yerden başladığımızda, uygulamamıza desteklenen diller için bir yöntem ekleyelim.Picking up where we left off in the last section, let's add a method to get supported languages to our app.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini açın.In Visual Studio, open the tab for MainWindow.xaml.cs.
  2. Bu kodu projenize ekleyin:Add this code to your project:
    // ***** GET TRANSLATABLE LANGUAGE CODES
    private void GetLanguagesForTranslate()
    {
        // Send request to get supported language codes
        string uri = String.Format(TEXT_TRANSLATION_API_ENDPOINT, "languages") + "&scope=translation";
        WebRequest WebRequest = WebRequest.Create(uri);
        WebRequest.Headers.Add("Accept-Language", "en");
        WebResponse response = null;
        // Read and parse the JSON response
        response = WebRequest.GetResponse();
        using (var reader = new StreamReader(response.GetResponseStream(), UnicodeEncoding.UTF8))
        {
            var result = JsonConvert.DeserializeObject<Dictionary<string, Dictionary<string, Dictionary<string, string>>>>(reader.ReadToEnd());
            var languages = result["translation"];
    
            languageCodes = languages.Keys.ToArray();
            foreach (var kv in languages)
            {
                languageCodesAndTitles.Add(kv.Value["name"], kv.Key);
            }
        }
    }
    // NOTE:
    // In the following sections, we'll add code below this.
    

GetLanguagesForTranslate() yöntemi bir HTTP GET isteği oluşturur ve isteğin kapsamını çeviri için desteklenen dillere sınırlamak için scope=translation sorgu dizesi parametresini kullanır.The GetLanguagesForTranslate() method creates an HTTP GET request, and uses the scope=translation query string parameter is used to limit the scope of the request to supported languages for translation. Desteklenen dillerin İngilizce olarak döndürülmesi için Accept-Language değerine sahip en üst bilgisi eklenir.The Accept-Language header with the value en is added so that the supported languages are returned in English.

JSON yanıtı ayrıştırılır ve bir sözlüğe dönüştürülür.The JSON response is parsed and converted to a dictionary. Ardından dil kodları languageCodes üye değişkenine eklenir.Then the language codes are added to the languageCodes member variable. Dil kodlarını ve kolay dil adlarını içeren anahtar/değer çiftleri döndürülür ve languageCodesAndTitles üye değişkenine eklenir.The key/value pairs that contain the language codes and the friendly language names are looped through and added to the languageCodesAndTitles member variable. Formdaki açılan menülerde kolay adlar görüntülenir, ancak bu kodlar çeviriyi istemek için gereklidir.The drop-down menus in the form display the friendly names, but the codes are needed to request the translation.

Dil açılır menülerini doldurPopulate language drop-down menus

Kullanıcı arabirimi XAML kullanılarak tanımlanmıştır, bu yüzden çağrı InitializeComponent()ek olarak ayarlamanız gerekmez.The user interface is defined using XAML, so you don't need to do much to set it up besides call InitializeComponent(). Yapmanız gereken tek şey, kolay dil adlarını, çeviri ve açılan menülere çevirecek şekilde bir adım adım ekler.The one thing you need to do is add the friendly language names to the Translate from and Translate to drop-down menus. PopulateLanguageMenus() yöntemi adlarını ekler.The PopulateLanguageMenus() method adds the names.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini açın.In Visual Studio, open the tab for MainWindow.xaml.cs.
  2. Bu kodu projenize GetLanguagesForTranslate() yönteminin altına ekleyin:Add this code to your project below the GetLanguagesForTranslate() method:
    private void PopulateLanguageMenus()
    {
        // Add option to automatically detect the source language
        FromLanguageComboBox.Items.Add("Detect");
    
        int count = languageCodesAndTitles.Count;
        foreach (string menuItem in languageCodesAndTitles.Keys)
        {
            FromLanguageComboBox.Items.Add(menuItem);
            ToLanguageComboBox.Items.Add(menuItem);
        }
    
        // Set default languages
        FromLanguageComboBox.SelectedItem = "Detect";
        ToLanguageComboBox.SelectedItem = "English";
    }
    // NOTE:
    // In the following sections, we'll add code below this.
    

Bu yöntem languageCodesAndTitles sözlüğü üzerinde yinelenir ve her anahtarı her iki menüye ekler.This method iterates over the languageCodesAndTitles dictionary and adds each key to both menus. Menüler doldurulduktan sonra varsayılan ve sonraki diller sırasıyla Algıla ve İngilizce olarak ayarlanır.After the menus are populated, the default from and to languages are set to Detect and English respectively.

İpucu

Menüler için varsayılan bir seçim olmadan, kullanıcı önce bir "hedef" veya "kaynak" dil seçmeden Çevir’e tıklayabilir.Without a default selection for the menus, the user can click Translate without first choosing a "to" or "from" language. Varsayılan değerler bu sorunla başa çıkma gereksinimini ortadan kaldırır.The defaults eliminate the need to deal with this problem.

Artık MainWindow başlatıldığından ve Kullanıcı arabirimi oluşturulduktan sonra, çeviri düğmesine tıklanana kadar bu kod çalışmaz.Now that MainWindow has been initialized and the user interface created, this code won't run until the Translate button is clicked.

Kaynak metnin dilini AlgılaDetect language of source text

Artık Translator Metin Çevirisi API'si kullanarak kaynak metnin (metin alanına girilen metin) dilini algılamak için yöntem oluşturacağız.Now we're going to create method to detect the language of the source text (text entered into our text area) using the Translator Text API. Bu istek tarafından döndürülen değer, daha sonra çeviri isteğinde kullanılacaktır.The value returned by this request will be used in our translation request later.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini açın.In Visual Studio, open the tab for MainWindow.xaml.cs.
  2. Bu kodu projenize PopulateLanguageMenus() yönteminin altına ekleyin:Add this code to your project below the PopulateLanguageMenus() method:
    // ***** DETECT LANGUAGE OF TEXT TO BE TRANSLATED
    private string DetectLanguage(string text)
    {
        string detectUri = string.Format(TEXT_TRANSLATION_API_ENDPOINT ,"detect");
    
        // Create request to Detect languages with Translator Text
        HttpWebRequest detectLanguageWebRequest = (HttpWebRequest)WebRequest.Create(detectUri);
        detectLanguageWebRequest.Headers.Add("Ocp-Apim-Subscription-Key", COGNITIVE_SERVICES_KEY);
        detectLanguageWebRequest.Headers.Add("Ocp-Apim-Subscription-Region", "westus");
        detectLanguageWebRequest.ContentType = "application/json; charset=utf-8";
        detectLanguageWebRequest.Method = "POST";
    
        // Send request
        var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        string jsonText = serializer.Serialize(text);
    
        string body = "[{ \"Text\": " + jsonText + " }]";
        byte[] data = Encoding.UTF8.GetBytes(body);
    
        detectLanguageWebRequest.ContentLength = data.Length;
    
        using (var requestStream = detectLanguageWebRequest.GetRequestStream())
            requestStream.Write(data, 0, data.Length);
    
        HttpWebResponse response = (HttpWebResponse)detectLanguageWebRequest.GetResponse();
    
        // Read and parse JSON response
        var responseStream = response.GetResponseStream();
        var jsonString = new StreamReader(responseStream, Encoding.GetEncoding("utf-8")).ReadToEnd();
        dynamic jsonResponse = serializer.DeserializeObject(jsonString);
    
        // Fish out the detected language code
        var languageInfo = jsonResponse[0];
        if (languageInfo["score"] > (decimal)0.5)
        {
            DetectedLanguageLabel.Content = languageInfo["language"];
            return languageInfo["language"];
        }
        else
            return "Unable to confidently detect input language.";
    }
    // NOTE:
    // In the following sections, we'll add code below this.
    

Bu yöntem, Algıla kaynağına bir HTTP POST isteği oluşturur.This method creates an HTTP POST request to the Detect resource. İsteğin gövdesi olarak iletilen texttek bir bağımsız değişken alır.It takes a single argument, text, which is passed along as the body of the request. Daha sonra, çeviri isteimizi oluşturduğumuzda, Kullanıcı arabirimimize girilen metin, dil algılama için bu yönteme geçirilir.Later, we when we create our translation request, the text entered into our UI will be passed to this method for language detection.

Ayrıca, bu yöntem yanıtın güvenilirlik Puanını değerlendirir.Additionally, this method evaluates the confidence score of the response. Puan 0.5değerinden büyükse, algılanan Dil Kullanıcı arabirimimizde görüntülenir.If the score is greater than 0.5, then the detected language is displayed in our user interface.

Kaynak metnini yazım denetimiSpell check the source text

Artık Bing Yazım Denetimi API'si kullanarak kaynak metnimizi yazım denetimi yapmak için bir yöntem oluşturacağız.Now we're going to create a method to spell check our source text using the Bing Spell Check API. Yazım denetimi, Translator Metin Çevirisi API'si ' den doğru çevirileri geri almanızı sağlar.Spell checking ensures that we'll get back accurate translations from Translator Text API. Çeviri düğmesine tıklandığında , kaynak metinde yapılan tüm düzeltmeler çeviri talebimize geçirilir.Any corrections to the source text are passed along in our translation request when the Translate button is clicked.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini açın.In Visual Studio, open the tab for MainWindow.xaml.cs.
  2. Bu kodu projenize DetectLanguage() yönteminin altına ekleyin:Add this code to your project below the DetectLanguage() method:
// ***** CORRECT SPELLING OF TEXT TO BE TRANSLATED
private string CorrectSpelling(string text)
{
    string uri = BING_SPELL_CHECK_API_ENDPOINT + "?mode=spell&mkt=en-US";

    // Create a request to Bing Spell Check API
    HttpWebRequest spellCheckWebRequest = (HttpWebRequest)WebRequest.Create(uri);
    spellCheckWebRequest.Headers.Add("Ocp-Apim-Subscription-Key", COGNITIVE_SERVICES_KEY);
    spellCheckWebRequest.Method = "POST";
    spellCheckWebRequest.ContentType = "application/x-www-form-urlencoded"; // doesn't work without this

    // Create and send the request
    string body = "text=" + System.Web.HttpUtility.UrlEncode(text);
    byte[] data = Encoding.UTF8.GetBytes(body);
    spellCheckWebRequest.ContentLength = data.Length;
    using (var requestStream = spellCheckWebRequest.GetRequestStream())
        requestStream.Write(data, 0, data.Length);
    HttpWebResponse response = (HttpWebResponse)spellCheckWebRequest.GetResponse();

    // Read and parse the JSON response; get spelling corrections
    var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
    var responseStream = response.GetResponseStream();
    var jsonString = new StreamReader(responseStream, Encoding.GetEncoding("utf-8")).ReadToEnd();
    dynamic jsonResponse = serializer.DeserializeObject(jsonString);
    var flaggedTokens = jsonResponse["flaggedTokens"];

    // Construct sorted dictionary of corrections in reverse order (right to left)
    // This ensures that changes don't impact later indexes
    var corrections = new SortedDictionary<int, string[]>(Comparer<int>.Create((a, b) => b.CompareTo(a)));
    for (int i = 0; i < flaggedTokens.Length; i++)
    {
        var correction = flaggedTokens[i];
        var suggestion = correction["suggestions"][0];  // Consider only first suggestion
        if (suggestion["score"] > (decimal)0.7)         // Take it only if highly confident
            corrections[(int)correction["offset"]] = new string[]   // dict key   = offset
                { correction["token"], suggestion["suggestion"] };  // dict value = {error, correction}
    }

    // Apply spelling corrections, in order, from right to left
    foreach (int i in corrections.Keys)
    {
        var oldtext = corrections[i][0];
        var newtext = corrections[i][1];

        // Apply capitalization from original text to correction - all caps or initial caps
        if (text.Substring(i, oldtext.Length).All(char.IsUpper)) newtext = newtext.ToUpper();
        else if (char.IsUpper(text[i])) newtext = newtext[0].ToString().ToUpper() + newtext.Substring(1);

        text = text.Substring(0, i) + newtext + text.Substring(i + oldtext.Length);
    }
    return text;
}
// NOTE:
// In the following sections, we'll add code below this.

Tıklama üzerinde metin çevirTranslate text on click

Yapmanız gereken son şey, Kullanıcı arabirimimizin çevir düğmesine tıklandığında çağrılan bir yöntem oluşturmaktır.The last thing that we need to do is create a method that is invoked when the Translate button in our user interface is clicked.

  1. Visual Studio 'da MainWindow.xaml.cssekmesini açın.In Visual Studio, open the tab for MainWindow.xaml.cs.
  2. Bu kodu projenize CorrectSpelling() yönteminin altına ekleyin ve kaydedin:Add this code to your project below the CorrectSpelling() method and save:
    // ***** PERFORM TRANSLATION ON BUTTON CLICK
    private async void TranslateButton_Click(object sender, EventArgs e)
    {
        string textToTranslate = TextToTranslate.Text.Trim();
    
        string fromLanguage = FromLanguageComboBox.SelectedValue.ToString();
        string fromLanguageCode;
    
        // auto-detect source language if requested
        if (fromLanguage == "Detect")
        {
            fromLanguageCode = DetectLanguage(textToTranslate);
            if (!languageCodes.Contains(fromLanguageCode))
            {
                MessageBox.Show("The source language could not be detected automatically " +
                    "or is not supported for translation.", "Language detection failed",
                    MessageBoxButton.OK, MessageBoxImage.Error);
                return;
            }
        }
        else
            fromLanguageCode = languageCodesAndTitles[fromLanguage];
    
        string toLanguageCode = languageCodesAndTitles[ToLanguageComboBox.SelectedValue.ToString()];
    
        // spell-check the source text if the source language is English
        if (fromLanguageCode == "en")
        {
            if (textToTranslate.StartsWith("-"))    // don't spell check in this case
                textToTranslate = textToTranslate.Substring(1);
            else
            {
                textToTranslate = CorrectSpelling(textToTranslate);
                TextToTranslate.Text = textToTranslate;     // put corrected text into input field
            }
        }
        // handle null operations: no text or same source/target languages
        if (textToTranslate == "" || fromLanguageCode == toLanguageCode)
        {
            TranslatedTextLabel.Content = textToTranslate;
            return;
        }
    
        // send HTTP request to perform the translation
        string endpoint = string.Format(TEXT_TRANSLATION_API_ENDPOINT, "translate");
        string uri = string.Format(endpoint + "&from={0}&to={1}", fromLanguageCode, toLanguageCode);
    
        System.Object[] body = new System.Object[] { new { Text = textToTranslate } };
        var requestBody = JsonConvert.SerializeObject(body);
    
        using (var client = new HttpClient())
        using (var request = new HttpRequestMessage())
        {
            request.Method = HttpMethod.Post;
            request.RequestUri = new Uri(uri);
            request.Content = new StringContent(requestBody, Encoding.UTF8, "application/json");
            request.Headers.Add("Ocp-Apim-Subscription-Key", COGNITIVE_SERVICES_KEY);
            request.Headers.Add("Ocp-Apim-Subscription-Region", "westus");
            request.Headers.Add("X-ClientTraceId", Guid.NewGuid().ToString());
    
            var response = await client.SendAsync(request);
            var responseBody = await response.Content.ReadAsStringAsync();
    
            var result = JsonConvert.DeserializeObject<List<Dictionary<string, List<Dictionary<string, string>>>>>(responseBody);
            var translation = result[0]["translations"][0]["text"];
    
            // Update the translation field
            TranslatedTextLabel.Content = translation;
        }
    }
    

İlk adım, "Kimden" ve "to" dillerini ve kullanıcının formumuza girdiği metni almak için kullanılır.The first step is to get the "from" and "to" languages, and the text the user entered into our form. Kaynak dil Algılaolarak ayarlandıysa, kaynak metnin dilini belirlemek için DetectLanguage() çağırılır.If the source language is set to Detect, DetectLanguage() is called to determine the language of the source text. Metin, çevirmen API 'sinin desteklemediği bir dilde olabilir.The text might be in a language that the Translator API doesn't support. Bu durumda, kullanıcıyı bilgilendirmek için bir ileti görüntüler ve metni çevirmeden geri döndürün.In that case, display a message to inform the user, and return without translating the text.

Kaynak dil İngilizce ise (belirtilerek veya algılanarak), metnin yazımını CorrectSpelling() ile denetleyin ve düzeltmeleri uygulayın.If the source language is English (whether specified or detected), check the spelling of the text with CorrectSpelling() and apply any corrections. Düzeltilen metin, kullanıcının bir düzeltmenin yapıldığını görmesi için metin alanına geri eklenir.The corrected text is added back into the text area so that the user sees that a correction was made.

Metni çevirecek kod tanıdık gelmelidir: URI oluşturma, istek oluşturma, gönderme ve yanıtı ayrıştırma.The code to translate text should look familiar: build the URI, create a request, send it, and parse the response. JSON dizisi çeviri için birden fazla nesne içerebilir, ancak uygulamamız yalnızca bir tane gerektirir.The JSON array may contain more than one object for translation, however, our app only requires one.

Başarılı bir istekten sonra, TranslatedTextLabel.Content, çevrilmiş metni göstermek için Kullanıcı arabirimini güncelleştiren translationile değiştirilmiştir.After a successful request, TranslatedTextLabel.Content is replaced with the translation, which updates the user interface to display the translated text.

WPF uygulamanızı çalıştırmaRun your WPF app

Bu, WPF kullanılarak oluşturulan bir çalışan çeviri uygulamasına sahipsiniz.That's it, you have a working translation app built using WPF. Uygulamanızı çalıştırmak için, Visual Studio 'daki Başlat düğmesine tıklayın.To run your app, click the Start button in Visual Studio.

Kaynak kodSource code

Bu proje için kaynak kodu GitHub ' da kullanılabilir.Source code for this project is available on GitHub.

Sonraki adımlarNext steps