wismna/modernkeepass
1
0
Fork 0
mirror of https://github.com/wismna/ModernKeePass.git synced 2025-10-03 15:40:18 -04:00
Code Issues Packages Projects Releases Wiki Activity

Big redesign (closer to Win10 UWP)

Browse Source 
Replaced breadcrumb with Up button
Search button now integrated in top menu
Hamburger menu make better use of visual states
Better visual states changes when size changes
This commit is contained in:
Geoffroy BONNEVILLE
2020-05-04 20:56:19 +02:00
parent b3c7683c12
commit 2f30389f6c
15 changed files with 378 additions and 296 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ModernKeePass/ResourceDictionaries/HamburgerButtonStyle.xaml
View File

@@ -13,14 +13,14 @@
<VisualState x:Name="PointerOver"> <VisualState x:Name="PointerOver">
<Storyboard> <Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid" <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Grid"
Storyboard.TargetProperty="Opacity"> Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="0.8" /> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ToggleButtonPointerOverBackgroundThemeBrush}" />
</ObjectAnimationUsingKeyFrames> </ObjectAnimationUsingKeyFrames>
</Storyboard> </Storyboard>
</VisualState> </VisualState>
</VisualStateGroup> </VisualStateGroup>
</VisualStateManager.VisualStateGroups> </VisualStateManager.VisualStateGroups>
<Grid x:Name="Grid" Background="{StaticResource MainColor}" Margin="0" Width="{StaticResource MenuSize}" Height="{StaticResource MenuSize}"> <Grid x:Name="Grid" Background="{StaticResource AppBarBackgroundThemeBrush}" Margin="0" Width="{StaticResource MenuWidth}" Height="{StaticResource MenuHeight}">
<Canvas x:Name="HamburgerMenu" HorizontalAlignment="Center" Height="17" UseLayoutRounding="False" VerticalAlignment="Center" Width="28"> <Canvas x:Name="HamburgerMenu" HorizontalAlignment="Center" Height="17" UseLayoutRounding="False" VerticalAlignment="Center" Width="28">
<Canvas x:Name="Layer1" Height="17" Canvas.Left="0" Width="28" Margin="0" RenderTransformOrigin="0.5,0.5"> <Canvas x:Name="Layer1" Height="17" Canvas.Left="0" Width="28" Margin="0" RenderTransformOrigin="0.5,0.5">
<Canvas.RenderTransform> <Canvas.RenderTransform>
@@ -52,7 +52,7 @@
<Setter Property="Margin" Value="0" /> <Setter Property="Margin" Value="0" />
</Style> </Style>
<Style x:Key="HeaderTextBoxStyle" TargetType="TextBox"> <Style x:Key="HeaderTextBoxStyle" TargetType="TextBox">
<Setter Property="FontSize" Value="40"/> <Setter Property="FontSize" Value="30"/>
<Setter Property="FontWeight" Value="Light"/> <Setter Property="FontWeight" Value="Light"/>
<Setter Property="BorderBrush" Value="Transparent" /> <Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="Background" Value="Transparent" /> <Setter Property="Background" Value="Transparent" />

2
ModernKeePass/ResourceDictionaries/NoBorderButtonStyle.xaml
View File

@@ -4,7 +4,7 @@
<!-- Default style for Windows.UI.Xaml.Controls.Button --> <!-- Default style for Windows.UI.Xaml.Controls.Button -->
<Style TargetType="Button" x:Key="NoBorderButtonStyle"> <Style TargetType="Button" x:Key="NoBorderButtonStyle">
<Setter Property="Background" Value="{ThemeResource ToggleButtonBackgroundThemeBrush}" /> <Setter Property="Background" Value="{ThemeResource ToggleButtonBackgroundThemeBrush}" />
<Setter Property="Foreground" Value="{ThemeResource TextColorDark}"/> <Setter Property="Foreground" Value="{ThemeResource ButtonPointerOverForegroundThemeBrush}"/>
<Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderThemeBrush}" /> <Setter Property="BorderBrush" Value="{ThemeResource ButtonBorderThemeBrush}" />
<Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" /> <Setter Property="BorderThickness" Value="{ThemeResource ButtonBorderThemeThickness}" />
<Setter Property="Padding" Value="12,4,12,4" /> <Setter Property="Padding" Value="12,4,12,4" />

27
ModernKeePass/ResourceDictionaries/Styles.xaml
View File

