From b45ad7546e185a158293d5c062e488558b784a0b Mon Sep 17 00:00:00 2001
From: Corvin <corvinszimion@googlemail.com>
Date: Fri, 4 Apr 2025 19:54:34 +0200
Subject: [PATCH 1/3] added FieldsLineUpDemo page to the demo app

---
 Material.Avalonia.Demo/MainView.axaml         |   4 +
 .../Material.Avalonia.Demo.csproj             |  20 +-
 .../Pages/FieldsLineUpDemo.axaml              | 216 ++++++++++++++++++
 .../Pages/FieldsLineUpDemo.axaml.cs           |  13 ++
 .../ViewModels/FieldsLineUpDemoViewModel.cs   |  40 ++++
 5 files changed, 283 insertions(+), 10 deletions(-)
 create mode 100644 Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
 create mode 100644 Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml.cs
 create mode 100644 Material.Avalonia.Demo/ViewModels/FieldsLineUpDemoViewModel.cs

diff --git a/Material.Avalonia.Demo/MainView.axaml b/Material.Avalonia.Demo/MainView.axaml
index 2ad84be3..5556074d 100644
--- a/Material.Avalonia.Demo/MainView.axaml
+++ b/Material.Avalonia.Demo/MainView.axaml
@@ -72,6 +72,7 @@
                 <ListBoxItem>Dialogs</ListBoxItem>
                 <ListBoxItem>Expanders</ListBoxItem>
                 <ListBoxItem>Fields</ListBoxItem>
+                <ListBoxItem>Fields line up</ListBoxItem>
                 <ListBoxItem>Lists</ListBoxItem>
                 <ListBoxItem>Material Icons</ListBoxItem>
                 <ListBoxItem>Progress indicators</ListBoxItem>
@@ -179,6 +180,9 @@
                 
                 <!-- Fields -->
                 <pages:FieldsDemo />
+
+                <!-- FieldsLline up -->
+                <pages:FieldsLineUpDemo />
                 
                 <!-- Lists -->
                 <pages:ListsDemo />
diff --git a/Material.Avalonia.Demo/Material.Avalonia.Demo.csproj b/Material.Avalonia.Demo/Material.Avalonia.Demo.csproj
index 4275fdcb..fc11370d 100644
--- a/Material.Avalonia.Demo/Material.Avalonia.Demo.csproj
+++ b/Material.Avalonia.Demo/Material.Avalonia.Demo.csproj
@@ -6,23 +6,23 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Avalonia.Controls.DataGrid"/>
-    <PackageReference Include="Avalonia.Diagnostics"/>
-    <PackageReference Include="Avalonia.Themes.Simple"/>
-    <PackageReference Include="Material.Icons.Avalonia"/>
-    <PackageReference Include="DialogHost.Avalonia"/>
-    <PackageReference Include="ShowMeTheXaml.Avalonia"/>
-    <PackageReference Include="ShowMeTheXaml.Avalonia.AvaloniaEdit"/>
-    <PackageReference Include="ShowMeTheXaml.Avalonia.Generator" PrivateAssets="all"/>
+    <PackageReference Include="Avalonia.Controls.DataGrid" />
+    <PackageReference Include="Avalonia.Diagnostics" />
+    <PackageReference Include="Avalonia.Themes.Simple" />
+    <PackageReference Include="Material.Icons.Avalonia" />
+    <PackageReference Include="DialogHost.Avalonia" />
+    <PackageReference Include="ShowMeTheXaml.Avalonia" />
+    <PackageReference Include="ShowMeTheXaml.Avalonia.AvaloniaEdit" />
+    <PackageReference Include="ShowMeTheXaml.Avalonia.Generator" PrivateAssets="all" />
   </ItemGroup>
   <ItemGroup>
