[Proposal] IViewSwitcher

[TheCodeTraveler]

ViewSwitcher

• [x] Proposed
• [ ] Prototype: Not Started
• [ ] Implementation: Not Started
  • [ ] iOS Support
  • [ ] Android Support
  • [ ] macOS Support
  • [ ] Windows Support
• [ ] Unit Tests: Not Started
• [ ] Sample: Not Started
• [ ] Documentation: Not Started

Summary

Allows transitions between VisualElement

Detailed Design

IViewSwitcher.shared.cs

interface IViewSwitcher
{
  uint TransitionDuration { get; set; }
  TransitionType TransitionType { get; set; }
}

ImageSwitcher.shared.cs

class ImageSwitcher : Image, IViewSwitcher
{
  public static readonly BindableProperty TransitionDurationProperty;
  public static readonly BindableProperty TransitionTypeProperty;
  
  public uint TransitionDuration { get; set; }
  public TransitionType TransitionType { get; set; }
}

TextSwitcher.shared.cs

public class TextSwitcher : Label, IViewSwitcher
{
  public static readonly BindableProperty TransitionDurationProperty;
  public static readonly BindableProperty TransitionTypeProperty;
  
  public uint TransitionDuration { get; set; }
  public TransitionType TransitionType { get; set; }
}

TransitionType.shared.cs

public enum TransitionType { Fade, MoveInFromLeft }

Usage Syntax

XAML Usage

<StackLayout HorizontalOptions="CenterAndExpand">
  <xct:TextSwitcher
      x:Name="switcher"
      TextColor="Black"
      FontSize="30"
      Text="Random Text" />
  <Button Text="Update Text"
          CommandParameter="{x:Reference switcher}"
          Command="{Binding UpdateTextCommand, Source={x:Reference page}}" />
</StackLayout>

C# Usage

Content = new StackLayout
{
  new TextSwitcher
  { 
    Text = "Random Text",
    FontSize = 30,
    TextColor = Colors.Black,
  }.Assign(out var switcher),

  new Button
  {
    CommandParameter = switcher,
    Command = new Command<TextSwitcher>(textSwitcher => textSwitcher.Text = Path.GetRandomFileName())
  }
};