@@ -3,39 +3,31 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<!-- Common theme values --> <!-- Common theme values -->
<x:Double x:Key="MenuSize">60</x:Double> <x:Double x:Key="MenuWidth">60</x:Double>
<x:Double x:Key="MenuHeight">40</x:Double>
<x:Double x:Key="ExpandedMenuSize">300</x:Double> <x:Double x:Key="ExpandedMenuSize">300</x:Double>
<GridLength x:Key="MenuGridLength">60</GridLength> <GridLength x:Key="MenuHeightGridLength">40</GridLength>
<GridLength x:Key="MenuWidthGridLength">60</GridLength>
<GridLength x:Key="ExpandedMenuGridLength">300</GridLength> <GridLength x:Key="ExpandedMenuGridLength">300</GridLength>
<!-- Only available for Windows 10 -->
<!--<SolidColorBrush x:Key="MainColor" Color="{ThemeResource SystemAccentColor}" />
<SolidColorBrush x:Key="TextColor" Color="{ThemeResource SystemColorHighlightTextColor}" />
<SolidColorBrush x:Key="CheckBoxForegroundChecked" Color="{ThemeResource MainColor}"/>
<SolidColorBrush x:Key="CheckBoxCheckGlyphForegroundChecked" Color="{ThemeResource TextColorLight}"/>
<SolidColorBrush x:Key="CheckBoxCheckBackgroundStrokeChecked" Color="{ThemeResource MainColor}"/>
<SolidColorBrush x:Key="CheckBoxCheckBackgroundFillChecked" Color="{ThemeResource MainColor}"/>-->
<Color x:Key="MainColor">SlateBlue</Color> <Color x:Key="MainColor">SlateBlue</Color>
<Color x:Key="MainColorLight">MediumPurple</Color> <Color x:Key="MainColorLight">MediumPurple</Color>
<Color x:Key="MainColorDark">Indigo</Color> <Color x:Key="MainColorDark">Indigo</Color>
<Color x:Key="TextColorLight">WhiteSmoke</Color> <Color x:Key="TextColorLight">WhiteSmoke</Color>
<Color x:Key="TextColorDark">DarkSlateGray</Color>
<Color x:Key="BorderColor">DarkGray</Color> <Color x:Key="BorderColor">DarkGray</Color>
<Color x:Key="FlyoutColor">#FFF0F0F0</Color>
<SolidColorBrush x:Key="MainColorBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="MainColorBrush" Color="{ThemeResource MainColor}" />
<SolidColorBrush x:Key="MainColorLightBrush" Color="{ThemeResource MainColorLight}" /> <SolidColorBrush x:Key="MainColorLightBrush" Color="{ThemeResource MainColorLight}" />
<SolidColorBrush x:Key="MainColorDarkBrush" Color="{ThemeResource MainColorDark}" /> <SolidColorBrush x:Key="MainColorDarkBrush" Color="{ThemeResource MainColorDark}" />
<SolidColorBrush x:Key="TextColorLightBrush" Color="{ThemeResource TextColorLight}" /> <SolidColorBrush x:Key="TextColorLightBrush" Color="{ThemeResource TextColorLight}" />
<SolidColorBrush x:Key="TextColorDarkBrush" Color="{ThemeResource TextColorDark}" />
<Style TargetType="TextBlock" x:Key="TextBlockSettingsHeaderStyle" > <Style TargetType="TextBlock" x:Key="TextBlockSettingsHeaderStyle" >
<Setter Property="FontFamily" Value="Segoe UI" /> <Setter Property="FontFamily" Value="Segoe UI" />
<Setter Property="FontSize" Value="14.667" /> <Setter Property="FontSize" Value="16" />
<Setter Property="FontWeight" Value="SemiLight" /> <Setter Property="FontWeight" Value="SemiLight" />
</Style> </Style>
<SolidColorBrush x:Key="TextBoxForegroundThemeBrush" Color="{ThemeResource TextColorDark}" />
<SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="{ThemeResource BorderColor}" /> <SolidColorBrush x:Key="TextBoxBorderThemeBrush" Color="{ThemeResource BorderColor}" />
<SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="TextSelectionHighlightColorThemeBrush" Color="{ThemeResource MainColor}" />
@@ -50,9 +42,9 @@
<SolidColorBrush x:Key="HyperlinkForegroundThemeBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="HyperlinkForegroundThemeBrush" Color="{ThemeResource MainColor}" />
<SolidColorBrush x:Key="HyperlinkPointerOverForegroundThemeBrush" Color="{ThemeResource MainColorLight}" /> <SolidColorBrush x:Key="HyperlinkPointerOverForegroundThemeBrush" Color="{ThemeResource MainColorLight}" />
<SolidColorBrush x:Key="SearchBoxForegroundThemeBrush" Color="{ThemeResource TextColorDark}" />
<!--<SolidColorBrush x:Key="SearchBoxPointerOverBorderThemeBrush" Color="{ThemeResource MainColorLight}" />--> <!--<SolidColorBrush x:Key="SearchBoxPointerOverBorderThemeBrush" Color="{ThemeResource MainColorLight}" />-->
<SolidColorBrush x:Key="SearchBoxPointerOverTextThemeBrush" Color="{ThemeResource MainColorLight}" /> <SolidColorBrush x:Key="SearchBoxPointerOverTextThemeBrush" Color="{ThemeResource MainColorLight}" />
<SolidColorBrush x:Key="SearchBoxBorderThemeBrush" Color="{ThemeResource BorderColor}" />
<SolidColorBrush x:Key="SearchBoxFocusedBorderThemeBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="SearchBoxFocusedBorderThemeBrush" Color="{ThemeResource MainColor}" />
<SolidColorBrush x:Key="SearchBoxButtonBackgroundThemeBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="SearchBoxButtonBackgroundThemeBrush" Color="{ThemeResource MainColor}" />
<SolidColorBrush x:Key="SearchBoxHitHighlightForegroundThemeBrush" Color="{ThemeResource MainColor}" /> <SolidColorBrush x:Key="SearchBoxHitHighlightForegroundThemeBrush" Color="{ThemeResource MainColor}" />
@@ -84,6 +76,9 @@
<SolidColorBrush x:Key="SliderTrackDecreasePressedBackgroundThemeBrush" Color="{ThemeResource MainColorDark}" /> <SolidColorBrush x:Key="SliderTrackDecreasePressedBackgroundThemeBrush" Color="{ThemeResource MainColorDark}" />
<SolidColorBrush x:Key="SliderTrackDecreasePointerOverBackgroundThemeBrush" Color="{ThemeResource MainColorLight}" /> <SolidColorBrush x:Key="SliderTrackDecreasePointerOverBackgroundThemeBrush" Color="{ThemeResource MainColorLight}" />
<Thickness x:Key="FlyoutBorderThemeThickness">0</Thickness>
<Thickness x:Key="MenuFlyoutPresenterThemePadding">0</Thickness> <Thickness x:Key="MenuFlyoutPresenterThemePadding">0</Thickness>
<Thickness x:Key="FlyoutContentThemePadding">5</Thickness>
<Thickness x:Key="FlyoutBorderThemeThickness">0</Thickness>
<SolidColorBrush x:Key="FlyoutBorderThemeBrush" Color="{ThemeResource FlyoutColor}" />
<SolidColorBrush x:Key="FlyoutBackgroundThemeBrush" Color="{ThemeResource FlyoutColor}" />
</ResourceDictionary> </ResourceDictionary>

5
ModernKeePass/ViewModels/GroupDetailVm.cs
View File