-    <ProjectReference Include="..\Material.Avalonia\Material.Avalonia.csproj"/>
+    <ProjectReference Include="..\Material.Avalonia\Material.Avalonia.csproj" />
     <ProjectReference Include="..\Material.Avalonia.Dialogs\Material.Avalonia.Dialogs.csproj" />
     <ProjectReference Include="..\Material.Avalonia.DataGrid\Material.Avalonia.DataGrid.csproj" />
   </ItemGroup>
 
   <ItemGroup>
-    <AvaloniaResource Include="Assets\**"/>
+    <AvaloniaResource Include="Assets\**" />
   </ItemGroup>
 
   <ItemGroup>
diff --git a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
new file mode 100644
index 00000000..c8aefbad
--- /dev/null
+++ b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
@@ -0,0 +1,216 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:controls="clr-namespace:Material.Styles.Controls;assembly=Material.Styles"
+             xmlns:wpf="clr-namespace:Material.Styles.Assists;assembly=Material.Styles"
+             xmlns:showMeTheXaml="clr-namespace:ShowMeTheXaml;assembly=ShowMeTheXaml.Avalonia"
+             xmlns:viewModels="clr-namespace:Material.Avalonia.Demo.ViewModels"
+             x:DataType="viewModels:FieldsLineUpDemoViewModel"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             x:Class="Material.Avalonia.Demo.Pages.FieldsLineUpDemo" Padding="32">
+  <UserControl.DataContext>
+    <viewModels:FieldsLineUpDemoViewModel/>
+  </UserControl.DataContext>
+  <StackPanel>
+    <Grid RowDefinitions="auto, *">
+      <Grid.Styles>
+        <Style Selector="TextBox">
+          <Setter Property="Theme" Value="{StaticResource FilledTextBox}" />
+          <Setter Property="Margin" Value="2" />
+        </Style>
+      </Grid.Styles>
+      <controls:ColorZone Mode="PrimaryMid">
+          <TextBlock Classes="Headline6" Text="Options"/>
+      </controls:ColorZone>
+
+      <WrapPanel Grid.Row="1">
+        <StackPanel>
+          <TextBox wpf:TextFieldAssist.Label="wpf:TextFieldAssist.Label"
+                   Text="{Binding AssistLabel}"
+                   Margin="0 2" />
+          <TextBox wpf:TextFieldAssist.Label="Watermark"
+                   Text="{Binding Watermark}"
+                   Margin="0 2" />
+        </StackPanel>
+      </WrapPanel>
+      
+    </Grid>
+    <Grid x:Name="FieldsLineUpGrid" HorizontalAlignment="Center" VerticalAlignment="Center">
+      <Grid.Styles>
+        <!--TextBlocks-->
+        <Style Selector="TextBlock">
+          <Setter Property="HorizontalAlignment" Value="Center" />
+          <Setter Property="VerticalAlignment" Value="Center" />
+        </Style>
+        <!--TextBoxes-->
+        <Style Selector="TextBox">
+          <Setter Property="Text" Value="Text" />
+          <Setter Property="wpf:TextFieldAssist.Label"  Value="{Binding AssistLabel}" />
+          <Setter Property="Watermark"  Value="{Binding Watermark}" />
+        </Style>
+        <!--ComboBoxes-->
+        <Style Selector="ComboBox">
+          <Setter Property="ItemsSource" Value="{Binding ComboBoxItems}" />
+        </Style>
+      </Grid.Styles>
+      <Grid.RowDefinitions>
+       <RowDefinition Height="Auto" />
+       <RowDefinition Height="Auto" />
+       <RowDefinition Height="Auto" />
+       <RowDefinition Height="Auto" />
+       <RowDefinition Height="Auto" />
+     </Grid.RowDefinitions>
+     <Grid.ColumnDefinitions>
+       <ColumnDefinition Width="Auto" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+       <ColumnDefinition MinWidth="100" />
+     </Grid.ColumnDefinitions>
+    
+     <TextBlock Grid.Row="1"
+                Grid.Column="0"
+                Text="Default" />
+     <TextBlock Grid.Row="2"
+                Grid.Column="0"
+                Text="Floating" />
+     <TextBlock Grid.Row="3"
+                Grid.Column="0"
+                Text="Filled" />
+     <TextBlock Grid.Row="4"
+                Grid.Column="0"
+                Text="Outlined" />
+
+     <TextBlock Grid.Row="0"
+                Grid.Column="1"
+                Text="TextField" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="2"
+                Text="PasswordBox" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="3"
+                Text="ComboBox" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="4"
+                Text="DatePicker" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="5"
+                Text="TimePicker" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="6"
+                Text="NumericUpDown" />
+     <TextBlock Grid.Row="0"
+                Grid.Column="7"
+                Text="AutoSuggestBox " />
+
+     <TextBox Grid.Row="1" 
+              Grid.Column="1" 
+              wpf:TextFieldAssist.Label="{x:Null}"
+              />
+     <TextBox Grid.Row="2"
+              Grid.Column="1"
+              UseFloatingWatermark="True" />
+     <TextBox Grid.Row="3"
+              Grid.Column="1"
+              Theme="{StaticResource FilledTextBox}"
+              wpf:TextFieldAssist.Label="{Binding AssistLabel}" 
+              />
+     <TextBox Grid.Row="4"
+              Grid.Column="1"
+              Theme="{StaticResource OutlineTextBox}"
+              UseFloatingWatermark="True"
+              Classes="outline"
+              wpf:TextFieldAssist.Label="{Binding AssistLabel}" 
+              />
+
+     <TextBox Classes="revealPasswordButton"
+              Grid.Row="1"
+              Grid.Column="2"
+               />
+     <TextBox Classes="revealPasswordButton"
+              Grid.Row="2"
+              Grid.Column="2"
+              UseFloatingWatermark="True"/>
+     <TextBox Classes="revealPasswordButton"
+              Grid.Row="3"
+              Grid.Column="2"
+              Theme="{StaticResource FilledTextBox}" />
+     <TextBox Classes="revealPasswordButton"
+              Grid.Row="4"
+              Grid.Column="2"
+              Theme="{StaticResource OutlineTextBox}" />
+
+     <ComboBox Grid.Row="1"
+               Grid.Column="3" />
+     <ComboBox Grid.Row="2"
+               Grid.Column="3"
+               wpf:ComboBoxAssist.Label="{Binding AssistLabel}" />
+     <ComboBox Grid.Row="3"
+               Grid.Column="3"
+               wpf:ComboBoxAssist.Label="{Binding AssistLabel}"
+               Theme="{StaticResource MaterialFilledComboBox}" />
+     <ComboBox Grid.Row="4"
+               Grid.Column="3"
+               wpf:ComboBoxAssist.Label="{Binding AssistLabel}"
+               Theme="{StaticResource MaterialOutlineComboBox}" />
+
+     <DatePicker Grid.Row="1"
+                 Grid.Column="4" />
+     <DatePicker Grid.Row="2" 
+                 Grid.Column="4"
+                 wpf:TextFieldAssist.Label="{Binding AssistLabel}" />
+     <DatePicker Grid.Row="3"
+                 Grid.Column="4"
+                 wpf:TextFieldAssist.Label="{Binding AssistLabel}" />
+     <DatePicker Grid.Row="4"
+                 Grid.Column="4"
+                 wpf:TextFieldAssist.Label="{Binding AssistLabel}" />
+
+     <TimePicker Grid.Row="1"
+                 Grid.Column="5" />
+     <TimePicker Grid.Row="2"
+                 Grid.Column="5" />
+     <TimePicker Grid.Row="3"
+                 Grid.Column="5" />
+     <TimePicker Grid.Row="4"
+                 Grid.Column="5" />
+
+      <!--<NumericUpDown Watermark="Enter text"
+                         p1:TextFieldAssist.Hints="Here is the hint"
+                         p1:TextFieldAssist.Label="Cool label"
+                         xmlns:p1="clr-namespace:Material.Styles.Assists;assembly=Material.Styles" />-->
+
+      
+     <NumericUpDown Grid.Row="1"
+                    Grid.Column="6"
+                    wpf:TextFieldAssist.Label="{Binding AssistLabel}" />
+     <NumericUpDown Grid.Row="2"
+                    Grid.Column="6"
+                    wpf:TextFieldAssist.Label="{Binding AssistLabel}" />
+     <NumericUpDown Grid.Row="3"
+                    Grid.Column="6"
+                    wpf:TextFieldAssist.Label="{Binding AssistLabel}"
+                    Theme="{StaticResource FilledNumericUpDown}" />
+     <NumericUpDown Grid.Row="4"
+                    Grid.Column="6"
+                    wpf:TextFieldAssist.Label="{Binding AssistLabel}"
+                    Theme="{StaticResource OutlineNumericUpDown}" />
+
+     <!--<materialDesign:AutoSuggestBox Grid.Row="1" Grid.Column="7" />
+     <materialDesign:AutoSuggestBox Grid.Row="2"
+                                    Grid.Column="7"
+                                    Style="{StaticResource MaterialDesignFloatingHintAutoSuggestBox}" />
+     <materialDesign:AutoSuggestBox Grid.Row="3"
+                                    Grid.Column="7"
+                                    Style="{StaticResource MaterialDesignFilledAutoSuggestBox}" />
+     <materialDesign:AutoSuggestBox Grid.Row="4"
+                                    Grid.Column="7"
+                                    Style="{StaticResource MaterialDesignOutlinedAutoSuggestBox}" />-->
+
+    </Grid>
+  </StackPanel>
+</UserControl>
diff --git a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml.cs b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml.cs
new file mode 100644
index 00000000..e2322904
--- /dev/null
+++ b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml.cs
@@ -0,0 +1,13 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Controls.Primitives;
+using Avalonia.Markup.Xaml;
+using Material.Avalonia.Demo.ViewModels;
+
+namespace Material.Avalonia.Demo.Pages;
+
+public partial class FieldsLineUpDemo : UserControl {
+    public FieldsLineUpDemo() {
+        InitializeComponent();
+    }
+}
\ No newline at end of file
diff --git a/Material.Avalonia.Demo/ViewModels/FieldsLineUpDemoViewModel.cs b/Material.Avalonia.Demo/ViewModels/FieldsLineUpDemoViewModel.cs
new file mode 100644
index 00000000..8622177a
--- /dev/null
+++ b/Material.Avalonia.Demo/ViewModels/FieldsLineUpDemoViewModel.cs
@@ -0,0 +1,40 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace Material.Avalonia.Demo.ViewModels;
+internal class FieldsLineUpDemoViewModel : ViewModelBase {
+    private string? _assistLabel = "My assist label";
+    public string? AssistLabel {
+        get => _assistLabel;
+        set {
+            if (_assistLabel != value) {
+                _assistLabel = value;
+                OnPropertyChanged();
+            }
+        }
+    }
+
+    private string? _watermark = "My watermark";
+    public string? Watermark {
+        get => _watermark;
+        set {
+            if (_watermark != value) {
+                _watermark = value;
+                OnPropertyChanged();
+            }
+        }
+    }
+
+
+
+    public IList<string> ComboBoxItems { get; } = [
+        "Item 1",
+        "Item 2",
+        "Item 3",
+        "Item 4",
+        "Item 5"
+    ];
+}

