Öğretici: XAML ve C ile Visual Studio'da ilk Evrensel Windows Platformu uygulamanızı oluşturma#

Bu öğreticide, Visual Studio tümleşik geliştirme ortamına (IDE) giriş olarak, herhangi bir Windows 10 veya üzeri cihazda çalışan bir "Merhaba Dünya" uygulaması oluşturacaksınız. Bunu yapmak için bir Evrensel Windows Platformu (UWP) proje şablonu, Genişletilebilir Uygulama Biçimlendirme Dili (XAML) ve C# programlama dili kullanırsınız.

Not

Evrensel Windows Platformu'ndaki (UWP) geçerli işlevinizden memnunsanız proje türünüzü Windows Uygulama SDK'sına geçirmeniz gerekmez. WinUI 2.x ve Windows SDK,UWP proje türlerini destekler. WinUI 3 ve Windows Uygulama SDK'sını kullanmaya başlamak istiyorsanız, Windows Uygulama SDK'sı öğreticisindeki adımları izleyebilirsiniz.

Bu öğreticide siz:

• Proje oluşturma
• Uygulama oluşturma
• Uygulamayı çalıştırma

Önkoşullar

Şunlara sahip olmanız gerekir:

• Visual Studio. Visual Studio indirmeleri sayfasını ücretsiz sürüm için ziyaret edin.

• UWP uygulaması geliştirmek için gereken iş yükleri ve bileşenler. Visual Studio'da bir iş yükünü doğrulamak veya yüklemek için Araçlar>Araçları ve Özellikleri Al'ı seçin veya Yeni proje oluştur penceresinde Daha fazla araç ve özellik yükle bağlantısını seçin. Daha fazla bilgi için bkz. iş yüklerini veya tek tek bileşenleri değiştirme.

  Visual Studio Yükleyicisi'nin İş Yükleri sekmesinde aşağıdaki iş yüklerini ve bileşenleri seçin:

  Visual Studio 2022 sürüm 17.10 ve üzeri

  • UWP kullanarak uygulama geliştirme için WinUI uygulama geliştirme iş yükünü seçin. Ardından, Yükleme ayrıntıları bölmesinde, WinUI uygulama geliştirme düğümü altında, ihtiyacınız olan UWP seçeneğini belirleyin (bu, gerekli ek bileşenleri de seçer)

  • C# için Evrensel Windows Platformu araçları ve Windows 11 SDK'sı (10.0.26100.0) öğesini seçin.

  • Bu öğretici için UWP Boş Uygulama proje şablonu gereklidir.

  Visual Studio 2022 sürüm 17.1 - 17.9

  • UWP kullanarak C# uygulaması geliştirme için Evrensel Windows Platformu geliştirme iş yükünü seçin.

  • Bu öğretici, Boş Uygulama (Evrensel Windows) proje şablonunu gerektirir.

  Not

  Visual Studio 17.10 - 17.12'de bu iş yükü Windows uygulama geliştirme olarak adlandırılır.

Proje oluşturma

İlk olarak bir Evrensel Windows Platformu projesi oluşturun. Proje türü, herhangi bir şey eklemeden önce ihtiyacınız olan tüm şablon dosyalarıyla birlikte gelir!

1. Visual Studio'yu açın ve başlangıç penceresinde yeni proje oluştur seçin.

2. Yeni proje oluştur ekranında, arama kutusuna Evrensel Windows yazın, Visual Studio 2022 17.10 veya sonraki sürümlerinde Boş Uygulama (Evrensel Windows) veya UWP Boş Uygulama için C# şablonunu seçin ve ardından İleri'yi seçin.

   

3. Projeye bir ad verin, HelloWorld, ve Oluşturseçin.

   

4. Varsayılan Hedef sürüm ve En düşük sürüm ayarlarını, Yeni Evrensel Windows Platformu Projesi iletişim kutusunda kabul edin.

   

   Not

   UWP uygulaması oluşturmak için Visual Studio'yu ilk kez kullanıyorsanız Windows için Geliştirici Modunu Etkinleştir iletişim kutusu görüntülenir. Geliştiriciler için ayarları seçin, Ayarlarıaçmak için. Geliştirici modunu açınve ardından Evetseçin.

   

   Visual Studio sizin için ek bir Geliştirici Modu paketi yükler. Paket yüklemesi tamamlandığında, Ayarlar iletişim kutusunu kapatın.

Uygulamayı oluşturma