@@ -179,11 +179,6 @@ namespace ModernKeePass.ViewModels
GoToGroup(destinationId); GoToGroup(destinationId);
} }
public async Task<IEnumerable<EntryVm>> Search(string queryText)
{
return await _mediator.Send(new SearchEntriesQuery {GroupId = Id, SearchText = queryText});
}
private async Task SaveChanges() private async Task SaveChanges()
{ {
try try

48
ModernKeePass/Views/EntryDetailPage.xaml
View File

@@ -365,17 +365,18 @@
</TransitionCollection> </TransitionCollection>
</Grid.ChildrenTransitions> </Grid.ChildrenTransitions>
<Grid.RowDefinitions> <Grid.RowDefinitions>
<RowDefinition Height="{StaticResource MenuGridLength}"/> <RowDefinition Height="{StaticResource MenuHeightGridLength}"/>
<RowDefinition Height="*"/> <RowDefinition Height="*"/>
</Grid.RowDefinitions> </Grid.RowDefinitions>
<Grid Grid.Row="1"> <Grid Grid.Row="1">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="{StaticResource MenuGridLength}" x:Name="LeftListViewColumn" /> <ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" /> <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<userControls:HamburgerMenuUserControl x:Uid="HistoryLeftListView" <userControls:HamburgerMenuUserControl
x:Name="HamburgerMenu"
x:Uid="HistoryLeftListView"
ItemsSource="{Binding History}" ItemsSource="{Binding History}"
ResizeTarget="{Binding ElementName=LeftListViewColumn}"
SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}" SelectedIndex="{Binding SelectedIndex, Mode=TwoWay}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}" /> SelectedItem="{Binding SelectedItem, Mode=TwoWay}" />
<Grid Grid.Column="1"> <Grid Grid.Column="1">
@@ -456,36 +457,38 @@
<!-- Bouton Précédent et titre de la page --> <!-- Bouton Précédent et titre de la page -->
<Grid Grid.Row="0" Background="{ThemeResource AppBarBackgroundThemeBrush}"> <Grid Grid.Row="0" Background="{ThemeResource AppBarBackgroundThemeBrush}">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="{StaticResource MenuGridLength}"/> <ColumnDefinition Width="{StaticResource MenuWidthGridLength}"/>
<ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/> <ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<Button Grid.Column="0" <Button Grid.Column="0"
Command="{Binding GoBackCommand}" Command="{Binding GoBackCommand}"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuHeight}"
Width="{StaticResource MenuSize}" Width="{StaticResource MenuWidth}"
AutomationProperties.Name="Back" AutomationProperties.Name="Back"
AutomationProperties.AutomationId="BackButton" AutomationProperties.AutomationId="BackButton"
AutomationProperties.ItemType="Navigation Button" AutomationProperties.ItemType="Navigation Button"
Style="{StaticResource NoBorderButtonStyle}"> Style="{StaticResource NoBorderButtonStyle}">
<SymbolIcon Symbol="Back" /> <SymbolIcon Symbol="Back" />
</Button> </Button>
<Grid Grid.Column="1"> <StackPanel Grid.Column="1" Orientation="Horizontal">
<Grid.ColumnDefinitions> <Button
<ColumnDefinition Width="60" /> Height="{StaticResource MenuHeight}"
<ColumnDefinition Width="*" /> Width="{StaticResource MenuWidth}"
</Grid.ColumnDefinitions> Command="{Binding GoToParentCommand}"
<Grid.RowDefinitions> Style="{StaticResource NoBorderButtonStyle}">
<RowDefinition Height="40" /> <SymbolIcon Symbol="Up" />
<RowDefinition Height="20" /> <ToolTipService.ToolTip>
</Grid.RowDefinitions> <ToolTip Content="{Binding ParentGroupName}" />
<Viewbox MaxHeight="200" Width="200" Grid.Column="0" Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}"> </ToolTipService.ToolTip>
</Button>
<Viewbox MaxHeight="200" Visibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}">
<userControls:SymbolPickerUserControl Width="100" Height="70" SelectedSymbol="{Binding Icon, Mode=TwoWay}" /> <userControls:SymbolPickerUserControl Width="100" Height="70" SelectedSymbol="{Binding Icon, Mode=TwoWay}" />
</Viewbox> </Viewbox>
<Viewbox MaxHeight="200" Width="200" Grid.Column="0" Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBooleanToVisibilityConverter}}"> <Viewbox MaxHeight="200" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBooleanToVisibilityConverter}}">
<SymbolIcon Symbol="{Binding Icon}" Width="100" Height="70" /> <SymbolIcon Symbol="{Binding Icon}" Width="100" Height="70" />
</Viewbox> </Viewbox>
<TextBox Grid.Column="1" Grid.Row="0" <TextBox
x:Uid="EntryTitle" x:Uid="EntryTitle"
x:Name="TitleTextBox" x:Name="TitleTextBox"
Text="{Binding Title, Mode=TwoWay}" Text="{Binding Title, Mode=TwoWay}"
@@ -494,6 +497,7 @@
FontSize="20" FontSize="20"
FontWeight="Light" FontWeight="Light"
TextWrapping="NoWrap" TextWrapping="NoWrap"
MinWidth="360"
VerticalAlignment="Center"> VerticalAlignment="Center">
<interactivity:Interaction.Behaviors> <interactivity:Interaction.Behaviors>
<core:DataTriggerBehavior Binding="{Binding IsEditMode}" Value="True"> <core:DataTriggerBehavior Binding="{Binding IsEditMode}" Value="True">
@@ -505,11 +509,7 @@
</core:DataTriggerBehavior> </core:DataTriggerBehavior>
</interactivity:Interaction.Behaviors> </interactivity:Interaction.Behaviors>
</TextBox> </TextBox>
<HyperlinkButton Grid.Column="1" Grid.Row="1" </StackPanel>
FontWeight="Light" FontSize="12" Padding="0" Margin="5,-5,0,0"
Content="{Binding ParentGroupName}"
Command="{Binding GoToParentCommand}"/>
</Grid>
<userControls:TopMenuUserControl <userControls:TopMenuUserControl
x:Name="TopMenu" Grid.Column="2" x:Name="TopMenu" Grid.Column="2"
IsEditButtonChecked="{Binding IsEditMode, Mode=TwoWay}" IsEditButtonChecked="{Binding IsEditMode, Mode=TwoWay}"

20
ModernKeePass/Views/EntryDetailPage.xaml.cs
View File

@@ -42,8 +42,24 @@ namespace ModernKeePass.Views
private void EntryDetailPage_OnSizeChanged(object sender, SizeChangedEventArgs e) private void EntryDetailPage_OnSizeChanged(object sender, SizeChangedEventArgs e)
{ {
VisualStateManager.GoToState(this, e.NewSize.Width < 700 ? "Small" : "Large", true); if (e.NewSize.Width <= 640)
VisualStateManager.GoToState(TopMenu, e.NewSize.Width < 800 ? "Collapsed" : "Overflowed", true); {
VisualStateManager.GoToState(this, "Small", true);
VisualStateManager.GoToState(TopMenu, "Collapsed", true);
VisualStateManager.GoToState(HamburgerMenu, "Hidden", true);
}
else if (e.NewSize.Width > 640 && e.NewSize.Width <= 1008)
{
VisualStateManager.GoToState(this, "Medium", true);
VisualStateManager.GoToState(TopMenu, "Overflowed", true);
VisualStateManager.GoToState(HamburgerMenu, "Collapsed", true);
}
else
{
VisualStateManager.GoToState(this, "Large", true);
VisualStateManager.GoToState(TopMenu, "Overflowed", true);
VisualStateManager.GoToState(HamburgerMenu, "Collapsed", true);
}
} }
} }
} }

81
ModernKeePass/Views/GroupDetailPage.xaml
View File