From 7825f69e78f112e109303b131343097da34baf57 Mon Sep 17 00:00:00 2001
From: Corvin <corvinszimion@googlemail.com>
Date: Sat, 5 Apr 2025 22:06:28 +0200
Subject: [PATCH 2/3] removed AutoSuggstBox column from FieldsLineUpDemo

---
 .../Pages/FieldsLineUpDemo.axaml              | 22 +------------------
 1 file changed, 1 insertion(+), 21 deletions(-)

diff --git a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
index c8aefbad..9bc78b5b 100644
--- a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
+++ b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
@@ -69,7 +69,6 @@
        <ColumnDefinition MinWidth="100" />
        <ColumnDefinition MinWidth="100" />
        <ColumnDefinition MinWidth="100" />
-       <ColumnDefinition MinWidth="100" />
      </Grid.ColumnDefinitions>
     
      <TextBlock Grid.Row="1"
@@ -103,9 +102,6 @@
      <TextBlock Grid.Row="0"
                 Grid.Column="6"
                 Text="NumericUpDown" />
-     <TextBlock Grid.Row="0"
-                Grid.Column="7"
-                Text="AutoSuggestBox " />
 
      <TextBox Grid.Row="1" 
               Grid.Column="1" 
@@ -130,6 +126,7 @@
      <TextBox Classes="revealPasswordButton"
               Grid.Row="1"
               Grid.Column="2"
