[Proposal] LazyView

LazyView

• Proposed
• Prototype:
• Implementation
  • iOS Support
  • Android Support
  • macOS Support
  • Windows Support
• Unit Tests
• Sample
• Documentation: https://github.com/MicrosoftDocs/CommunityToolkit/pull/245

Summary

The LazyView control allows you to delay the initialization of a View. You need to provide the type of the View that you want to be rendered, using the x:TypeArguments XAML namespace attribute, and handle its initialization using the LoadViewAsync method. The IsLoaded property can be examined to determine when the LazyView is loaded.

Note: This proposal is a to port the existing LazyView functionality from the Xamarin Community Toolkit

• Existing Docs
• Xamarin Community Toolkit Implementation

Motivation

LazyView is one of the views that exist in the Xamarin Community Toolkit that has been requested as a missing piece in the migration of some big apps from Xamarin to MAUI.

Detailed Design

Properties:

Property	Type	Description
IsLoaded	bool	Gets the loaded status of the LazyView.

Methods:

Method	Return Type	Description
LoadViewAsync	ValueTask	Initialize the View.
Dispose	void	Cleans up the View, if required.

BaseLazyView.shared.cs

public abstract class BaseLazyView : ContentView, IDisposable
{
  internal static readonly BindablePropertyKey IsLoadedPropertyKey = BindableProperty.CreateReadOnly(nameof(IsLoaded), typeof(bool), typeof(BaseLazyView), default);
  public static readonly BindableProperty IsLoadedProperty = IsLoadedPropertyKey.BindableProperty;
  
  public bool IsLoaded => (bool)GetValue(IsLoadedProperty);
  
  protected void SetIsLoaded(bool isLoaded) => SetValue(IsLoadedPropertyKey, isLoaded);
  
  public abstract ValueTask LoadViewAsync();
  
  public void Dispose()
  {
    if (Content is IDisposable disposable)
    disposable.Dispose();
  }
  
  protected override void OnBindingContextChanged()
  {
    if (Content != null && !(Content is ActivityIndicator))
    Content.BindingContext = BindingContext;
  }
}

LazyView.shared.cs

public class LazyView<TView> : BaseLazyView where TView : View, new()
{
  public override ValueTask LoadViewAsync()
  {
    View view = new TView { BindingContext = BindingContext };
    
    Content = view;
    
    SetIsLoaded(true);
    return new ValueTask(Task.FromResult(true));
  }
}

Usage Syntax

XAML Usage

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
             x:Class="MyLittleApp.MainPage"
             xmlns:local="clr-namespace:Xamarin.CommunityToolkit.Sample.Pages.Views.TabView">

     <StackLayout>

        <xct:LazyView x:TypeArguments="local:LazyTestView" IsLoaded = "{Binding IsLoaded}" />

    </StackLayout>

</ContentPage>

C# Usage

new StackLayout
{
  Children = 
  {
    new LazyView<Button>()
      .Bind(LazyView.IsLoadedProperty, nameof(ViewModel.IsLoaded))
  }
};

[VladislavAntonyuk]

Maybe we should enhance it to DelayedView: https://www.sharpnado.com/delayed-view/

[pictos]

@ChaplinMarchais please, ask him to comment here, that way we can assign this issue to your friend