@@ -36,21 +36,20 @@
</TransitionCollection> </TransitionCollection>
</Grid.ChildrenTransitions> </Grid.ChildrenTransitions>
<Grid.RowDefinitions> <Grid.RowDefinitions>
<RowDefinition Height="{StaticResource MenuGridLength}"/> <RowDefinition Height="{StaticResource MenuHeightGridLength}"/>
<RowDefinition Height="*"/> <RowDefinition Height="*"/>
</Grid.RowDefinitions> </Grid.RowDefinitions>
<Grid Grid.Row="1"> <Grid Grid.Row="1">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="{StaticResource ExpandedMenuGridLength}" x:Name="LeftListViewColumn" /> <ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" /> <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<userControls:HamburgerMenuUserControl <userControls:HamburgerMenuUserControl
x:Name="HamburgerMenu"
x:Uid="GroupsLeftListView" x:Uid="GroupsLeftListView"
ItemsSource="{Binding Groups}" ItemsSource="{Binding Groups}"
SelectionChanged="groups_SelectionChanged" SelectionChanged="groups_SelectionChanged"
ActionButtonCommand="{Binding CreateGroupCommand}" ActionButtonCommand="{Binding CreateGroupCommand}"
ResizeTarget="{Binding ElementName=LeftListViewColumn}"
IsOpen="True"
IsButtonVisible="Visible" /> IsButtonVisible="Visible" />
<Grid Grid.Column="1"> <Grid Grid.Column="1">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
@@ -116,7 +115,7 @@
<TextBlock Text="{Binding Username}" Style="{StaticResource BodyTextBlockStyle}" Foreground="{Binding ForegroundColor, ConverterParameter={StaticResource TextBoxForegroundThemeBrush}, Converter={StaticResource ColorToBrushConverter}}" MaxHeight="60" /> <TextBlock Text="{Binding Username}" Style="{StaticResource BodyTextBlockStyle}" Foreground="{Binding ForegroundColor, ConverterParameter={StaticResource TextBoxForegroundThemeBrush}, Converter={StaticResource ColorToBrushConverter}}" MaxHeight="60" />
<TextBlock Text="{Binding Url}" Style="{StaticResource BodyTextBlockStyle}" Foreground="{Binding ForegroundColor, ConverterParameter={StaticResource TextBoxForegroundThemeBrush}, Converter={StaticResource ColorToBrushConverter}}" MaxHeight="60" /> <TextBlock Text="{Binding Url}" Style="{StaticResource BodyTextBlockStyle}" Foreground="{Binding ForegroundColor, ConverterParameter={StaticResource TextBoxForegroundThemeBrush}, Converter={StaticResource ColorToBrushConverter}}" MaxHeight="60" />
</StackPanel> </StackPanel>
<Button Grid.Column="2" Style="{StaticResource NoBorderButtonStyle}" Background="{StaticResource AppBarBackgroundThemeBrush}" VerticalAlignment="Bottom" Foreground="{StaticResource TextColorDarkBrush}"> <Button Grid.Column="2" Style="{StaticResource NoBorderButtonStyle}" Background="{StaticResource AppBarBackgroundThemeBrush}" VerticalAlignment="Bottom">
<SymbolIcon Symbol="More" /> <SymbolIcon Symbol="More" />
<Button.Flyout> <Button.Flyout>
<MenuFlyout> <MenuFlyout>
@@ -183,37 +182,38 @@
<!-- Back button and page title --> <!-- Back button and page title -->
<Grid Grid.Row="0" Background="{ThemeResource AppBarBackgroundThemeBrush}"> <Grid Grid.Row="0" Background="{ThemeResource AppBarBackgroundThemeBrush}">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<ColumnDefinition Width="{StaticResource MenuGridLength}"/> <ColumnDefinition Width="{StaticResource MenuWidthGridLength}"/>
<ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/> <ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<Button Grid.Column="0" <Button Grid.Column="0"
Command="{Binding GoBackCommand}" Command="{Binding GoBackCommand}"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuHeight}"
Width="{StaticResource MenuSize}" Width="{StaticResource MenuWidth}"
AutomationProperties.Name="Back" AutomationProperties.Name="Back"
AutomationProperties.AutomationId="BackButton" AutomationProperties.AutomationId="BackButton"
AutomationProperties.ItemType="Navigation Button" AutomationProperties.ItemType="Navigation Button"
Style="{StaticResource NoBorderButtonStyle}"> Style="{StaticResource NoBorderButtonStyle}">
<SymbolIcon Symbol="Back" /> <SymbolIcon Symbol="Back" />
</Button> </Button>
<Grid Grid.Column="1" > <StackPanel Grid.Column="1" Orientation="Horizontal">
<Grid.ColumnDefinitions> <Button
<ColumnDefinition Width="60" /> Height="{StaticResource MenuHeight}"
<ColumnDefinition Width="*" /> Width="{StaticResource MenuWidth}"
</Grid.ColumnDefinitions> Command="{Binding GoToParentCommand}"
<Grid.RowDefinitions> Style="{StaticResource NoBorderButtonStyle}">
<RowDefinition Height="40" /> <SymbolIcon Symbol="Up" />
<RowDefinition Height="20" /> <ToolTipService.ToolTip>
</Grid.RowDefinitions> <ToolTip Content="{Binding ParentGroupName}" />
<Viewbox MaxHeight="200" Width="200" Grid.Column="0" Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}"> </ToolTipService.ToolTip>
</Button>
<Viewbox MaxHeight="200" Visibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}">
<userControls:SymbolPickerUserControl Width="100" Height="70" SelectedSymbol="{Binding Icon, Mode=TwoWay}" /> <userControls:SymbolPickerUserControl Width="100" Height="70" SelectedSymbol="{Binding Icon, Mode=TwoWay}" />
</Viewbox> </Viewbox>
<Viewbox MaxHeight="200" Width="200" Grid.Column="0" Grid.Row="0" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBooleanToVisibilityConverter}}"> <Viewbox MaxHeight="200" Visibility="{Binding IsEditMode, Converter={StaticResource InverseBooleanToVisibilityConverter}}">
<SymbolIcon Symbol="{Binding Icon}" Width="100" Height="70" /> <SymbolIcon Symbol="{Binding Icon}" Width="100" Height="70" />
</Viewbox> </Viewbox>
<TextBox Grid.Column="1" Grid.Row="0" <TextBox
x:Uid="GroupTitle" x:Uid="GroupTitle"
x:Name="TitleTextBox" x:Name="TitleTextBox"
Text="{Binding Title, Mode=TwoWay}" Text="{Binding Title, Mode=TwoWay}"
@@ -222,6 +222,7 @@
FontSize="20" FontSize="20"
FontWeight="Light" FontWeight="Light"
TextWrapping="NoWrap" TextWrapping="NoWrap"
MinWidth="360"
VerticalAlignment="Center"> VerticalAlignment="Center">
<interactivity:Interaction.Behaviors> <interactivity:Interaction.Behaviors>
<core:DataTriggerBehavior Binding="{Binding IsEditMode}" Value="True"> <core:DataTriggerBehavior Binding="{Binding IsEditMode}" Value="True">
@@ -233,11 +234,7 @@
</core:DataTriggerBehavior> </core:DataTriggerBehavior>
</interactivity:Interaction.Behaviors> </interactivity:Interaction.Behaviors>
</TextBox> </TextBox>
<HyperlinkButton Grid.Column="1" Grid.Row="1" </StackPanel>
FontWeight="Light" FontSize="12" Padding="0" Margin="5,-5,0,0"
Content="{Binding ParentGroupName}"
Command="{Binding GoToParentCommand}" />
</Grid>
<userControls:TopMenuUserControl x:Name="TopMenu" Grid.Column="2" <userControls:TopMenuUserControl x:Name="TopMenu" Grid.Column="2"
SortButtonVisibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}" SortButtonVisibility="{Binding IsEditMode, Converter={StaticResource BooleanToVisibilityConverter}}"
IsEditButtonChecked="{Binding IsEditMode, Mode=TwoWay}" IsEditButtonChecked="{Binding IsEditMode, Mode=TwoWay}"
@@ -252,31 +249,7 @@
</core:EventTriggerBehavior> </core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors> </interactivity:Interaction.Behaviors>
</userControls:TopMenuUserControl> </userControls:TopMenuUserControl>
<Button Grid.Column="3" x:Name="SearchButton" Style="{StaticResource NoBorderButtonStyle}" Background="{ThemeResource ToggleButtonBackgroundThemeBrush}" Height="{StaticResource MenuSize}" Padding="25,0,25,0">
<StackPanel Orientation="Horizontal">
<SymbolIcon Symbol="Find" />
<TextBlock x:Uid="SearchButtonLabel" x:Name="SearchButtonLabel" TextWrapping="NoWrap" FontSize="16" VerticalAlignment="Center" Margin="10,0,0,0" />
</StackPanel>
<ToolTipService.ToolTip>
<ToolTip x:Uid="SearchButtonTooltip" />
</ToolTipService.ToolTip>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchBox}" PropertyName="Visibility" Value="Visible" />
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchButton}" PropertyName="Visibility" Value="Collapsed" />
<!-- TODO: make this work -->
<actions:SetupFocusAction TargetObject="{Binding ElementName=SearchBox}" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
<SearchBox Grid.Column="3" x:Uid="EntriesSearch" x:Name="SearchBox" Padding="12" Width="350" Visibility="Collapsed" Margin="0,5,0,5" FontSize="15" SuggestionsRequested="SearchBox_OnSuggestionsRequested" SearchHistoryEnabled="False" ResultSuggestionChosen="SearchBox_OnResultSuggestionChosen">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="LostFocus">
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchBox}" PropertyName="Visibility" Value="Collapsed" />
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchButton}" PropertyName="Visibility" Value="Visible" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</SearchBox>
</Grid> </Grid>
<VisualStateManager.VisualStateGroups> <VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="DragDropGroup"> <VisualStateGroup x:Name="DragDropGroup">
@@ -301,9 +274,6 @@
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="AddEntryTextBlock" Storyboard.TargetProperty="Visibility"> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AddEntryTextBlock" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames> </ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SearchButtonLabel" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard> </Storyboard>
</VisualState> </VisualState>
<VisualState x:Name="Large"> <VisualState x:Name="Large">
@@ -311,9 +281,6 @@
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="AddEntryTextBlock" Storyboard.TargetProperty="Visibility"> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AddEntryTextBlock" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames> </ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SearchButtonLabel" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard> </Storyboard>
</VisualState> </VisualState>
</VisualStateGroup> </VisualStateGroup>

