open-maui/OpenMaui
2
0
Fork 0
Code Issues Releases 1

General renderers/views

Browse Source
This commit is contained in:
David H. Friedel Jr.
2026-01-16 05:42:21 +00:00
parent bf2f380f56
commit 331d6839d9
3 changed files with 33 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
Hosting/LinuxProgramHost.cs
View File

@@ -4,6 +4,7 @@
using Microsoft.Extensions.DependencyInjection; using Microsoft.Extensions.DependencyInjection;
using Microsoft.Maui.Controls; using Microsoft.Maui.Controls;
using Microsoft.Maui.Controls.Hosting; using Microsoft.Maui.Controls.Hosting;
using Microsoft.Maui.Graphics;
using Microsoft.Maui.Hosting; using Microsoft.Maui.Hosting;
using Microsoft.Maui.Platform.Linux.Services; using Microsoft.Maui.Platform.Linux.Services;
using SkiaSharp; using SkiaSharp;
@@ -200,24 +201,24 @@ public static class LinuxProgramHost
{ {
Text = "OpenMaui Linux Control Demo", Text = "OpenMaui Linux Control Demo",
FontSize = 28, FontSize = 28,
TextColor = new SKColor(0x1A, 0x23, 0x7E), TextColor = Color.FromRgb(0x1A, 0x23, 0x7E),
IsBold = true FontAttributes = FontAttributes.Bold
}); });
root.AddChild(new SkiaLabel root.AddChild(new SkiaLabel
{ {
Text = "All controls rendered using SkiaSharp on X11", Text = "All controls rendered using SkiaSharp on X11",
FontSize = 14, FontSize = 14,
TextColor = SKColors.Gray TextColor = Colors.Gray
}); });
// ========== LABELS SECTION ========== // ========== LABELS SECTION ==========
root.AddChild(CreateSeparator()); root.AddChild(CreateSeparator());
root.AddChild(CreateSectionHeader("Labels")); root.AddChild(CreateSectionHeader("Labels"));
var labelSection = new SkiaStackLayout { Orientation = StackOrientation.Vertical, Spacing = 5 }; var labelSection = new SkiaStackLayout { Orientation = StackOrientation.Vertical, Spacing = 5 };
labelSection.AddChild(new SkiaLabel { Text = "Normal Label", FontSize = 16, TextColor = SKColors.Black }); labelSection.AddChild(new SkiaLabel { Text = "Normal Label", FontSize = 16, TextColor = Colors.Black });
labelSection.AddChild(new SkiaLabel { Text = "Bold Label", FontSize = 16, TextColor = SKColors.Black, IsBold = true }); labelSection.AddChild(new SkiaLabel { Text = "Bold Label", FontSize = 16, TextColor = Colors.Black, FontAttributes = FontAttributes.Bold });
labelSection.AddChild(new SkiaLabel { Text = "Italic Label", FontSize = 16, TextColor = SKColors.Gray, IsItalic = true }); labelSection.AddChild(new SkiaLabel { Text = "Italic Label", FontSize = 16, TextColor = Colors.Gray, FontAttributes = FontAttributes.Italic });
labelSection.AddChild(new SkiaLabel { Text = "Colored Label (Pink)", FontSize = 16, TextColor = new SKColor(0xE9, 0x1E, 0x63) }); labelSection.AddChild(new SkiaLabel { Text = "Colored Label (Pink)", FontSize = 16, TextColor = Color.FromRgb(0xE9, 0x1E, 0x63) });
root.AddChild(labelSection); root.AddChild(labelSection);
// ========== BUTTONS SECTION ========== // ========== BUTTONS SECTION ==========
@@ -254,7 +255,7 @@ public static class LinuxProgramHost
root.AddChild(CreateSeparator()); root.AddChild(CreateSeparator());
root.AddChild(CreateSectionHeader("SearchBar")); root.AddChild(CreateSectionHeader("SearchBar"));
var searchBar = new SkiaSearchBar { Placeholder = "Search for items..." }; var searchBar = new SkiaSearchBar { Placeholder = "Search for items..." };
var searchResultLabel = new SkiaLabel { Text = "", FontSize = 12, TextColor = SKColors.Gray }; var searchResultLabel = new SkiaLabel { Text = "", FontSize = 12, TextColor = Colors.Gray };
searchBar.TextChanged += (s, e) => searchResultLabel.Text = $"Searching: {e.NewTextValue}"; searchBar.TextChanged += (s, e) => searchResultLabel.Text = $"Searching: {e.NewTextValue}";
searchBar.SearchButtonPressed += (s, e) => searchResultLabel.Text = $"Search submitted: {searchBar.Text}"; searchBar.SearchButtonPressed += (s, e) => searchResultLabel.Text = $"Search submitted: {searchBar.Text}";
root.AddChild(searchBar); root.AddChild(searchBar);
@@ -329,7 +330,7 @@ public static class LinuxProgramHost
root.AddChild(CreateSectionHeader("ProgressBar")); root.AddChild(CreateSectionHeader("ProgressBar"));
var progress = new SkiaProgressBar { Progress = 0.7f }; var progress = new SkiaProgressBar { Progress = 0.7f };
root.AddChild(progress); root.AddChild(progress);
root.AddChild(new SkiaLabel { Text = "70% Complete", FontSize = 12, TextColor = SKColors.Gray }); root.AddChild(new SkiaLabel { Text = "70% Complete", FontSize = 12, TextColor = Colors.Gray });
// ========== ACTIVITYINDICATOR SECTION ========== // ========== ACTIVITYINDICATOR SECTION ==========
root.AddChild(CreateSeparator()); root.AddChild(CreateSeparator());
@@ -337,7 +338,7 @@ public static class LinuxProgramHost
var activitySection = new SkiaStackLayout { Orientation = StackOrientation.Horizontal, Spacing = 10 }; var activitySection = new SkiaStackLayout { Orientation = StackOrientation.Horizontal, Spacing = 10 };
var activity = new SkiaActivityIndicator { IsRunning = true }; var activity = new SkiaActivityIndicator { IsRunning = true };
activitySection.AddChild(activity); activitySection.AddChild(activity);
activitySection.AddChild(new SkiaLabel { Text = "Loading...", FontSize = 14, TextColor = SKColors.Gray }); activitySection.AddChild(new SkiaLabel { Text = "Loading...", FontSize = 14, TextColor = Colors.Gray });
root.AddChild(activitySection); root.AddChild(activitySection);
// ========== PICKER SECTION ========== // ========== PICKER SECTION ==========
@@ -345,7 +346,7 @@ public static class LinuxProgramHost
root.AddChild(CreateSectionHeader("Picker (Dropdown)")); root.AddChild(CreateSectionHeader("Picker (Dropdown)"));
var picker = new SkiaPicker { Title = "Select an item" }; var picker = new SkiaPicker { Title = "Select an item" };
picker.SetItems(new[] { "Apple", "Banana", "Cherry", "Date", "Elderberry", "Fig", "Grape" }); picker.SetItems(new[] { "Apple", "Banana", "Cherry", "Date", "Elderberry", "Fig", "Grape" });
var pickerLabel = new SkiaLabel { Text = "Selected: (none)", FontSize = 12, TextColor = SKColors.Gray }; var pickerLabel = new SkiaLabel { Text = "Selected: (none)", FontSize = 12, TextColor = Colors.Gray };
picker.SelectedIndexChanged += (s, e) => pickerLabel.Text = $"Selected: {picker.SelectedItem}"; picker.SelectedIndexChanged += (s, e) => pickerLabel.Text = $"Selected: {picker.SelectedItem}";
root.AddChild(picker); root.AddChild(picker);
root.AddChild(pickerLabel); root.AddChild(pickerLabel);
@@ -354,7 +355,7 @@ public static class LinuxProgramHost
root.AddChild(CreateSeparator()); root.AddChild(CreateSeparator());
root.AddChild(CreateSectionHeader("DatePicker")); root.AddChild(CreateSectionHeader("DatePicker"));
var datePicker = new SkiaDatePicker { Date = DateTime.Today }; var datePicker = new SkiaDatePicker { Date = DateTime.Today };
var dateLabel = new SkiaLabel { Text = $"Date: {DateTime.Today:d}", FontSize = 12, TextColor = SKColors.Gray }; var dateLabel = new SkiaLabel { Text = $"Date: {DateTime.Today:d}", FontSize = 12, TextColor = Colors.Gray };
datePicker.DateSelected += (s, e) => dateLabel.Text = $"Date: {datePicker.Date:d}"; datePicker.DateSelected += (s, e) => dateLabel.Text = $"Date: {datePicker.Date:d}";
root.AddChild(datePicker); root.AddChild(datePicker);
root.AddChild(dateLabel); root.AddChild(dateLabel);
@@ -363,7 +364,7 @@ public static class LinuxProgramHost
root.AddChild(CreateSeparator()); root.AddChild(CreateSeparator());
root.AddChild(CreateSectionHeader("TimePicker")); root.AddChild(CreateSectionHeader("TimePicker"));
var timePicker = new SkiaTimePicker(); var timePicker = new SkiaTimePicker();
var timeLabel = new SkiaLabel { Text = $"Time: {DateTime.Now:t}", FontSize = 12, TextColor = SKColors.Gray }; var timeLabel = new SkiaLabel { Text = $"Time: {DateTime.Now:t}", FontSize = 12, TextColor = Colors.Gray };
timePicker.TimeSelected += (s, e) => timeLabel.Text = $"Time: {DateTime.Today.Add(timePicker.Time):t}"; timePicker.TimeSelected += (s, e) => timeLabel.Text = $"Time: {DateTime.Today.Add(timePicker.Time):t}";
root.AddChild(timePicker); root.AddChild(timePicker);
root.AddChild(timeLabel); root.AddChild(timeLabel);
@@ -375,11 +376,11 @@ public static class LinuxProgramHost
{ {
CornerRadius = 8, CornerRadius = 8,
StrokeThickness = 2, StrokeThickness = 2,
Stroke = new SKColor(0x21, 0x96, 0xF3), Stroke = Color.FromRgb(0x21, 0x96, 0xF3),
BackgroundColor = new SKColor(0xE3, 0xF2, 0xFD) BackgroundColor = Color.FromRgb(0xE3, 0xF2, 0xFD).ToSKColor()
}; };
border.SetPadding(15); border.SetPadding(15);
border.AddChild(new SkiaLabel { Text = "Content inside a styled Border", FontSize = 14, TextColor = new SKColor(0x1A, 0x23, 0x7E) }); border.AddChild(new SkiaLabel { Text = "Content inside a styled Border", FontSize = 14, TextColor = Color.FromRgb(0x1A, 0x23, 0x7E) });
root.AddChild(border); root.AddChild(border);
// ========== FRAME SECTION ========== // ========== FRAME SECTION ==========
@@ -400,7 +401,7 @@ public static class LinuxProgramHost
Footer = "End of list" Footer = "End of list"
}; };
collectionView.ItemsSource =(new object[] { "Apple", "Banana", "Cherry", "Date", "Elderberry", "Fig", "Grape", "Honeydew" }); collectionView.ItemsSource =(new object[] { "Apple", "Banana", "Cherry", "Date", "Elderberry", "Fig", "Grape", "Honeydew" });
var collectionLabel = new SkiaLabel { Text = "Selected: (none)", FontSize = 12, TextColor = SKColors.Gray }; var collectionLabel = new SkiaLabel { Text = "Selected: (none)", FontSize = 12, TextColor = Colors.Gray };
collectionView.SelectionChanged += (s, e) => collectionView.SelectionChanged += (s, e) =>
{ {
var selected = e.CurrentSelection.FirstOrDefault(); var selected = e.CurrentSelection.FirstOrDefault();
@@ -418,18 +419,15 @@ public static class LinuxProgramHost
var imgBtn = new SkiaImageButton var imgBtn = new SkiaImageButton
{ {
CornerRadius = 8, CornerRadius = 8,
StrokeColor = new SKColor(0x21, 0x96, 0xF3), StrokeColor = Color.FromRgb(0x21, 0x96, 0xF3),
StrokeThickness = 1, StrokeThickness = 1,
BackgroundColor = new SKColor(0xE3, 0xF2, 0xFD), ImageBackgroundColor = Color.FromRgb(0xE3, 0xF2, 0xFD),
PaddingLeft = 10, Padding = new Thickness(10)
PaddingRight = 10,
PaddingTop = 10,
PaddingBottom = 10
}; };
// Generate a simple star icon bitmap // Generate a simple star icon bitmap
var iconBitmap = CreateStarIcon(32, new SKColor(0x21, 0x96, 0xF3)); var iconBitmap = CreateStarIcon(32, new SKColor(0x21, 0x96, 0xF3));
imgBtn.Bitmap = iconBitmap; imgBtn.Bitmap = iconBitmap;
var imgBtnLabel = new SkiaLabel { Text = "Click the star!", FontSize = 12, TextColor = SKColors.Gray }; var imgBtnLabel = new SkiaLabel { Text = "Click the star!", FontSize = 12, TextColor = Colors.Gray };
imgBtn.Clicked += (s, e) => imgBtnLabel.Text = "Star clicked!"; imgBtn.Clicked += (s, e) => imgBtnLabel.Text = "Star clicked!";
imageButtonSection.AddChild(imgBtn); imageButtonSection.AddChild(imgBtn);
imageButtonSection.AddChild(imgBtnLabel); imageButtonSection.AddChild(imgBtnLabel);
@@ -445,7 +443,7 @@ public static class LinuxProgramHost
var sampleBitmap = CreateSampleImage(80, 60); var sampleBitmap = CreateSampleImage(80, 60);
img.Bitmap = sampleBitmap; img.Bitmap = sampleBitmap;
imageSection.AddChild(img); imageSection.AddChild(img);
imageSection.AddChild(new SkiaLabel { Text = "Sample generated image", FontSize = 12, TextColor = SKColors.Gray }); imageSection.AddChild(new SkiaLabel { Text = "Sample generated image", FontSize = 12, TextColor = Colors.Gray });
root.AddChild(imageSection); root.AddChild(imageSection);
// ========== FOOTER ========== // ========== FOOTER ==========
@@ -454,14 +452,14 @@ public static class LinuxProgramHost
{ {
Text = "All 25+ controls are interactive - try them all!", Text = "All 25+ controls are interactive - try them all!",
FontSize = 16, FontSize = 16,
TextColor = new SKColor(0x4C, 0xAF, 0x50), TextColor = Color.FromRgb(0x4C, 0xAF, 0x50),
IsBold = true FontAttributes = FontAttributes.Bold
}); });
root.AddChild(new SkiaLabel root.AddChild(new SkiaLabel
{ {
Text = "Scroll down to see more controls", Text = "Scroll down to see more controls",
FontSize = 12, FontSize = 12,
TextColor = SKColors.Gray TextColor = Colors.Gray
}); });
scroll.Content = root; scroll.Content = root;
@@ -474,8 +472,8 @@ public static class LinuxProgramHost
{ {
Text = text, Text = text,
FontSize = 18, FontSize = 18,
TextColor = new SKColor(0x37, 0x47, 0x4F), TextColor = Color.FromRgb(0x37, 0x47, 0x4F),
IsBold = true FontAttributes = FontAttributes.Bold
}; };
} }

