ux: layout of floating panels (commands and notifications) (#659)

Signed-off-by: leo <longshuang@msn.cn>
This commit is contained in:
leo 2024-11-07 11:07:47 +08:00
parent 88cec05e67
commit 45f4a5a4b1
No known key found for this signature in database
2 changed files with 90 additions and 92 deletions

View file

@ -5,6 +5,7 @@
xmlns:m="using:SourceGit.Models" xmlns:m="using:SourceGit.Models"
xmlns:v="using:SourceGit.Views" xmlns:v="using:SourceGit.Views"
xmlns:vm="using:SourceGit.ViewModels" xmlns:vm="using:SourceGit.ViewModels"
xmlns:c="using:SourceGit.Converters"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450" mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="SourceGit.Views.LauncherPage" x:Class="SourceGit.Views.LauncherPage"
x:DataType="vm:LauncherPage"> x:DataType="vm:LauncherPage">
@ -39,102 +40,99 @@
</ContentControl> </ContentControl>
</Border> </Border>
<!-- Popup --> <!-- Floating -->
<Grid Grid.Row="1" IsVisible="{Binding Popup, Converter={x:Static ObjectConverters.IsNotNull}}" ClipToBounds="True"> <Grid Grid.Row="1" ClipToBounds="True">
<Border Background="Transparent" PointerPressed="OnPopupCancelByClickMask"/> <Grid.IsVisible>
<MultiBinding Converter="{x:Static BoolConverters.Or}">
<Binding Path="Popup" Converter="{x:Static ObjectConverters.IsNotNull}"/>
<Binding Path="Notifications.Count" Converter="{x:Static c:IntConverters.IsGreaterThanZero}"/>
</MultiBinding>
</Grid.IsVisible>
<Border Width="500" HorizontalAlignment="Center" VerticalAlignment="Top" Effect="drop-shadow(0 0 8 #8F000000)" CornerRadius="0,0,8,8" ClipToBounds="True"> <Border Background="Transparent"
<ContentControl Content="{Binding Popup}" Background="{DynamicResource Brush.Popup}"> PointerPressed="OnMaskClicked"
<ContentControl.DataTemplates> IsVisible="{Binding Popup, Converter={x:Static ObjectConverters.IsNotNull}}"/>
<DataTemplate DataType="vm:Popup">
<StackPanel Orientation="Vertical" Background="{DynamicResource Brush.Popup}">
<!-- Popup Widget -->
<ContentPresenter Margin="8,16,8,8"
Content="{Binding View}"
IsHitTestVisible="{Binding InProgress, Converter={x:Static BoolConverters.Not}}"/>
<!-- Options --> <Grid RowDefinitions="Auto,*" Width="512" HorizontalAlignment="Center">
<StackPanel Margin="8,4,8,8" <!-- Popup -->
Height="32" <Border Grid.Row="0"
Orientation="Horizontal" Margin="6,0"
HorizontalAlignment="Right" Effect="drop-shadow(0 0 8 #8F000000)"
IsVisible="{Binding InProgress, Converter={x:Static BoolConverters.Not}}"> CornerRadius="0,0,8,8"
<Button Classes="flat primary" ClipToBounds="True"
Width="80" Height="28" IsVisible="{Binding Popup, Converter={x:Static ObjectConverters.IsNotNull}}">
Padding="0" <ContentControl Content="{Binding Popup}" Background="{DynamicResource Brush.Popup}">
HorizontalContentAlignment="Center" <ContentControl.DataTemplates>
VerticalContentAlignment="Center" <DataTemplate DataType="vm:Popup">
Content="{DynamicResource Text.Sure}" <StackPanel Orientation="Vertical" Background="{DynamicResource Brush.Popup}">
Click="OnPopupSure" <!-- Popup Widget -->
HotKey="Enter"/> <ContentPresenter Margin="8,16,8,8"
<Button Classes="flat" Content="{Binding View}"
Width="80" Height="28" IsHitTestVisible="{Binding InProgress, Converter={x:Static BoolConverters.Not}}"/>
Margin="8,0,0,0"
Padding="0" <!-- Options -->
HorizontalContentAlignment="Center" <StackPanel Margin="8,4,8,8"
VerticalContentAlignment="Center" Height="32"
Content="{DynamicResource Text.Cancel}" Orientation="Horizontal"
Click="OnPopupCancel"/> HorizontalAlignment="Right"
IsVisible="{Binding InProgress, Converter={x:Static BoolConverters.Not}}">
<Button Classes="flat primary"
Width="80" Height="28"
Padding="0"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="{DynamicResource Text.Sure}"
Click="OnPopupSure"
HotKey="Enter"/>
<Button Classes="flat"
Width="80" Height="28"
Margin="8,0,0,0"
Padding="0"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="{DynamicResource Text.Cancel}"
Click="OnPopupCancel"/>
</StackPanel>
<!-- Running -->
<v:PopupRunningStatus Margin="12,8"
Description="{Binding ProgressDescription}"
IsVisible="{Binding InProgress}"/>
</StackPanel> </StackPanel>
</DataTemplate>
</ContentControl.DataTemplates>
</ContentControl>
</Border>
<!-- Running --> <!-- Notifications -->
<v:PopupRunningStatus Margin="12,8" <ScrollViewer Grid.Row="1" Margin="0,6,0,0" VerticalAlignment="Top" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
Description="{Binding ProgressDescription}" <ItemsControl ItemsSource="{Binding Notifications}">
IsVisible="{Binding InProgress}"/> <ItemsControl.ItemTemplate>
</StackPanel> <DataTemplate DataType="m:Notification">
</DataTemplate> <Border Margin="6" HorizontalAlignment="Stretch" VerticalAlignment="Top" Effect="drop-shadow(0 0 12 #A0000000)">
</ContentControl.DataTemplates> <Border Padding="8" CornerRadius="6" Background="{DynamicResource Brush.Popup}">
</ContentControl> <Grid RowDefinitions="26,Auto">
</Border> <Grid Grid.Row="0" ColumnDefinitions="Auto,*,Auto" Margin="8,0">
</Grid> <Path Grid.Column="0" Width="14" Height="14" Data="{StaticResource Icons.Error}" Fill="Red" IsVisible="{Binding IsError}"/>
<Path Grid.Column="0" Width="14" Height="14" Data="{StaticResource Icons.Info}" Fill="Green" IsVisible="{Binding !IsError}"/>
<TextBlock Grid.Column="1" Margin="8,0,0,0" FontWeight="Bold" FontSize="14" Text="{DynamicResource Text.Launcher.Error}" IsVisible="{Binding IsError}"/>
<TextBlock Grid.Column="1" Margin="8,0,0,0" FontWeight="Bold" FontSize="14" Text="{DynamicResource Text.Launcher.Info}" IsVisible="{Binding !IsError}"/>
<Button Grid.Column="2" Classes="icon_button" Width="16" Height="16" Click="OnDismissNotification">
<Path Width="10" Height="10" Data="{StaticResource Icons.Window.Close}"/>
</Button>
</Grid>
<!-- Notification --> <ScrollViewer Grid.Row="1" Margin="8" MaxHeight="100" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
<Grid Grid.Row="1" Width="480" HorizontalAlignment="Right" VerticalAlignment="Top"> <SelectableTextBlock TextWrapping="Wrap" Text="{Binding Message}"/>
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto"> </ScrollViewer>
<ItemsControl ItemsSource="{Binding Notifications}"> </Grid>
<ItemsControl.ItemTemplate> </Border>
<DataTemplate DataType="m:Notification">
<Border Margin="10,6" HorizontalAlignment="Stretch" VerticalAlignment="Top" Effect="drop-shadow(0 0 12 #A0000000)">
<Border Padding="8" CornerRadius="6" Background="{DynamicResource Brush.Popup}">
<Grid RowDefinitions="26,Auto,32">
<StackPanel Grid.Row="0" Margin="8,0,0,0" Orientation="Horizontal" IsVisible="{Binding IsError}">
<Path Width="14" Height="14" Data="{StaticResource Icons.Error}" Fill="Red"/>
<TextBlock Margin="8,0,0,0" FontWeight="Bold" FontSize="14" Text="{DynamicResource Text.Launcher.Error}"/>
</StackPanel>
<StackPanel Grid.Row="0" Margin="8,0,0,0" Orientation="Horizontal" IsVisible="{Binding !IsError}">
<Path Width="14" Height="14" Data="{StaticResource Icons.Info}" Fill="Green"/>
<TextBlock Margin="8,0,0,0" FontWeight="Bold" FontSize="14" Text="{DynamicResource Text.Launcher.Info}"/>
</StackPanel>
<TextBox Grid.Row="1"
Classes="no_background no_border"
IsReadOnly="True"
TextWrapping="Wrap"
ScrollViewer.VerticalScrollBarVisibility="Auto"
MaxHeight="100"
Margin="8" Padding="0"
VerticalContentAlignment="Top"
Text="{Binding Message}"/>
<StackPanel Grid.Row="2" Margin="0,4,0,0" Orientation="Horizontal" HorizontalAlignment="Right">
<Button Classes="flat"
Margin="0,0,8,0"
Command="{Binding CopyMessage}"
Content="{DynamicResource Text.CopyMessage}"
IsVisible="{Binding IsError}"/>
<Button Classes="flat primary"
Margin="0,0"
Content="{DynamicResource Text.Close}"
Click="OnDismissNotification"/>
</StackPanel>
</Grid>
</Border> </Border>
</Border> </DataTemplate>
</DataTemplate> </ItemsControl.ItemTemplate>
</ItemsControl.ItemTemplate> </ItemsControl>
</ItemsControl> </ScrollViewer>
</ScrollViewer> </Grid>
</Grid> </Grid>
</Grid> </Grid>
</UserControl> </UserControl>

View file

@ -27,7 +27,7 @@ namespace SourceGit.Views
e.Handled = true; e.Handled = true;
} }
private void OnPopupCancelByClickMask(object sender, PointerPressedEventArgs e) private void OnMaskClicked(object sender, PointerPressedEventArgs e)
{ {
OnPopupCancel(sender, e); OnPopupCancel(sender, e);
} }