35
ModernKeePass/Views/GroupDetailPage.xaml.cs
View File

@@ -84,25 +84,26 @@ namespace ModernKeePass.Views
e.Data.RequestedOperation = DataPackageOperation.Move; e.Data.RequestedOperation = DataPackageOperation.Move;
} }
private async void SearchBox_OnSuggestionsRequested(SearchBox sender, SearchBoxSuggestionsRequestedEventArgs args)
{
var imageUri = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appdata://Assets/ModernKeePass-SmallLogo.scale-80.png"));
var results = (await Model.Search(args.QueryText)).Take(5);
foreach (var result in results)
{
args.Request.SearchSuggestionCollection.AppendResultSuggestion(result.Title, result.ParentGroupName, result.Id, imageUri, string.Empty);
}
}
private void SearchBox_OnResultSuggestionChosen(SearchBox sender, SearchBoxResultSuggestionChosenEventArgs args)
{
Model.GoToEntry(args.Tag);
}
private void GroupDetailPage_OnSizeChanged(object sender, SizeChangedEventArgs e) private void GroupDetailPage_OnSizeChanged(object sender, SizeChangedEventArgs e)
{ {
VisualStateManager.GoToState(this, e.NewSize.Width < 800 ? "Small" : "Large", true); if (e.NewSize.Width <= 640)
VisualStateManager.GoToState(TopMenu, e.NewSize.Width < 800 ? "Collapsed" : "Overflowed", true); {
VisualStateManager.GoToState(this, "Small", true);
VisualStateManager.GoToState(TopMenu, "Collapsed", true);
VisualStateManager.GoToState(HamburgerMenu, "Hidden", true);
}
else if (e.NewSize.Width > 640 && e.NewSize.Width <= 1008)
{
VisualStateManager.GoToState(this, "Medium", true);
VisualStateManager.GoToState(TopMenu, "Overflowed", true);
VisualStateManager.GoToState(HamburgerMenu, "Collapsed", true);
}
else
{
VisualStateManager.GoToState(this, "Large", true);
VisualStateManager.GoToState(TopMenu, "Overflowed", true);
VisualStateManager.GoToState(HamburgerMenu, "Expanded", true);
}
} }
#endregion #endregion

4
ModernKeePass/Views/MainPage.xaml
View File

@@ -27,7 +27,7 @@
</TransitionCollection> </TransitionCollection>
</Grid.ChildrenTransitions> </Grid.ChildrenTransitions>
<Grid.RowDefinitions> <Grid.RowDefinitions>
<RowDefinition Height="{StaticResource MenuGridLength}"/> <RowDefinition Height="{StaticResource MenuHeightGridLength}"/>
<RowDefinition Height="*"/> <RowDefinition Height="*"/>
</Grid.RowDefinitions> </Grid.RowDefinitions>
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
@@ -44,7 +44,7 @@
<Button x:Name="BackButton" <Button x:Name="BackButton"
Command="{Binding NavigationHelper.GoBackCommand, ElementName=PageRoot}" Command="{Binding NavigationHelper.GoBackCommand, ElementName=PageRoot}"
Visibility="Collapsed" Visibility="Collapsed"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuWidth}"
AutomationProperties.Name="Back" AutomationProperties.Name="Back"
AutomationProperties.AutomationId="BackButton" AutomationProperties.AutomationId="BackButton"
AutomationProperties.ItemType="Navigation Button" AutomationProperties.ItemType="Navigation Button"

