mirror of
https://github.com/wismna/ModernKeePass.git
synced 2025-10-04 08:00:16 -04:00
Major changes in MainPage: now is layout dependant (with a base, to prepare for Settings)
Main sub pages also changed to better work with Main (but needs improvement) Added a Settings Page stub
This commit is contained in:
BONNEVILLE Geoffroy
181
ModernKeePass/Pages/SettingsPage.xaml
Normal file
181
ModernKeePass/Pages/SettingsPage.xaml
Normal file
@@ -0,0 +1,181 @@
|
||||
<Page
|
||||
x:Name="pageRoot"
|
||||
x:Class="ModernKeePass.Pages.SettingsPage"
|
||||
DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:local="using:ModernKeePass.Pages"
|
||||
xmlns:common="using:ModernKeePass.Common"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
mc:Ignorable="d">
|
||||
|
||||
<Page.Resources>
|
||||
<!-- Collection of items displayed by this page -->
|
||||
<CollectionViewSource
|
||||
x:Name="itemsViewSource"
|
||||
Source="{Binding Items}"/>
|
||||
</Page.Resources>
|
||||
|
||||
<!--
|
||||
This grid acts as a root panel for the page that defines two rows:
|
||||
* Row 0 contains the back button and page title
|
||||
* Row 1 contains the rest of the page layout
|
||||
-->
|
||||
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
|
||||
<Grid.ChildrenTransitions>
|
||||
<TransitionCollection>
|
||||
<EntranceThemeTransition/>
|
||||
</TransitionCollection>
|
||||
</Grid.ChildrenTransitions>
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="140"/>
|
||||
<RowDefinition Height="*"/>
|
||||
</Grid.RowDefinitions>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition x:Name="primaryColumn" Width="420"/>
|
||||
<ColumnDefinition x:Name="secondaryColumn" Width="*"/>
|
||||
</Grid.ColumnDefinitions>
|
||||
|
||||
<!-- Back button and page title -->
|
||||
<Grid x:Name="titlePanel">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="120"/>
|
||||
<ColumnDefinition Width="*"/>
|
||||
</Grid.ColumnDefinitions>
|
||||
<Button x:Name="backButton" Margin="39,59,39,0" Command="{Binding NavigationHelper.GoBackCommand, ElementName=pageRoot}"
|
||||
Style="{StaticResource NavigationBackButtonNormalStyle}"
|
||||
VerticalAlignment="Top"
|
||||
AutomationProperties.Name="Back"
|
||||
AutomationProperties.AutomationId="BackButton"
|
||||
AutomationProperties.ItemType="Navigation Button"/>
|
||||
<TextBlock x:Name="pageTitle" Text="{Binding Title}" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1"
|
||||
IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" Margin="0,0,0,40"/>
|
||||
</Grid>
|
||||
|
||||
<!-- Vertical scrolling item list -->
|
||||
<ListView
|
||||
x:Name="itemListView"
|
||||
AutomationProperties.AutomationId="ItemsListView"
|
||||
AutomationProperties.Name="Items"
|
||||
TabIndex="1"
|
||||
Grid.Row="1"
|
||||
Margin="-10,-10,0,0"
|
||||
Padding="120,0,0,60"
|
||||
ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
|
||||
IsSwipeEnabled="False"
|
||||
SelectionChanged="ItemListView_SelectionChanged">
|
||||
<ListView.ItemTemplate>
|
||||
<DataTemplate>
|
||||
<Grid Margin="6">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="Auto"/>
|
||||
<ColumnDefinition Width="*"/>
|
||||
</Grid.ColumnDefinitions>
|
||||
<Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="60" Height="60">
|
||||
<Image Source="{Binding ImagePath}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
|
||||
</Border>
|
||||
<StackPanel Grid.Column="1" Margin="10,0,0,0">
|
||||
<TextBlock Text="{Binding Title}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="NoWrap" MaxHeight="40"/>
|
||||
<TextBlock Text="{Binding Subtitle}" Style="{StaticResource CaptionTextBlockStyle}" TextWrapping="NoWrap"/>
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
</DataTemplate>
|
||||
</ListView.ItemTemplate>
|
||||
<ListView.ItemContainerStyle>
|
||||
<Style TargetType="FrameworkElement">
|
||||
<Setter Property="Margin" Value="0,0,0,10"/>
|
||||
</Style>
|
||||
</ListView.ItemContainerStyle>
|
||||
</ListView>
|
||||
|
||||
|
||||
<!-- Details for selected item -->
|
||||
<ScrollViewer
|
||||
x:Name="itemDetail"
|
||||
AutomationProperties.AutomationId="ItemDetailScrollViewer"
|
||||
Grid.Column="1"
|
||||
Grid.RowSpan="2"
|
||||
Padding="60,0,66,0"
|
||||
DataContext="{Binding SelectedItem, ElementName=itemListView}"
|
||||
HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto"
|
||||
ScrollViewer.HorizontalScrollMode="Disabled" ScrollViewer.VerticalScrollMode="Enabled"
|
||||
ScrollViewer.ZoomMode="Disabled">
|
||||
|
||||
<Grid x:Name="itemDetailGrid" Margin="0,60,0,50">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto"/>
|
||||
<RowDefinition Height="Auto"/>
|
||||
<RowDefinition Height="*"/>
|
||||
</Grid.RowDefinitions>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="Auto"/>
|
||||
<ColumnDefinition Width="*"/>
|
||||
</Grid.ColumnDefinitions>
|
||||
|
||||
<Image Grid.Row="1" Margin="0,0,20,0" Width="180" Height="180" Source="{Binding ImagePath}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
|
||||
<StackPanel x:Name="itemDetailTitlePanel" Grid.Row="1" Grid.Column="1">
|
||||
<TextBlock x:Name="itemTitle" Margin="0,-10,0,0" Text="{Binding Title}" Style="{StaticResource SubheaderTextBlockStyle}"/>
|
||||
<TextBlock x:Name="itemSubtitle" Margin="0,0,0,20" Text="{Binding Subtitle}" Style="{StaticResource SubtitleTextBlockStyle}"/>
|
||||
</StackPanel>
|
||||
<TextBlock Grid.Row="2" Grid.ColumnSpan="2" Margin="0,20,0,0" Text="{Binding Content}" Style="{StaticResource BodyTextBlockStyle}"/>
|
||||
</Grid>
|
||||
</ScrollViewer>
|
||||
|
||||
<VisualStateManager.VisualStateGroups>
|
||||
|
||||
<!-- Visual states reflect the application's view state -->
|
||||
<VisualStateGroup x:Name="ViewStates">
|
||||
<VisualState x:Name="PrimaryView" />
|
||||
<VisualState x:Name="SinglePane">
|
||||
<Storyboard>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="primaryColumn" Storyboard.TargetProperty="Width">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="*"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="secondaryColumn" Storyboard.TargetProperty="Width">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemDetail" Storyboard.TargetProperty="Visibility">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemListView" Storyboard.TargetProperty="Padding">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="120,0,90,60"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
<!--
|
||||
When an item is selected and only one pane is shown the details display requires more extensive changes:
|
||||
* Hide the master list and the column it was in
|
||||
* Move item details down a row to make room for the title
|
||||
* Move the title directly above the details
|
||||
* Adjust padding for details
|
||||
-->
|
||||
<VisualState x:Name="SinglePane_Detail">
|
||||
<Storyboard>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="primaryColumn" Storyboard.TargetProperty="Width">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemListView" Storyboard.TargetProperty="Visibility">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemDetail" Storyboard.TargetProperty="(Grid.Row)">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemDetail" Storyboard.TargetProperty="(Grid.RowSpan)">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="titlePanel" Storyboard.TargetProperty="(Grid.Column)">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemDetailGrid" Storyboard.TargetProperty="Margin">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="0,0,0,60"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="itemDetail" Storyboard.TargetProperty="Padding">
|
||||
<DiscreteObjectKeyFrame KeyTime="0" Value="120,0,90,0"/>
|
||||
</ObjectAnimationUsingKeyFrames>
|
||||
</Storyboard>
|
||||
</VisualState>
|
||||
</VisualStateGroup>
|
||||
</VisualStateManager.VisualStateGroups>
|
||||
</Grid>
|
||||
</Page>
|
||||
Reference in New Issue
Block a user