+              wpf:TextFieldAssist.Label="{x:Null}"
                />
      <TextBox Classes="revealPasswordButton"
               Grid.Row="2"
@@ -178,12 +175,6 @@
                  Grid.Column="5" />
      <TimePicker Grid.Row="4"
                  Grid.Column="5" />
-
-      <!--<NumericUpDown Watermark="Enter text"
-                         p1:TextFieldAssist.Hints="Here is the hint"
-                         p1:TextFieldAssist.Label="Cool label"
-                         xmlns:p1="clr-namespace:Material.Styles.Assists;assembly=Material.Styles" />-->
-
       
      <NumericUpDown Grid.Row="1"
                     Grid.Column="6"
@@ -200,17 +191,6 @@
                     wpf:TextFieldAssist.Label="{Binding AssistLabel}"
                     Theme="{StaticResource OutlineNumericUpDown}" />
 
-     <!--<materialDesign:AutoSuggestBox Grid.Row="1" Grid.Column="7" />
-     <materialDesign:AutoSuggestBox Grid.Row="2"
-                                    Grid.Column="7"
-                                    Style="{StaticResource MaterialDesignFloatingHintAutoSuggestBox}" />
-     <materialDesign:AutoSuggestBox Grid.Row="3"
-                                    Grid.Column="7"
-                                    Style="{StaticResource MaterialDesignFilledAutoSuggestBox}" />
-     <materialDesign:AutoSuggestBox Grid.Row="4"
-                                    Grid.Column="7"
-                                    Style="{StaticResource MaterialDesignOutlinedAutoSuggestBox}" />-->
-
     </Grid>
   </StackPanel>
 </UserControl>

