.NET MAUI'de QR Kod Nasıl Üretilir

.NET MAUI Nedir?

.NET MAUI (Çoklu Platform Uygulama UI), geliştiricilerin tek bir kod tabanı kullanarak birden fazla platform için yerel kullanıcı arayüzleri oluşturmasına olanak tanıyan Xamarin Forms çerçevesinin bir evrimidir. .NET MAUI ile, geliştirme süresini ve çabasını azaltarak Android, iOS, macOS, Windows ve daha pek çok uygulama oluşturabilirsiniz.

IronBarcode'u Tanıtıyoruz

IronBarcode, .NET uygulamaları için güçlü bir barkod ve QR kodu oluşturma kütüphanesidir. Çeşitli barkod türleri oluşturmak için kolay bir API sunar, ayarlanabilir ayarlar gibi boyut, hata düzeltme ve kodlama seçenekleriyle birlikte.

.NET MAUI Projesi Kurulumu

Başlamak için, Microsoft Visual Studio 2022'de yeni bir .NET MAUI projesi oluşturmamız gerekiyor. Microsoft Visual Studio Code'u da kullanabilirsiniz ancak adımlar farklı olacaktır. Ancak, Visual Studio kullanılması önerilir. Projeyi oluşturmak için aşağıdaki adımları izleyin.

Visual Studio 2022'yi açın. Aşağıda gösterildiği gibi aşağıdaki ekran görünecektir.

Yeni Bir Proje Oluştur'a tıklayın ve aşağıda gösterildiği gibi MAUI şablonunu arayın.

.NET MAUI Uygulama Şablonunu seçin ve İleri Düğmesine tıklayın. Aşağıdaki pencere açılacaktır.

Projenizi adlandırın, konumu seçin ve İleri Düğmesine tıklayın, aşağıda gösterildiği gibi aşağıdaki pencere görünecektir.

.NET Framework'ü seçin. .NET 7'yi seçtim, siz de .NET 6.0'ı seçebilirsiniz. Proje aşağıda gösterildiği gibi oluşturulacaktır.

Bu öğretici öncelikle yerel bir Windows makinesine .NET MAUI uygulamasının ilk dağıtımına odaklanmaktadır. Aynı kod tabanıyla ihtiyaçınıza göre Android veya iOS simülatörlerinde de yapılandırabilirsiniz.

Bir .NET MAUI uygulamasını yerel Windows makinenize dağıtmak için Visual Studio'yu kullanarak bu adımları izleyebilirsiniz:

1. Hedef hata ayıklaması 'Windows Machine' olarak ayarlandığından emin olun. Ayarlı değilse, araç çubuğundaki açılır menüden 'Windows Machine' seçin.
2. 'Hata Ayıklamayı Başlat' düğmesine tıklayın veya Uygulamayı Windows makinenizde derlemek ve çalıştırmak için F5 tuşuna basın.

Eğer Windows makinenizde Geliştirici Modu etkin değilse, Visual Studio sizi etkinleştirmeniz gerektiği konusunda uyaracaktır. Bunu yapmak için bu adımları izleyin:

1. Visual Studio tarafından gösterilen 'Windows için Geliştirici Modunu Etkinleştir' iletişim kutusunda 'geliştiriciler için ayarlar' etiketli bağlantıyı bulun.

2. 'geliştiriciler için ayarlar' bağlantısına tıklayın. Bu, Windows makinenizde Ayarlar uygulamasını açacaktır.
3. Aşağıda gösterildiği gibi Geliştirici Modu'nu etkinleştirmek için açma/kapama düğmesini açın.

Geliştirici modu aktif olduktan sonra projeyi çalıştırın. Aşağıdaki pencere açılacaktır:

Bu, Visual Studio 2022 tarafından proje oluşturma sırasında otomatik olarak oluşturulan şablon uygulamasıdır. Şimdi IronBarcode'u kuracak ve gereksinimimize göre kodu değiştireceğiz.

IronBarcode Yükleme

IronBarcode'u kurmak için NuGet Paket Yöneticisi Konsolunu açın. Visual Studio'da Paket Yöneticisi Konsolunu açmak için bu adımları izleyebilirsiniz:

1. Windows makinenizde Visual Studio'yu başlatın.
2. Çalışmak istediğiniz projeyi açın veya yeni bir proje oluşturun.
3. Visual Studio menüsünde 'Araçlar'a gidin.
4. Açılır menüden 'NuGet Paket Yöneticisi' seçeneğine tıklayın.
5. Başka bir açılır menü görünecektir ve 'Paket Yöneticisi Konsolu'nu seçmelisiniz.

Paket Yöneticisi Konsolu penceresi açılacak ve projenizdeki NuGet paketlerini yönetmek için bir komut satırı arayüzü sağlayacaktır. IronBarcode'u kurmak için Paket Yöneticisi Konsoluna aşağıdaki komutu yazın.

Install-Package BarCode

Bu, IronBarcode kütüphanesini projenize ekler ve kullanım için hazır hale getirir.

IronBarcode Kullanarak .NET MAUI QR Kod Oluşturucu

Şimdi, kendi QR Kod Oluşturucu mobil uygulamamızı oluşturmak için kodu yazalım. Oluşturulan QR kodunu ekranda göstermek için .NET MAUI'nin yeteneklerinden faydalanacağız. MainPage.xaml dosyasını açın ve aşağıdaki kodla değiştirin.

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="QrCodeGeneratorMAUI.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Label
                Text="Hello!"
                SemanticProperties.HeadingLevel="Level1"
                FontSize="32"
                HorizontalOptions="Center" />

            <Label
                Text="Welcome to QR Code Generator .NET Multi-platform App UI"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to QR Code Generator dot Net Multi platform App U I"
                FontSize="18"
                HorizontalOptions="Center" />

            <Entry x:Name="qrCodeText"
                   Placeholder="Enter QR Code"/>

            <Image
                x:Name="qrCodeImage"
                HeightRequest="200"
                HorizontalOptions="Center" />

            <Button
                x:Name="CounterBtn"
                Text="Generate QR Code"
                Clicked="OnButtonClicked"
                HorizontalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="QrCodeGeneratorMAUI.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Label
                Text="Hello!"
                SemanticProperties.HeadingLevel="Level1"
                FontSize="32"
                HorizontalOptions="Center" />

            <Label
                Text="Welcome to QR Code Generator .NET Multi-platform App UI"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to QR Code Generator dot Net Multi platform App U I"
                FontSize="18"
                HorizontalOptions="Center" />

            <Entry x:Name="qrCodeText"
                   Placeholder="Enter QR Code"/>

            <Image
                x:Name="qrCodeImage"
                HeightRequest="200"
                HorizontalOptions="Center" />

            <Button
                x:Name="CounterBtn"
                Text="Generate QR Code"
                Clicked="OnButtonClicked"
                HorizontalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

Yukarıdaki XAML kodu, QR kodları oluşturan bir .NET MAUI sayfasını temsil ediyor. İşte .NET MAUI bileşenlerinin basit bir açıklaması:

• <Label>: Ekranda metin görüntüler. Bu uygulamada, kullanıcıya bilgi ve talimatlar sağlamak için hoş geldiniz mesajı ve bir başlık göstermek için kullanılır.
• <Entry>: Kullanıcı için bir metin giriş alanı sağlar. Bu uygulamada, kullanıcının bir QR koduna kodlamak istediği içeriği girmesine izin verir.
• <Image>: Ekranda bir resim görüntüler. Bu uygulamada, kullanıcı oluştur düğmesine tıkladıktan sonra oluşturulan QR kodu görüntüsünü göstermek için kullanılır.
• <Button>: Tıklanabilir bir butonu temsil eder. Tıklandığında bir eylemi tetiklemesine izin verir. Bu uygulamada, buton, kullanıcının <Entry> alanına girdiği içeriğe dayanarak QR kodu oluşturmayı başlatmak için kullanılır.

Bu bileşenler bir araya gelip kullanıcıya metin girme, bir düğmeye tıklama ve ekranda gösterilen ilgili QR kodunu gösterme imkanı sunar.

Şimdi, QR Kod üretimi için backend kodunu yazalım. MainPage.xaml.cs dosyasını açın ve kod-behind sınıfını şu şekilde güncelleyin:

using IronBarCode;

namespace QrCodeGeneratorMAUI
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private void OnButtonClicked(object sender, EventArgs e)
        {
            // Get the text from the entry field
            string text = qrCodeText.Text;

            // Generate the QR code using the IronBarcode library
            var qrCode = QRCodeWriter.CreateQrCode(text);

            // Convert the QR code to binary JPEG data
            var qrCodeBytes = qrCode.ToJpegBinaryData();

            // Set the QR code image source to display the generated QR code on the UI
            qrCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
        }
    }
}

using IronBarCode;

namespace QrCodeGeneratorMAUI
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private void OnButtonClicked(object sender, EventArgs e)
        {
            // Get the text from the entry field
            string text = qrCodeText.Text;

            // Generate the QR code using the IronBarcode library
            var qrCode = QRCodeWriter.CreateQrCode(text);

            // Convert the QR code to binary JPEG data
            var qrCodeBytes = qrCode.ToJpegBinaryData();

            // Set the QR code image source to display the generated QR code on the UI
            qrCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
        }
    }
}

Imports IronBarCode

Namespace QrCodeGeneratorMAUI
	Partial Public Class MainPage
		Inherits ContentPage

		Public Sub New()
			InitializeComponent()
		End Sub

		Private Sub OnButtonClicked(ByVal sender As Object, ByVal e As EventArgs)
			' Get the text from the entry field
			Dim text As String = qrCodeText.Text

			' Generate the QR code using the IronBarcode library
			Dim qrCode = QRCodeWriter.CreateQrCode(text)

			' Convert the QR code to binary JPEG data
			Dim qrCodeBytes = qrCode.ToJpegBinaryData()

			' Set the QR code image source to display the generated QR code on the UI
			qrCodeImage.Source = ImageSource.FromStream(Function() New MemoryStream(qrCodeBytes))
		End Sub
	End Class
End Namespace

İşte kod açıklaması.

1. OnButtonClicked metodu, bir butonun tıklama olayının olay işleyicisidir. Düğmeye tıklanıldığında, bu yöntem yürütülür.
2. OnButtonClicked metodu içinde, qrCodeText giriş alanında bulunan metin, metin değişkenine atanır.
3. QRCodeWriter.CreateQrCode(text), girilen metne dayalı bir QR kodu oluşturmak için kullanılır.
4. qrCode.ToJpegBinaryData(), QR kodunu ikili JPEG verisine dönüştürür.
5. qrCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes)), oluşturulan QR kodu görüntüsünü göstermek için qrCodeImage kontrolünün kaynağını ayarlar.

private void OnButtonClicked(object sender, EventArgs e)
{
    // Get the text from the entry field
    string text = qrCodeText.Text;

    // Generate the QR code using the IronBarcode library
    var qrCode = QRCodeWriter.CreateQrCode(text);

    // Add the text of the QR code value below the generated barcode
    qrCode.AddBarcodeValueTextBelowBarcode();

    // Add an annotation text above the barcode
    qrCode.AddAnnotationTextAboveBarcode("My QR Code Generated by .NET MAUI App");

    // Convert the QR code to binary JPEG data
    var qrCodeBytes = qrCode.ToJpegBinaryData();

    // Set the QR code image source to display the generated QR code on the UI
    qrCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
}

private void OnButtonClicked(object sender, EventArgs e)
{
    // Get the text from the entry field
    string text = qrCodeText.Text;

    // Generate the QR code using the IronBarcode library
    var qrCode = QRCodeWriter.CreateQrCode(text);

    // Add the text of the QR code value below the generated barcode
    qrCode.AddBarcodeValueTextBelowBarcode();

    // Add an annotation text above the barcode
    qrCode.AddAnnotationTextAboveBarcode("My QR Code Generated by .NET MAUI App");

    // Convert the QR code to binary JPEG data
    var qrCodeBytes = qrCode.ToJpegBinaryData();

    // Set the QR code image source to display the generated QR code on the UI
    qrCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
}

