notazof/yavsc
1
0
Fork 0
Code Issues Pull requests Projects 1 Releases 3 Packages Wiki Activity Actions

refactor(postit): rewrite MainPage layout in Grid

Browse source 
- ContentPage now stretches to fill the window
- root StackPanel replaced by a 3-row Grid (Auto, *, Auto)
  so the post list absorbs the middle band and the detail
  panel sits below
- detail panel inner StackPanel replaced by a Grid (Auto,
  Auto, Auto, *, Auto) so the AvaloniaEdit TextEditor fills
  all remaining width and height; MinHeight=320 keeps a
  sane floor on tiny windows
This commit is contained in:
Paul Schneider 2026-06-28 01:47:12 +01:00
commit bd3dba0089
1 changed files with 71 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

115
src/PostIt/PostIt/Views/MainPage.axaml
View file

@ -6,55 +6,82 @@
xmlns:models="using:PostIt.Models" xmlns:models="using:PostIt.Models"
xmlns:views="using:PostIt.Views" xmlns:views="using:PostIt.Views"
xmlns:AvaloniaEdit="clr-namespace:AvaloniaEdit;assembly=AvaloniaEdit" xmlns:AvaloniaEdit="clr-namespace:AvaloniaEdit;assembly=AvaloniaEdit"
mc:Ignorable="d" mc:Ignorable="d"
x:Class="PostIt.Views.MainPage" x:Class="PostIt.Views.MainPage"
x:DataType="vm:MainPageViewModel" x:DataType="vm:MainPageViewModel"
HorizontalAlignment="Center" HorizontalAlignment="Stretch"
VerticalAlignment="Center" > VerticalAlignment="Stretch">
<Design.DataContext> <Design.DataContext>
<vm:MainPageViewModel /> <vm:MainPageViewModel />
</Design.DataContext> </Design.DataContext>
<StackPanel Margin="12" Spacing="12" HorizontalAlignment="Center" > <Grid Margin="12" RowSpacing="12"
<TextBlock Text="PostIt Blog API Interface" FontSize="20" FontWeight="Bold" /> HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal" Spacing="8" > <StackPanel Grid.Row="0" Spacing="12"
<Button Command="{Binding LoadPosts}" Content="Load posts" /> HorizontalAlignment="Stretch"
<Button Command="{Binding Search}" Content="Filter" /> VerticalAlignment="Top">
<Button Command="{Binding New}" Content="New post" /> <TextBlock Text="PostIt Blog API Interface" FontSize="20" FontWeight="Bold" />
<Button Command="{Binding Save}" Content="Save" />
<Button Command="{Binding Delete}" Content="Delete" /> <StackPanel Orientation="Horizontal" Spacing="8">
<Button Command="{Binding LoadPosts}" Content="Load posts" />
<Button Command="{Binding Search}" Content="Filter" />
<Button Command="{Binding New}" Content="New post" />
<Button Command="{Binding Save}" Content="Save" />
<Button Command="{Binding Delete}" Content="Delete" />
</StackPanel>
</StackPanel> </StackPanel>
<Border BorderBrush="Gray" BorderThickness="1" Padding="8">
<ListBox ItemsSource="{Binding FilteredPosts}" SelectedItem="{Binding SelectedPost, Mode=TwoWay}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate x:DataType="models:BlogPost">
<StackPanel Spacing="4">
<TextBlock Text="{Binding Title}" FontWeight="SemiBold" />
<TextBlock Text="{Binding DateModified, StringFormat='Updated: {0:yyyy-MM-dd HH:mm}'}" FontSize="10" Foreground="Gray" />
<TextBlock Text="{Binding AuthorId}" FontSize="10" Foreground="DarkSlateGray" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Border>
<Border BorderBrush="Gray" BorderThickness="1" Padding="8"> <Border Grid.Row="1" BorderBrush="Gray" BorderThickness="1" Padding="8">
<StackPanel Spacing="10"> <ListBox ItemsSource="{Binding FilteredPosts}" SelectedItem="{Binding SelectedPost, Mode=TwoWay}"
<TextBlock Text="Post detail" FontWeight="SemiBold" /> HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBox Text="{Binding SelectedPost.Title, Mode=TwoWay}" PlaceholderText="Title" /> <ListBox.ItemTemplate>
<TextBox Text="{Binding SelectedPost.AuthorId, Mode=TwoWay}" PlaceholderText="Author id" /> <DataTemplate x:DataType="models:BlogPost">
<AvaloniaEdit:TextEditor <StackPanel Spacing="4">
views:TextEditorBinding.Text="{Binding SelectedPost.Article, Mode=TwoWay}" <TextBlock Text="{Binding Title}" FontWeight="SemiBold" />
ShowLineNumbers="True" <TextBlock Text="{Binding DateModified, StringFormat='Updated: {0:yyyy-MM-dd HH:mm}'}" FontSize="10" Foreground="Gray" />
FontFamily="Cascadia Code, Consolas, Menlo, Monospace" <TextBlock Text="{Binding AuthorId}" FontSize="10" Foreground="DarkSlateGray" />
Height="320" </StackPanel>
VerticalScrollBarVisibility="Auto" </DataTemplate>
HorizontalScrollBarVisibility="Auto" /> </ListBox.ItemTemplate>
<TextBlock Text="{Binding StatusMessage}" Foreground="Gray" /> </ListBox>
</StackPanel> </Border>
</Border>
<Border Grid.Row="2" BorderBrush="Gray" BorderThickness="1" Padding="8">
</StackPanel> <Grid RowSpacing="10"
</ContentPage> HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Text="Post detail" FontWeight="SemiBold" />
<TextBox Grid.Row="1" Text="{Binding SelectedPost.Title, Mode=TwoWay}" PlaceholderText="Title" />
<TextBox Grid.Row="2" Text="{Binding SelectedPost.AuthorId, Mode=TwoWay}" PlaceholderText="Author id" />
<AvaloniaEdit:TextEditor Grid.Row="3"
views:TextEditorBinding.Text="{Binding SelectedPost.Article, Mode=TwoWay}"
ShowLineNumbers="True"
FontFamily="Cascadia Code, Consolas, Menlo, Monospace"
MinHeight="320"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto" />
<TextBlock Grid.Row="4" Text="{Binding StatusMessage}" Foreground="Gray" />
</Grid>
</Border>
</Grid>
</ContentPage>