IView CreateSampleGrid()
{
var layout = new Microsoft.Maui.Controls.Layout2.GridLayout()
{
ColumnSpacing = 0, RowSpacing = 0
};
layout.AddRowDefinition(new RowDefinition()
{
Height = new GridLength(40)
});
layout.AddRowDefinition(new RowDefinition()
{
Height = GridLength.Auto
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(100)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(100)
});
var topLeft = new Label {
Text = "Top Left", BackgroundColor = Colors.LightBlue
};
layout.Add(topLeft);
var bottomLeft = new Label {
Text = "Bottom Left", BackgroundColor = Colors.Lavender
};
layout.Add(bottomLeft);
layout.SetRow(bottomLeft, 1);
var topRight = new Label {
Text = "Top Right", BackgroundColor = Colors.Orange
};
layout.Add(topRight);
layout.SetColumn(topRight, 1);
var bottomRight = new Label {
Text = "Bottom Right", BackgroundColor = Colors.MediumPurple
};
layout.Add(bottomRight);
layout.SetRow(bottomRight, 1);
layout.SetColumn(bottomRight, 1);
layout.BackgroundColor = Colors.Chartreuse;
return(layout);
}
IView CreateSampleCursorSelection()
{
var layout = new Microsoft.Maui.Controls.Layout2.GridLayout()
{
ColumnSpacing = 5, RowSpacing = 8, BackgroundColor = Colors.LightGreen
};
layout.AddRowDefinition(new RowDefinition()
{
Height = new GridLength(50)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(150)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(80)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(80)
});
Entry targetEntry = new() { Placeholder = "Selectable Text" };
Entry forPosition = new() { Keyboard = Keyboard.Numeric, Placeholder = "CursorPos" };
forPosition.TextChanged += (sender, args) =>
{
if (!int.TryParse(args.NewTextValue, out int newPos))
{
return;
}
targetEntry.CursorPosition = newPos;
};
Entry forSelectionLen = new() { Keyboard = Keyboard.Numeric, Placeholder = "SelectionLen" };
forSelectionLen.TextChanged += (sender, args) =>
{
if (!int.TryParse(args.NewTextValue, out int newSelectionLen))
{
return;
}
targetEntry.SelectionLength = newSelectionLen;
};
layout.Add(targetEntry);
layout.Add(forPosition);
layout.SetColumn(forPosition, 1);
layout.Add(forSelectionLen);
layout.SetColumn(forSelectionLen, 2);
return(layout);
}
IView CreateTransformations()
{
var label = new Button
{
BackgroundColor = Colors.Red,
TextColor = Colors.White,
Text = "Transformations",
};
var rotationSlider = new Slider
{
Minimum = -360,
Maximum = 360
};
rotationSlider.ValueChanged += (sender, e) => label.Rotation = e.NewValue;
var verticalStack = new VerticalStackLayout
{
rotationSlider,
label,
};
return(verticalStack);
}
IView CreateAnimations()
{
var image = new Image {
Source = "dotnet_bot.png", VerticalOptions = LayoutOptions.CenterAndExpand
};
var animateButton = new Button {
Text = "Animate", VerticalOptions = LayoutOptions.End
};
animateButton.Clicked += async(sender, args) =>
{
await image.RotateTo(360, 2000);
image.Rotation = 0;
};
var verticalStack = new VerticalStackLayout
{
image,
animateButton,
};
return(verticalStack);
}
IView CreateShapes()
{
var ellipse = new Ellipse {
Fill = new SolidColorBrush(Colors.Red), Stroke = new SolidColorBrush(Colors.Blue), StrokeThickness = 4, HeightRequest = 120, WidthRequest = 200
};
var line = new Line {
X1 = 0, Y1 = 0, X2 = 80, Y2 = 90, Fill = new SolidColorBrush(Colors.Red), Stroke = new SolidColorBrush(Colors.Green), StrokeThickness = 4, StrokeDashArray = new double[] { 2, 2 }, HeightRequest = 200, WidthRequest = 200
};
Geometry pathData = (Geometry) new PathGeometryConverter().ConvertFromInvariantString("M15.999996,0L31.999999,13.000001 15.999996,26.199999 0,13.000001z");
var path = new Microsoft.Maui.Controls.Shapes.Path {
Data = pathData, Fill = new SolidColorBrush(Colors.Pink), Stroke = new SolidColorBrush(Colors.Red), StrokeThickness = 1, HeightRequest = 100, WidthRequest = 100
};
var polyline = new Polyline {
Points = new[] { new Point(10, 10), new Point(100, 50), new Point(50, 90) }, Stroke = new SolidColorBrush(Colors.Black), StrokeThickness = 2, StrokeDashArray = new double[] { 1, 1, 1, 1 }, HeightRequest = 100, WidthRequest = 100
};
var polygon = new Polygon {
Points = new[] { new Point(10, 10), new Point(100, 50), new Point(50, 90) }, Fill = new SolidColorBrush(Colors.LightBlue), Stroke = new SolidColorBrush(Colors.Black), StrokeThickness = 2, StrokeDashArray = new double[] { 2, 2 }, HeightRequest = 100, WidthRequest = 100
};
var rectangle = new Microsoft.Maui.Controls.Shapes.Rectangle {
RadiusX = 12, RadiusY = 6, Fill = new LinearGradientBrush(new GradientStopCollection {
new GradientStop(Colors.Green, 0), new GradientStop(Colors.Blue, 1)
}, new Point(0, 0), new Point(1, 0)), Stroke = new SolidColorBrush(Colors.Purple), StrokeThickness = 8, StrokeDashArray = new float[] { 2, 2 }, HeightRequest = 120, WidthRequest = 200
};
var verticalStack = new VerticalStackLayout
{
ellipse,
line,
path,
polyline,
polygon,
rectangle
};
return(verticalStack);
}
void AddTextResizeDemo(Microsoft.Maui.ILayout layout)
{
var resizeTestButton = new Button {
Text = "Resize Test"
};
var resizeTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.LightBlue, HorizontalOptions = LayoutOptions.Start
};
var explicitWidthTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.LightGreen, WidthRequest = 200
};
var widthAndHeightTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.MediumSeaGreen, WidthRequest = 150, HeightRequest = 40
};
resizeTestButton.Clicked += (sender, args) =>
{
if (resizeTestLabel.Text == "Short Text")
{
resizeTestLabel.Text = LoremIpsum;
explicitWidthTestLabel.Text = LoremIpsum;
widthAndHeightTestLabel.Text = LoremIpsum;
}
else
{
resizeTestLabel.Text = "Short Text";
explicitWidthTestLabel.Text = "Short Text";
widthAndHeightTestLabel.Text = "Short Text";
}
};
layout.Add(resizeTestButton);
layout.Add(resizeTestLabel);
layout.Add(widthAndHeightTestLabel);
layout.Add(explicitWidthTestLabel);
}
void SetupVisibilityTest()
{
var layout = new VerticalStackLayout()
{
BackgroundColor = Colors.BurlyWood
};
var button1 = new Button {
Text = "Controls", Margin = new Thickness(0, 40)
};
var button2 = new Button {
Text = "MAUI"
};
var controlsLabel = new Label {
Text = "Controls Label"
};
controlsLabel.IsVisible = true;
var alwaysVisible = new Label {
Text = "Always visible"
};
var mauiLabel = new VisibilityLabel()
{
Text = "Core Label"
};
button1.Clicked += (sender, args) =>
{
controlsLabel.IsVisible = !controlsLabel.IsVisible;
};
button2.Clicked += (sender, args) =>
{
switch ((mauiLabel as IFrameworkElement).Visibility)
{
case Visibility.Visible:
mauiLabel.SetVisibility(Visibility.Hidden);
break;
case Visibility.Hidden:
mauiLabel.SetVisibility(Visibility.Collapsed);
break;
case Visibility.Collapsed:
mauiLabel.SetVisibility(Visibility.Visible);
break;
}
};
layout.Add(button1);
layout.Add(button2);
layout.Add(controlsLabel);
layout.Add(mauiLabel);
layout.Add(alwaysVisible);
Content = layout;
}
class TestDrawable : IDrawable
{
IView CreateImagesGrid()
{
var layout = new Microsoft.Maui.Controls.Layout2.GridLayout {
ColumnSpacing = 10, RowSpacing = 10, Margin = 10
};
layout.AddRowDefinition(new RowDefinition {
Height = GridLength.Auto
});
layout.AddRowDefinition(new RowDefinition {
Height = new GridLength(120)
});
layout.AddRowDefinition(new RowDefinition {
Height = GridLength.Auto
});
layout.AddRowDefinition(new RowDefinition {
Height = new GridLength(120)
});
layout.AddRowDefinition(new RowDefinition {
Height = GridLength.Auto
});
layout.AddRowDefinition(new RowDefinition {
Height = new GridLength(120)
});
layout.AddRowDefinition(new RowDefinition {
Height = GridLength.Auto
});
layout.AddRowDefinition(new RowDefinition {
Height = new GridLength(120)
});
layout.AddRowDefinition(new RowDefinition {
Height = GridLength.Auto
});
layout.AddRowDefinition(new RowDefinition {
Height = new GridLength(120)
});
layout.AddColumnDefinition(new ColumnDefinition {
Width = new GridLength(120)
});
layout.AddColumnDefinition(new ColumnDefinition {
Width = new GridLength(120)
});
var row = -1;
Add(new Label {
Text = "App Bundle", WidthRequest = 150
}, row: (row += 2) - 1, col: 0, colSpan: 2);
Add(new Image {
Source = "dotnet_bot.png"
}, row: row, col: 0);
Add(new Image {
Source = "animated_heart.gif", IsAnimationPlaying = true
}, row: row, col: 1);
Add(new Label {
Text = "File", WidthRequest = 150
}, row: (row += 2) - 1, col: 0, colSpan: 2);
Add(new Image {
Source = CopyLocal("dotnet_bot.png")
}, row: row, col: 0);
Add(new Image {
Source = CopyLocal("animated_heart.gif"), IsAnimationPlaying = true
}, row: row, col: 1);
Add(new Label {
Text = "Font", WidthRequest = 150
}, row: (row += 2) - 1, col: 0, colSpan: 2);
Add(new Image {
Source = new FontImageSource {
FontFamily = "Ionicons", Glyph = "\uf2fe"
}, BackgroundColor = Color.FromUint(0xFF512BD4), Aspect = Aspect.Center
}, row: row, col: 0);
Add(new Image {
Source = new FontImageSource {
FontFamily = "Dokdo", Glyph = "M"
}, BackgroundColor = Color.FromUint(0xFF512BD4), Aspect = Aspect.Center
}, row: row, col: 1);
Add(new Label {
Text = "URI", WidthRequest = 150
}, row: (row += 2) - 1, col: 0, colSpan: 2);
Add(new Image {
Source = "https://raw.githubusercontent.com/dotnet-foundation/swag/05cc70d33fa8c310147b9bd70ae9e103a072cae0/dotnet-bot/dotnet-bot-pot.png"
}, row: row, col: 0);
Add(new Image {
Source = "https://raw.githubusercontent.com/mono/SkiaSharp/6753bfad91dce1894c69084555dab6494efa90eb/samples/Gallery/Shared/Media/animated-heart.gif", IsAnimationPlaying = true
}, row: row, col: 1);
Add(new Label {
Text = "Stream", WidthRequest = 150
}, row: (row += 2) - 1, col: 0, colSpan: 2);
Add(new Image {
Source = ImageSource.FromStream(() => GetEmbedded("dotnet_bot.png"))
}, row: row, col: 0);
Add(new Image {
Source = ImageSource.FromStream(() => GetEmbedded("animated_heart.gif")), IsAnimationPlaying = true
}, row: row, col: 1);
return(layout);
void Add(IView view, int row = 0, int col = 0, int rowSpan = 1, int colSpan = 1)
{
layout.Add(view);
layout.SetRow(view, row);
layout.SetRowSpan(view, rowSpan);
layout.SetColumn(view, col);
layout.SetColumnSpan(view, colSpan);
}
string CopyLocal(string embeddedPath)
{
var path = Path.Combine(FileSystem.CacheDirectory, Guid.NewGuid().ToString("N"));
using var stream = GetEmbedded(embeddedPath);
using var file = File.Create(path);
stream.CopyTo(file);
return(path);
}
Stream GetEmbedded(string embeddedPath)
{
var assembly = GetType().Assembly;
var name = assembly
.GetManifestResourceNames()
.First(n => n.EndsWith(embeddedPath, StringComparison.InvariantCultureIgnoreCase));
return(assembly.GetManifestResourceStream(name));
}
}
IView CreateSampleCursorSelection()
{
var layout = new Microsoft.Maui.Controls.Layout2.GridLayout()
{
ColumnSpacing = 5, RowSpacing = 8, BackgroundColor = Colors.LightGreen
};
layout.AddRowDefinition(new RowDefinition()
{
Height = new GridLength(50)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(150)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(80)
});
layout.AddColumnDefinition(new ColumnDefinition()
{
Width = new GridLength(80)
});
Entry targetEntry = new() { Placeholder = "Selectable Text" };
Entry forPosition = new() { Keyboard = Keyboard.Numeric, Placeholder = "CursorPos" };
forPosition.TextChanged += (sender, args) =>
{
if (!int.TryParse(args.NewTextValue, out int newPos))
{
return;
}
targetEntry.CursorPosition = newPos;
};
Entry forSelectionLen = new() { Keyboard = Keyboard.Numeric, Placeholder = "SelectionLen" };
forSelectionLen.TextChanged += (sender, args) =>
{
if (!int.TryParse(args.NewTextValue, out int newSelectionLen))
{
return;
}
targetEntry.SelectionLength = newSelectionLen;
};
layout.Add(targetEntry);
layout.Add(forPosition);
layout.SetColumn(forPosition, 1);
layout.Add(forSelectionLen);
layout.SetColumn(forSelectionLen, 2);
return(layout);
}
void AddTextResizeDemo(Microsoft.Maui.ILayout layout)
{
var resizeTestButton = new Button {
Text = "Resize Test"
};
var resizeTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.LightBlue, HorizontalOptions = LayoutOptions.Start
};
var explicitWidthTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.LightGreen, WidthRequest = 200
};
var widthAndHeightTestLabel = new Label {
Text = "Short Text", BackgroundColor = Colors.MediumSeaGreen, WidthRequest = 150, HeightRequest = 40
};
resizeTestButton.Clicked += (sender, args) =>
{
if (resizeTestLabel.Text == "Short Text")
{
resizeTestLabel.Text = LoremIpsum;
explicitWidthTestLabel.Text = LoremIpsum;
widthAndHeightTestLabel.Text = LoremIpsum;
}
else
{
resizeTestLabel.Text = "Short Text";
explicitWidthTestLabel.Text = "Short Text";
widthAndHeightTestLabel.Text = "Short Text";
}
};
layout.Add(resizeTestButton);
layout.Add(resizeTestLabel);
layout.Add(widthAndHeightTestLabel);
layout.Add(explicitWidthTestLabel);
}
void SetupVisibilityTest()
{
var layout = new VerticalStackLayout()
{
BackgroundColor = Colors.BurlyWood
};
var button1 = new Button {
Text = "Controls", Margin = new Thickness(0, 40)
};
var button2 = new Button {
Text = "MAUI"
};
var controlsLabel = new Label {
Text = "Controls Label"
};
controlsLabel.IsVisible = true;
var alwaysVisible = new Label {
Text = "Always visible"
};
var mauiLabel = new VisibilityLabel()
{
Text = "Core Label"
};
button1.Clicked += (sender, args) =>
{
controlsLabel.IsVisible = !controlsLabel.IsVisible;
};
button2.Clicked += (sender, args) =>
{
switch ((mauiLabel as IFrameworkElement).Visibility)
{
case Visibility.Visible:
mauiLabel.SetVisibility(Visibility.Hidden);
break;
case Visibility.Hidden:
mauiLabel.SetVisibility(Visibility.Collapsed);
break;
case Visibility.Collapsed:
mauiLabel.SetVisibility(Visibility.Visible);
break;
}
};
layout.Add(button1);
layout.Add(button2);
layout.Add(controlsLabel);
layout.Add(mauiLabel);
layout.Add(alwaysVisible);
Content = layout;
}
}
}