Private Sub OnButtonClicked(ByVal sender As Object, ByVal e As EventArgs)
	' Get the text from the entry field
	Dim text As String = qrCodeText.Text

	' Generate the QR code using the IronBarcode library
	Dim qrCode = QRCodeWriter.CreateQrCode(text)

	' Add the text of the QR code value below the generated barcode
	qrCode.AddBarcodeValueTextBelowBarcode()

	' Add an annotation text above the barcode
	qrCode.AddAnnotationTextAboveBarcode("My QR Code Generated by .NET MAUI App")

	' Convert the QR code to binary JPEG data
	Dim qrCodeBytes = qrCode.ToJpegBinaryData()

	' Set the QR code image source to display the generated QR code on the UI
	qrCodeImage.Source = ImageSource.FromStream(Function() New MemoryStream(qrCodeBytes))
End Sub

.NET MAUI Barkod Üretici

IronBarcode kütüphanesinin yardımıyla bir .NET MAUI Barkod Üretici de oluşturabilirsiniz. Koda biraz değişiklik yapmanız yeterlidir ve aşağıdaki kod örneğinde gösterildiği gibi hazırsınız.

private void OnButtonClicked(object sender, EventArgs e)
{
    // Get the text from the entry field
    string text = barCodeText.Text;

    // Generate the barcode using the IronBarcode library with Code128 encoding
    var barCode = BarcodeWriter.CreateBarcode(text, BarcodeEncoding.Code128);

    // Add the text of the barcode value below the generated barcode
    barCode.AddBarcodeValueTextBelowBarcode();

    // Add an annotation text above the barcode
    barCode.AddAnnotationTextAboveBarcode("My Barcode Generated by .NET MAUI App");

    // Convert the barcode to binary JPEG data
    var qrCodeBytes = barCode.ToJpegBinaryData();

    // Set the barcode image source to display the generated barcode on the UI
    barCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
}

private void OnButtonClicked(object sender, EventArgs e)
{
    // Get the text from the entry field
    string text = barCodeText.Text;

    // Generate the barcode using the IronBarcode library with Code128 encoding
    var barCode = BarcodeWriter.CreateBarcode(text, BarcodeEncoding.Code128);

    // Add the text of the barcode value below the generated barcode
    barCode.AddBarcodeValueTextBelowBarcode();

    // Add an annotation text above the barcode
    barCode.AddAnnotationTextAboveBarcode("My Barcode Generated by .NET MAUI App");

    // Convert the barcode to binary JPEG data
    var qrCodeBytes = barCode.ToJpegBinaryData();

    // Set the barcode image source to display the generated barcode on the UI
    barCodeImage.Source = ImageSource.FromStream(() => new MemoryStream(qrCodeBytes));
}

Private Sub OnButtonClicked(ByVal sender As Object, ByVal e As EventArgs)
	' Get the text from the entry field
	Dim text As String = barCodeText.Text

	' Generate the barcode using the IronBarcode library with Code128 encoding
	Dim barCode = BarcodeWriter.CreateBarcode(text, BarcodeEncoding.Code128)

	' Add the text of the barcode value below the generated barcode
	barCode.AddBarcodeValueTextBelowBarcode()

	' Add an annotation text above the barcode
	barCode.AddAnnotationTextAboveBarcode("My Barcode Generated by .NET MAUI App")

	' Convert the barcode to binary JPEG data
	Dim qrCodeBytes = barCode.ToJpegBinaryData()

	' Set the barcode image source to display the generated barcode on the UI
	barCodeImage.Source = ImageSource.FromStream(Function() New MemoryStream(qrCodeBytes))
End Sub

Sonuç

Bu makalede, .NET MAUI ve IronBarcode kütüphanesi kullanarak bir QR kod üretici ve Barkod Üretici nasıl oluşturulacağını öğrendik. IronBarcode'u kurma, QR kodları oluşturma adımlarını inceledik ve .NET MAUI'nin resim kontrolü ile ekran üzerinde nasıl görüntüleneceklerini gösterdik.

.NET MAUI, çapraz platform uygulamaları oluşturmak için güçlü bir çerçeve sağlar ve IronBarcode, barkod ve QR kodu oluşturma sürecini basitleştirir. Bu teknolojileri birleştirerek, modern cihazların yeteneklerinden yararlanan çok yönlü ve etkili uygulamalar oluşturabilirsiniz.