Geliştirmeye başlamanın zamanı geldi. Düğme denetimi ekleyin, düğmeye bir eylem ekleyin ve ardından nasıl göründüğünü görmek için "Merhaba Dünya" uygulamasını başlatın.

Tasarım tuvaline düğme ekleme

1. Çözüm Gezgini'de, bölünmüş görünümü açmak için MainPage.xaml'ye çift tıklayın.

   

   İki bölme vardır: bir tasarım tuvali içeren XAML Tasarımcısıve kod ekleyebileceğiniz veya değiştirebileceğiniz XAML Düzenleyicisi.

   

2. Araç Kutusu açılır penceresini açmak için Araç Kutusu seçin.

   

   Araç Kutusu seçeneğini görmüyorsanız menü çubuğundan açabilirsiniz. Bunu yapmak için Görünüm>Araç Çubuğu'nuseçin. Alternatif olarak, Ctrl+Alt+Xtuşlarına basın.

3. Araç Kutusu penceresini sabitlemek için Pin simgesini seçin.

   

4. Düğmesi denetimini seçin ve tasarım tuvaline sürükleyin.

   

   XAML Düzenleyicisikoduna bakarsanız Düğme'nin de burada göründüğünü görürsünüz:

   

Düğmeye etiket ekleme

1. XAML Düzenleyicisiiçinde, Button Content değerini Düğmesi'dan Hello World! olarak değiştirin.

   

2. XAML Tasarımcısı'ndaki düğmenin de değiştiğine dikkat edin.

   

Olay işleyicisi ekleme

olay işleyicisi karmaşık görünebilir, ancak bir olay meydana geldiğinde çağrılan kod için başka bir isimden ibarettir. Bu durumda, Hello World! düğmesine bir eylem ekler.

1. Tasarım tuvalinde düğme denetimine çift tıklayın.

2. Sayfanın kod arka planı olan MainPage.xaml.cs'deki olay işleyici kodunu düzenleyin.

   İşte burada işler ilginçleşiyor. Varsayılan olay işleyicisi şöyle görünür:

   

   Şunun gibi görünmesi için değiştirin:

   

   Kopyalayıp yapıştırmak için gereken kod şu şekildedir:

   private async void Button_Click(object sender, RoutedEventArgs e)
   {
      MediaElement mediaElement = new MediaElement();
      var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
      Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync("Hello, World!");
      mediaElement.SetSource(stream, stream.ContentType);
      mediaElement.Play();
   }
   

Az önce ne yaptık?

Kod, konuşma sentezi nesnesi oluşturmak için bazı Windows API'lerini kullanır ve ardından bunu söylemek için bir metin verir. SpeechSynthesiskullanma hakkında daha fazla bilgi için bkz. System.Speech.Synthesis.

Uygulamayı çalıştırma

"Nasıl göründüğünü ve nasıl ses çıkardığını görmek için 'Hello World' UWP uygulamasını inşa etmenin, dağıtmanın ve başlatmanın zamanı geldi." Nasıl yapıldığını burada bulabilirsiniz.

1. Uygulamayı yerel makinede başlatmak için Yürüt düğmesini (Yerel Makine ) kullanın.

   

   Alternatif olarak, menü çubuğundan "Hata Ayıklama Başlat>" seçeneğini seçebilir veya uygulamanızı başlatmak için "F5" tuşuna basabilirsiniz.

2. Bir giriş ekranı kaybolduktan hemen sonra görünen uygulamanızı görüntüleyin. Uygulama şu görüntüye benzer görünmelidir:

   

3. Merhaba Dünya düğmesini seçin.

   Windows 10 veya üzeri cihazınız gerçekten "Merhaba, Dünya!" diyor.

4. Uygulamayı kapatmak için araç çubuğunda hata ayıklamayı durdur düğmesini seçin. Alternatif olarak, menü çubuğundan Hata Ayıklama>Hata Ayıklamayı Durdur seçeneğini belirleyin veya Shift+F5tuşlarına basın.

İlgili içerik

• UWP'ye genel bakış
• UWP uygulama örneklerini alma

Sonraki adım

Bu öğreticiyi tamamladığınız için tebrikler! UWP ve Visual Studio IDE hakkında bazı temel bilgileri öğrendiğinizi umuyoruz. Daha fazla bilgi edinmek için aşağıdaki öğreticiyle devam edin:

Kullanıcı arabirimi oluşturma