101
ModernKeePass/Views/UserControls/HamburgerMenuUserControl.xaml
View File

@@ -12,16 +12,79 @@
<UserControl.Resources> <UserControl.Resources>
<converters:IconToSymbolConverter x:Key="IconToSymbolConverter"/> <converters:IconToSymbolConverter x:Key="IconToSymbolConverter"/>
</UserControl.Resources> </UserControl.Resources>
<Grid HorizontalAlignment="Left">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="VisibilityStates">
<VisualState x:Name="Hidden">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListView" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderTextBlock" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Collapsed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListView" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListView" Storyboard.TargetProperty="Width">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MenuWidth}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderTextBlock" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Expanded">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListView" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ListView" Storyboard.TargetProperty="Width">
<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ExpandedMenuSize}"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderTextBlock" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.RowDefinitions>
<RowDefinition Height="{StaticResource MenuHeightGridLength}" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Orientation="Horizontal">
<ToggleButton Style="{StaticResource HamburgerToggleButton}" Unchecked="ToggleButton_OnUnchecked">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Checked">
<core:GoToStateAction StateName="Expanded" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</ToggleButton>
<TextBlock
x:Name="HeaderTextBlock"
Text="{Binding HeaderLabel, ElementName=UserControl}"
FontWeight="Bold"
FontSize="18"
TextWrapping="NoWrap"
VerticalAlignment="Center"
Margin="30,0,20,0"
HorizontalAlignment="Center" />
</StackPanel>
<ListView <ListView
x:Name="ListView"
Grid.Row="1"
ItemsSource="{Binding ItemsSource, ElementName=UserControl}" ItemsSource="{Binding ItemsSource, ElementName=UserControl}"
SelectionChanged="Selector_OnSelectionChanged" SelectionChanged="Selector_OnSelectionChanged"
SelectedItem="{Binding SelectedItem, ElementName=UserControl, Mode=TwoWay}" SelectedItem="{Binding SelectedItem, ElementName=UserControl, Mode=TwoWay}"
SelectedIndex="{Binding SelectedIndex, ElementName=UserControl, Mode=TwoWay}" SelectedIndex="{Binding SelectedIndex, ElementName=UserControl, Mode=TwoWay}"
IsSwipeEnabled="false" IsSwipeEnabled="false"
IsSynchronizedWithCurrentItem="False" IsSynchronizedWithCurrentItem="False"
RequestedTheme="Dark" Background="{ThemeResource AppBarBackgroundThemeBrush}"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"
Foreground="{ThemeResource TextColorLightBrush}"
ItemContainerStyle="{StaticResource ListViewLeftIndicatorItemExpanded}"> ItemContainerStyle="{StaticResource ListViewLeftIndicatorItemExpanded}">
<ListView.Resources> <ListView.Resources>
<DataTemplate x:Name="IsSpecial"> <DataTemplate x:Name="IsSpecial">
@@ -48,36 +111,15 @@
<ListView.ItemTemplateSelector> <ListView.ItemTemplateSelector>
<templateSelectors:SelectableDataTemplateSelector FalseItem="{StaticResource IsNormal}" TrueItem="{StaticResource IsSpecial}" /> <templateSelectors:SelectableDataTemplateSelector FalseItem="{StaticResource IsNormal}" TrueItem="{StaticResource IsSpecial}" />
</ListView.ItemTemplateSelector> </ListView.ItemTemplateSelector>
<ListView.HeaderTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<ToggleButton Style="{StaticResource HamburgerToggleButton}" IsChecked="{Binding IsOpen, ElementName=UserControl}">
<ToolTipService.ToolTip>
<ToolTip Content="{Binding HeaderLabel, ElementName=UserControl}" />
</ToolTipService.ToolTip>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Checked">
<core:ChangePropertyAction PropertyName="Width" Value="{StaticResource ExpandedMenuSize}" TargetObject="{Binding ResizeTarget, ElementName=UserControl}"/>
</core:EventTriggerBehavior>
<core:EventTriggerBehavior EventName="Unchecked">
<core:ChangePropertyAction PropertyName="Width" Value="{StaticResource MenuSize}" TargetObject="{Binding ResizeTarget, ElementName=UserControl}"/>
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</ToggleButton>
<TextBlock Text="{Binding HeaderLabel, ElementName=UserControl}" FontWeight="Bold" FontSize="18" TextWrapping="NoWrap" VerticalAlignment="Center" Margin="30,0,20,0" HorizontalAlignment="Center" />
</StackPanel>
</DataTemplate>
</ListView.HeaderTemplate>
<ListView.FooterTemplate> <ListView.FooterTemplate>
<DataTemplate> <DataTemplate>
<StackPanel Orientation="Vertical"> <StackPanel Orientation="Vertical">
<Border BorderBrush="White" BorderThickness="0,0,0,1" /> <Border BorderBrush="DarkGray" BorderThickness="0,0,0,1" />
<Button Padding="0" Margin="0" <Button Padding="0" Margin="0"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuWidth}"
Visibility="{Binding IsButtonVisible, ElementName=UserControl}" Visibility="{Binding IsButtonVisible, ElementName=UserControl}"
Style="{StaticResource NoBorderButtonStyle}" Style="{StaticResource NoBorderButtonStyle}"
Background="Transparent" Background="Transparent"
Foreground="{ThemeResource TextColorLightBrush}"
BorderThickness="0" BorderThickness="0"
Width="{StaticResource ExpandedMenuSize}" Width="{StaticResource ExpandedMenuSize}"
HorizontalContentAlignment="Left" HorizontalContentAlignment="Left"
@@ -92,9 +134,8 @@
</StackPanel> </StackPanel>
</Button> </Button>
<Button Padding="0" Margin="0" <Button Padding="0" Margin="0"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuWidth}"
Style="{StaticResource NoBorderButtonStyle}" Style="{StaticResource NoBorderButtonStyle}"
Foreground="{ThemeResource TextColorLightBrush}"
Background="Transparent" Background="Transparent"
BorderThickness="0" BorderThickness="0"
Width="{StaticResource ExpandedMenuSize}" Width="{StaticResource ExpandedMenuSize}"
@@ -115,9 +156,8 @@
</Button> </Button>
<Button <Button
Padding="0" Margin="0" Padding="0" Margin="0"
Height="{StaticResource MenuSize}" Height="{StaticResource MenuWidth}"
Style="{StaticResource NoBorderButtonStyle}" Style="{StaticResource NoBorderButtonStyle}"
Foreground="{ThemeResource TextColorLightBrush}"
Background="Transparent" Background="Transparent"
BorderThickness="0" BorderThickness="0"
Width="{StaticResource ExpandedMenuSize}" Width="{StaticResource ExpandedMenuSize}"
@@ -140,4 +180,5 @@
</DataTemplate> </DataTemplate>
</ListView.FooterTemplate> </ListView.FooterTemplate>
</ListView> </ListView>
</Grid>
</UserControl> </UserControl>