From f75e12a9f9ec83c999b240fa53d91eacd011f6e4 Mon Sep 17 00:00:00 2001
From: Corvin <corvinszimion@googlemail.com>
Date: Sat, 5 Apr 2025 22:17:13 +0200
Subject: [PATCH 3/3] apply outline style to demo Outlined PasswordBox in demo

---
 Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
index 9bc78b5b..46b09b07 100644
--- a/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
+++ b/Material.Avalonia.Demo/Pages/FieldsLineUpDemo.axaml
@@ -113,14 +113,12 @@
      <TextBox Grid.Row="3"
               Grid.Column="1"
               Theme="{StaticResource FilledTextBox}"
-              wpf:TextFieldAssist.Label="{Binding AssistLabel}" 
               />
      <TextBox Grid.Row="4"
               Grid.Column="1"
               Theme="{StaticResource OutlineTextBox}"
               UseFloatingWatermark="True"
               Classes="outline"
-              wpf:TextFieldAssist.Label="{Binding AssistLabel}" 
               />
 
      <TextBox Classes="revealPasswordButton"
@@ -136,10 +134,11 @@
               Grid.Row="3"
               Grid.Column="2"
               Theme="{StaticResource FilledTextBox}" />
-     <TextBox Classes="revealPasswordButton"
+     <TextBox Classes="revealPasswordButton outline"
               Grid.Row="4"
               Grid.Column="2"
-              Theme="{StaticResource OutlineTextBox}" />
+              Theme="{StaticResource OutlineTextBox}"
+              UseFloatingWatermark="True" />
 
      <ComboBox Grid.Row="1"
                Grid.Column="3" />