2
Hosting/LinuxViewRenderer.cs
View File

@@ -574,7 +574,7 @@ public class LinuxViewRenderer
return new SkiaLabel return new SkiaLabel
{ {
Text = $"[{view.GetType().Name}]", Text = $"[{view.GetType().Name}]",
TextColor = SKColors.Gray, TextColor = Colors.Gray,
FontSize = 12 FontSize = 12
}; };
} }

8
Views/SkiaTemplatedView.cs
View File

@@ -183,7 +183,7 @@ public abstract class SkiaTemplatedView : SkiaView
Microsoft.Maui.Controls.Border border => CreateSkiaBorder(border), Microsoft.Maui.Controls.Border border => CreateSkiaBorder(border),
Microsoft.Maui.Controls.Label label => CreateSkiaLabel(label), Microsoft.Maui.Controls.Label label => CreateSkiaLabel(label),
Microsoft.Maui.Controls.ContentPresenter cp => new SkiaContentPresenter(), Microsoft.Maui.Controls.ContentPresenter cp => new SkiaContentPresenter(),
_ => new SkiaLabel { Text = $"[{element.GetType().Name}]", TextColor = SKColors.Gray } _ => new SkiaLabel { Text = $"[{element.GetType().Name}]", TextColor = Colors.Gray }
}; };
} }
@@ -269,7 +269,7 @@ public abstract class SkiaTemplatedView : SkiaView
if (border.Stroke is SolidColorBrush strokeBrush) if (border.Stroke is SolidColorBrush strokeBrush)
{ {
skiaBorder.Stroke = strokeBrush.Color.ToSKColor(); skiaBorder.Stroke = strokeBrush.Color;
} }
if (border.Background is SolidColorBrush bgBrush) if (border.Background is SolidColorBrush bgBrush)
@@ -292,12 +292,12 @@ public abstract class SkiaTemplatedView : SkiaView
var skiaLabel = new SkiaLabel var skiaLabel = new SkiaLabel
{ {
Text = label.Text ?? "", Text = label.Text ?? "",
FontSize = (float)label.FontSize FontSize = label.FontSize
}; };
if (label.TextColor != null) if (label.TextColor != null)
{ {
skiaLabel.TextColor = label.TextColor.ToSKColor(); skiaLabel.TextColor = label.TextColor;
} }
return skiaLabel; return skiaLabel;