31
ModernKeePass/Views/UserControls/HamburgerMenuUserControl.xaml.cs
View File

@@ -52,18 +52,6 @@ namespace ModernKeePass.Views.UserControls
typeof(HamburgerMenuUserControl), typeof(HamburgerMenuUserControl),
new PropertyMetadata("Title", (o, args) => { })); new PropertyMetadata("Title", (o, args) => { }));
public object ResizeTarget
{
get { return GetValue(ResizeTargetProperty); }
set { SetValue(ResizeTargetProperty, value); }
}
public static readonly DependencyProperty ResizeTargetProperty =
DependencyProperty.Register(
nameof(ResizeTarget),
typeof(object),
typeof(HamburgerMenuUserControl),
new PropertyMetadata(null, (o, args) => { }));
public Visibility IsButtonVisible public Visibility IsButtonVisible
{ {
get { return (Visibility)GetValue(IsButtonVisibleProperty); } get { return (Visibility)GetValue(IsButtonVisibleProperty); }
@@ -113,18 +101,6 @@ namespace ModernKeePass.Views.UserControls
typeof(HamburgerMenuUserControl), typeof(HamburgerMenuUserControl),
new PropertyMetadata(-1, (o, args) => { })); new PropertyMetadata(-1, (o, args) => { }));
public bool IsOpen
{
get { return (bool)GetValue(IsOpenProperty); }
set { SetValue(IsOpenProperty, value); }
}
public static readonly DependencyProperty IsOpenProperty =
DependencyProperty.Register(
nameof(IsOpen),
typeof(bool),
typeof(HamburgerMenuUserControl),
new PropertyMetadata(false, (o, args) => { }));
public ICommand ActionButtonCommand public ICommand ActionButtonCommand
{ {
get { return (ICommand)GetValue(ActionButtonCommandProperty); } get { return (ICommand)GetValue(ActionButtonCommandProperty); }
@@ -143,5 +119,12 @@ namespace ModernKeePass.Views.UserControls
{ {
SelectionChanged?.Invoke(sender, e); SelectionChanged?.Invoke(sender, e);
} }
private void ToggleButton_OnUnchecked(object sender, RoutedEventArgs e)
{
var parent = Parent as FrameworkElement;
if (parent == null) return;
VisualStateManager.GoToState(this, parent.ActualWidth <= 640 ? "Hidden" : "Collapsed", true);
}
} }
} }

55
ModernKeePass/Views/UserControls/TopMenuUserControl.xaml
View File

@@ -4,15 +4,18 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:actions="using:ModernKeePass.Actions"
mc:Ignorable="d"> mc:Ignorable="d">
<UserControl.Resources> <UserControl.Resources>
<Style BasedOn="{StaticResource NoBorderButtonStyle}" TargetType="Button" x:Key="MenuButtonStyle" > <Style BasedOn="{StaticResource NoBorderButtonStyle}" TargetType="Button" x:Key="MenuButtonStyle" >
<Setter Property="Padding" Value="25,0,25,0" /> <Setter Property="Padding" Value="25,0,25,0" />
<Setter Property="Height" Value="{StaticResource MenuSize}" /> <Setter Property="Height" Value="{StaticResource MenuHeight}" />
</Style> </Style>
<Style BasedOn="{StaticResource NoBorderToggleButtonStyle}" TargetType="ToggleButton" x:Key="MenuToggleButtonStyle" > <Style BasedOn="{StaticResource NoBorderToggleButtonStyle}" TargetType="ToggleButton" x:Key="MenuToggleButtonStyle" >
<Setter Property="Padding" Value="25,0,25,0" /> <Setter Property="Padding" Value="25,0,25,0" />
<Setter Property="Height" Value="{StaticResource MenuSize}" /> <Setter Property="Height" Value="{StaticResource MenuHeight}" />
</Style> </Style>
</UserControl.Resources> </UserControl.Resources>
<StackPanel x:Name="StackPanel" Orientation="Horizontal" DataContext="{Binding Source={StaticResource Locator}, Path=TopMenu}"> <StackPanel x:Name="StackPanel" Orientation="Horizontal" DataContext="{Binding Source={StaticResource Locator}, Path=TopMenu}">
@@ -26,6 +29,9 @@
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MoreButton" Storyboard.TargetProperty="Visibility"> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MoreButton" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames> </ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SearchButtonLabel" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard> </Storyboard>
</VisualState> </VisualState>
<VisualState x:Name="Collapsed"> <VisualState x:Name="Collapsed">
@@ -36,6 +42,9 @@
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MoreButton" Storyboard.TargetProperty="Visibility"> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="MoreButton" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
</ObjectAnimationUsingKeyFrames> </ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="SearchButtonLabel" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard> </Storyboard>
</VisualState> </VisualState>
</VisualStateGroup> </VisualStateGroup>
@@ -56,13 +65,12 @@
</SymbolIcon> </SymbolIcon>
<Button.Flyout> <Button.Flyout>
<Flyout Opening="MoveButtonFlyout_OnOpening"> <Flyout Opening="MoveButtonFlyout_OnOpening">
<StackPanel> <StackPanel Background="Transparent">
<SearchBox x:Uid="GroupsSearch" <SearchBox x:Uid="GroupsSearch"
Padding="12" Width="350" Width="250"
Margin="0,5,0,5" Margin="0,5,0,5"
FontSize="15" SuggestionsRequested="GroupSearchBox_OnSuggestionsRequested"
SuggestionsRequested="SearchBox_OnSuggestionsRequested" ResultSuggestionChosen="GroupSearchBox_OnResultSuggestionChosen"
ResultSuggestionChosen="SearchBox_OnResultSuggestionChosen"
SearchHistoryEnabled="False"> SearchHistoryEnabled="False">
</SearchBox> </SearchBox>
<Button x:Name="MoveButton" x:Uid="MoveButton" /> <Button x:Name="MoveButton" x:Uid="MoveButton" />
@@ -104,6 +112,39 @@
</ToolTipService.ToolTip> </ToolTipService.ToolTip>
</SymbolIcon> </SymbolIcon>
</Button> </Button>
<Button x:Name="SearchButton" Style="{StaticResource NoBorderButtonStyle}" Height="{StaticResource MenuHeight}" Padding="25,0,25,0">
<StackPanel Orientation="Horizontal">
<SymbolIcon Symbol="Find" />
<TextBlock x:Uid="SearchButtonLabel" x:Name="SearchButtonLabel" TextWrapping="NoWrap" FontSize="16" VerticalAlignment="Center" Margin="10,0,0,0" />
</StackPanel>
<ToolTipService.ToolTip>
<ToolTip x:Uid="SearchButtonTooltip" />
</ToolTipService.ToolTip>
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchBox}" PropertyName="Visibility" Value="Visible" />
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchButton}" PropertyName="Visibility" Value="Collapsed" />
<!-- TODO: make this work -->
<actions:SetupFocusAction TargetObject="{Binding ElementName=SearchBox}" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
<SearchBox
x:Uid="EntriesSearch"
x:Name="SearchBox"
Margin="0,5,0,5"
Width="350"
Visibility="Collapsed"
SuggestionsRequested="EntrySearchBox_OnSuggestionsRequested"
SearchHistoryEnabled="False"
ResultSuggestionChosen="EntrySearchBox_OnResultSuggestionChosen">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="LostFocus">
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchBox}" PropertyName="Visibility" Value="Collapsed" />
<core:ChangePropertyAction TargetObject="{Binding ElementName=SearchButton}" PropertyName="Visibility" Value="Visible" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</SearchBox>
</StackPanel> </StackPanel>
<Button x:Name="MoreButton" Style="{StaticResource MenuButtonStyle}"> <Button x:Name="MoreButton" Style="{StaticResource MenuButtonStyle}">
<SymbolIcon Symbol="More" /> <SymbolIcon Symbol="More" />

