Replaced arrow buttons with a hamburger icon in groups menu

Created data triggers with Blend to handle item data template changes
This commit is contained in:
2017-10-05 14:50:42 +02:00
committed by BONNEVILLE Geoffroy
parent 013108f2ec
commit c611f5a8a2
5 changed files with 79 additions and 46 deletions

View File

@@ -6,6 +6,8 @@
xmlns:viewModels="using:ModernKeePass.ViewModels"
xmlns:converters="using:ModernKeePass.Converters"
xmlns:local="using:ModernKeePass.Controls"
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
x:Name="PageRoot"
x:Class="ModernKeePass.Pages.GroupDetailPage"
mc:Ignorable="d" >
@@ -18,7 +20,6 @@
<Page.DataContext>
<viewModels:GroupVm />
</Page.DataContext>
<Grid>
<Grid.Resources>
<CollectionViewSource
@@ -45,13 +46,9 @@
AutomationProperties.AutomationId="ItemGridView"
AutomationProperties.Name="Entries"
TabIndex="1"
ItemsSource="{Binding Source={StaticResource EntriesViewSource}}"
IsSwipeEnabled="false"
SelectionChanged="entries_SelectionChanged"
IsSynchronizedWithCurrentItem="False" >
<GridView.DataContext>
<viewModels:EntryVm></viewModels:EntryVm>
</GridView.DataContext>
<GridView.Resources>
<DataTemplate x:Name="GroupFirstItem">
<Border
@@ -93,6 +90,12 @@
</Border>
</DataTemplate>
</GridView.Resources>
<GridView.ItemsSource>
<Binding Source="{StaticResource EntriesViewSource}"/>
</GridView.ItemsSource>
<GridView.DataContext>
<viewModels:EntryVm/>
</GridView.DataContext>
<GridView.ItemTemplateSelector>
<local:FirstItemDataTemplateSelector
FirstItem="{StaticResource GroupFirstItem}"
@@ -110,17 +113,13 @@
Width="auto"
Background="LightGray"
Foreground="DarkSlateGray"
ItemsSource="{Binding Source={StaticResource GroupsViewSource}}"
SelectionChanged="groups_SelectionChanged"
IsSwipeEnabled="false"
IsSynchronizedWithCurrentItem="False"
DataContext="{Binding DataContext, ElementName=PageRoot}">
<ListView.Resources>
<DataTemplate x:Name="Collapsed">
<StackPanel
Margin="10,0,0,0"
Width="30"
Orientation="Horizontal" >
<StackPanel Margin="10,0,0,0" Width="30" Orientation="Horizontal" >
<SymbolIcon Symbol="{Binding IconSymbol}" />
</StackPanel>
</DataTemplate>
@@ -131,23 +130,29 @@
<!--<TextBlock Text="{Binding EntryCount}" HorizontalAlignment="Right" VerticalAlignment="Center" />-->
</StackPanel>
</DataTemplate>
<DataTemplate x:Name="Forward">
<Button x:Name="ForwardButton" Click="Button_Click" BorderBrush="LightGray" HorizontalAlignment="Right">
<SymbolIcon Symbol="Forward" Foreground="DimGray" />
</Button>
</DataTemplate>
<DataTemplate x:Name="Back">
<Button x:Name="BackButton" Click="Button_Click" BorderBrush="LightGray" HorizontalAlignment="Right">
<SymbolIcon Symbol="Back" Foreground="DimGray" />
</Button>
</DataTemplate>
</ListView.Resources>
<ListView.ItemsSource>
<Binding Source="{StaticResource GroupsViewSource}"/>
</ListView.ItemsSource>
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="VerticalContentAlignment" Value="Stretch" />
</Style>
</ListView.ItemContainerStyle>
<ListView.HeaderTemplate>
<DataTemplate>
<ToggleButton IsChecked="{Binding IsLeftPaneOpen, Mode=TwoWay}" Style="{StaticResource HamburgerToggleButton}" Margin="0" />
</DataTemplate>
</ListView.HeaderTemplate>
<Interactivity:Interaction.Behaviors>
<Core:DataTriggerBehavior Binding="{Binding IsLeftPaneOpen}" Value="True">
<Core:ChangePropertyAction PropertyName="ItemTemplate" Value="{StaticResource Expanded}"/>
</Core:DataTriggerBehavior>
<Core:DataTriggerBehavior Binding="{Binding IsLeftPaneOpen}" Value="False">
<Core:ChangePropertyAction PropertyName="ItemTemplate" Value="{StaticResource Collapsed}"/>
</Core:DataTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ListView>
</GridView.Header>
</GridView>
@@ -196,11 +201,11 @@
Margin="0,40,0,0"
Background="Transparent"
IsOpen="True">
<AppBarButton Icon="Save" Label="Save" />
<CommandBar.SecondaryCommands>
<AppBarButton Icon="Edit" Label="Edit" />
<AppBarButton Icon="Delete" Label="Delete" IsEnabled="{Binding IsNotRoot}" Click="AppBarButton_Click" />
</CommandBar.SecondaryCommands>
<AppBarButton Icon="Save" Label="Save" />
</CommandBar>
</Grid>
</Grid>

View File

@@ -26,8 +26,6 @@ namespace ModernKeePass.Pages
InitializeComponent();
NavigationHelper = new NavigationHelper(this);
NavigationHelper.LoadState += navigationHelper_LoadState;
LeftListView.ItemTemplate = (DataTemplate)LeftListView.Resources["Collapsed"];
LeftListView.HeaderTemplate = (DataTemplate)LeftListView.Resources["Forward"];
}
/// <summary>
@@ -106,22 +104,5 @@ namespace ModernKeePass.Pages
group?.RemoveGroup();
if (Frame.CanGoBack) Frame.GoBack();
}
private void Button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
var button = sender as Button;
if (button == null) return;
switch (button.Name)
{
case "ForwardButton":
LeftListView.ItemTemplate = (DataTemplate) LeftListView.Resources["Expanded"];
LeftListView.HeaderTemplate = (DataTemplate) LeftListView.Resources["Back"];
break;
case "BackButton":
LeftListView.ItemTemplate = (DataTemplate)LeftListView.Resources["Collapsed"];
LeftListView.HeaderTemplate = (DataTemplate)LeftListView.Resources["Forward"];
break;
}
}
}
}