Xamarin'de MVVM ile Login Page Yapımı

Giriş
Xamarin.Forms'da MVVM (Model-View-ViewModel) deseni, kullanıcı arayüzü ve iş mantığını ayrı tutarak uygulamaları daha sürdürülebilir ve test edilebilir hale getirir. Bu makalede, MVVM deseni kullanarak bir login (giriş) sayfası oluşturmayı öğreneceğiz. Kullanıcıdan alınan giriş bilgilerini doğrulamak için ViewModel ile Model arasındaki iletişim üzerinde duracağız.

MVVM'nin Login Page Uygulamasına Katkıları
MVVM, kullanıcı giriş işlemleri gibi senaryolarda birçok avantaj sağlar:

• Bağımsız UI ve İş Mantığı: Login işlemleri için gerekli iş mantığı ViewModel içinde yazılarak UI'den ayrılır.
• Test Edilebilirlik: Giriş doğrulama mantığı ViewModel içinde yazıldığı için kolayca birim testlere tabi tutulabilir.
• Veri Bağlama (Data Binding): Kullanıcı arayüzü ViewModel ile veri bağlama kullanarak iletişim kurar.

1. Model Tanımlama

Giriş işlemi için bir User model sınıfı oluşturacağız:

public class User
{
    public string Username { get; set; }
    public string Password { get; set; }
}

Bu model, kullanıcıdan alınacak verileri temsil eder.

2. ViewModel Tanımlama

LoginViewModel sınıfı, kullanıcı giriş işlemleriyle ilgili iş mantığını içerecek:

using System.ComponentModel;
using System.Windows.Input;
using Xamarin.Forms;

public class LoginViewModel : INotifyPropertyChanged
{
    private string username;
    private string password;
    private string message;

    public string Username
    {
        get => username;
        set
        {
            if (username != value)
            {
                username = value;
                OnPropertyChanged(nameof(Username));
            }
        }
    }

    public string Password
    {
        get => password;
        set
        {
            if (password != value)
            {
                password = value;
                OnPropertyChanged(nameof(Password));
            }
        }
    }

    public string Message
    {
        get => message;
        set
        {
            if (message != value)
            {
                message = value;
                OnPropertyChanged(nameof(Message));
            }
        }
    }

    public ICommand LoginCommand { get; }

    public LoginViewModel()
    {
        LoginCommand = new Command(OnLogin);
    }

    private void OnLogin()
    {
        // Basit bir giriş doğrulama örneği
        if (Username == "admin" && Password == "1234")
        {
            Message = "Giriş Başarılı!";
        }
        else
        {
            Message = "Geçersiz Kullanıcı Adı veya Şifre";
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected virtual void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Açıklama:
LoginViewModel içinde kullanıcı adı ve şifre için Username ve Password özellikleri bulunur. LoginCommand adlı bir ICommand ile login işlemi başlatılır. Kullanıcı giriş bilgileri doğrulandıktan sonra, Message özelliği ile bir geri bildirim gösterilir.

3. View (XAML) Tanımlama

Login ekranı için bir ContentPage tasarlayalım:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MyApp.LoginPage"
             Title="Login Page">
    <ContentPage.BindingContext>
        <local:LoginViewModel />
    </ContentPage.BindingContext>

    <StackLayout Padding="20" VerticalOptions="Center">
        <Label Text="Kullanıcı Adı" />
        <Entry Text="{Binding Username}" Placeholder="Kullanıcı adınızı girin" />
        
        <Label Text="Şifre" />
        <Entry Text="{Binding Password}" Placeholder="Şifrenizi girin" IsPassword="True" />
        
        <Button Text="Giriş Yap" Command="{Binding LoginCommand}" />
        
        <Label Text="{Binding Message}" TextColor="Red" />
    </StackLayout>
</ContentPage>

Açıklama:
Username ve Password girişleri, ViewModel'deki özelliklere bağlanır. Button ile LoginCommand tetiklenir ve kullanıcı giriş doğrulama işlemi yapılır. Message özelliği üzerinden kullanıcıya giriş durumu hakkında geri bildirim gösterilir.

Sonuç

Bu basit örnekte, Xamarin.Forms'da MVVM mimarisi kullanarak bir login sayfası nasıl oluşturulacağını öğrendik. ViewModel'deki iş mantığı sayesinde View (görünüm) daha temiz ve anlaşılır kalır, bu da uygulamayı daha sürdürülebilir hale getirir. Daha karmaşık giriş doğrulama senaryolarında Model katmanını genişleterek veri doğrulama veya API çağrıları gibi işlevsellikler ekleyebilirsiniz.