20
ModernKeePass/Views/UserControls/TopMenuUserControl.xaml.cs
View File

@@ -194,7 +194,7 @@ namespace ModernKeePass.Views.UserControls
SortGroupsButtonFlyout.Command = SortGroupsCommand; SortGroupsButtonFlyout.Command = SortGroupsCommand;
} }
private void SearchBox_OnSuggestionsRequested(SearchBox sender, SearchBoxSuggestionsRequestedEventArgs args) private void GroupSearchBox_OnSuggestionsRequested(SearchBox sender, SearchBoxSuggestionsRequestedEventArgs args)
{ {
var imageUri = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appdata://Assets/ModernKeePass-SmallLogo.scale-80.png")); var imageUri = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appdata://Assets/ModernKeePass-SmallLogo.scale-80.png"));
var groups = Model.Groups.Where(g => g.Title.IndexOf(args.QueryText, StringComparison.OrdinalIgnoreCase) >= 0).Take(5); var groups = Model.Groups.Where(g => g.Title.IndexOf(args.QueryText, StringComparison.OrdinalIgnoreCase) >= 0).Take(5);
@@ -209,10 +209,26 @@ namespace ModernKeePass.Views.UserControls
} }
} }
private void SearchBox_OnResultSuggestionChosen(SearchBox sender, SearchBoxResultSuggestionChosenEventArgs args) private void GroupSearchBox_OnResultSuggestionChosen(SearchBox sender, SearchBoxResultSuggestionChosenEventArgs args)
{ {
MoveButton.CommandParameter = args.Tag; MoveButton.CommandParameter = args.Tag;
MoveCommand.RaiseCanExecuteChanged(); MoveCommand.RaiseCanExecuteChanged();
} }
private async void EntrySearchBox_OnSuggestionsRequested(SearchBox sender, SearchBoxSuggestionsRequestedEventArgs args)
{
var imageUri = RandomAccessStreamReference.CreateFromUri(new Uri("ms-appdata://Assets/ModernKeePass-SmallLogo.scale-80.png"));
var results = (await Model.Search(args.QueryText)).Take(5);
foreach (var result in results)
{
args.Request.SearchSuggestionCollection.AppendResultSuggestion(result.Title, result.ParentGroupName, result.Id, imageUri, string.Empty);
}
}
private void EntrySearchBox_OnResultSuggestionChosen(SearchBox sender, SearchBoxResultSuggestionChosenEventArgs args)
{
Model.GoToEntry(args.Tag);
}
} }
} }

33
WinAppCommon/ViewModels/UserControls/TopMenuVm.cs
View File

@@ -1,19 +1,46 @@
using System.Collections.Generic; using System.Collections.Generic;
using System.Threading.Tasks;
using GalaSoft.MvvmLight.Views;
using MediatR; using MediatR;
using ModernKeePass.Application.Database.Models;
using ModernKeePass.Application.Database.Queries.GetDatabase; using ModernKeePass.Application.Database.Queries.GetDatabase;
using ModernKeePass.Application.Entry.Models;
using ModernKeePass.Application.Group.Models; using ModernKeePass.Application.Group.Models;
using ModernKeePass.Application.Group.Queries.GetAllGroups; using ModernKeePass.Application.Group.Queries.GetAllGroups;
using ModernKeePass.Application.Group.Queries.SearchEntries;
using ModernKeePass.Common;
using ModernKeePass.Models;
namespace ModernKeePass.ViewModels namespace ModernKeePass.ViewModels
{ {
public class TopMenuVm public class TopMenuVm
{ {
private readonly IMediator _mediator;
private readonly INavigationService _navigation;
private readonly DatabaseVm _database;
public IEnumerable<GroupVm> Groups { get; set; } public IEnumerable<GroupVm> Groups { get; set; }
public TopMenuVm(IMediator mediator) public TopMenuVm(IMediator mediator, INavigationService navigation)
{ {
var database = mediator.Send(new GetDatabaseQuery()).GetAwaiter().GetResult(); _mediator = mediator;
Groups = mediator.Send(new GetAllGroupsQuery { GroupId = database.RootGroupId }).GetAwaiter().GetResult(); _navigation = navigation;
_database = _mediator.Send(new GetDatabaseQuery()).GetAwaiter().GetResult();
Groups = _mediator.Send(new GetAllGroupsQuery { GroupId = _database.RootGroupId }).GetAwaiter().GetResult();
}
public void GoToEntry(string entryId, bool isNew = false)
{
_navigation.NavigateTo(Constants.Navigation.EntryPage, new NavigationItem
{
Id = entryId,
IsNew = isNew
});
}
public async Task<IEnumerable<EntryVm>> Search(string queryText)
{
return await _mediator.Send(new SearchEntriesQuery { GroupId = _database.RootGroupId, SearchText = queryText });
} }
} }
} }