The Hamburger-style SplitView control in the Universal Windows Platform is perfect, IMO. However, my project has a WPF frontend.
Does anybody know of a WPF equivalent to this (preferably open source)?
The HamburgerMenu Control provides an easy-to-use, side-bar menu which users can show or hide by using a Hamburger button. By tapping the icon, it opens up a side menu with a selection of options or additional pages.
A hamburger menu is an icon used on a website and in apps that, when clicked or tapped, opens a side menu or navigation drawer. It's called a “hamburger menu” because it takes the form of the famous sandwich.
Using the GridSplitter control and a StoryBoard, you can set this up quite easily. You may need to tweak this code a bit to make it appear like the hamburger, but this should get you well on your way.
<UserControl
x:Class="Namespace.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Name="mainPage">
<Grid>
<Grid.Resources>
<Storyboard x:Name="CloseLeft">
<DoubleAnimation x:Name="animNavLinksClose"
Storyboard.TargetName="mainPage" Storyboard.TargetProperty="NavLinksWidth"
To="0.0" Duration="00:00:00.2" />
</Storyboard>
<Storyboard x:Name="OpenLeft">
<DoubleAnimation x:Name="animNavLinksOpen"
Storyboard.TargetName="mainPage" Storyboard.TargetProperty="NavLinksWidth"
From="0" To="170" Duration="00:00:00.2" />
</Storyboard>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="170" x:Name="NavLinksColumn" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid x:Name="grdNavLinks" Grid.Column="0">
<!-- Navigation Buttons -->
</Grid>
<GridSplitter x:Name="spltNavLinks" Grid.Column="1" />
<Grid x:Name="contentSection" Grid.Column="2">
<!-- Content or Frame -->
</Grid>
</Grid>
</UserControl>
Then you can call your storyboard from the code-behind like this
// Begin Opening Animation
OpenLeft.Begin();
// Begin Closing Animation
CloseLeft.Begin();
Another implementation to study is https://github.com/alicanerdogan/HamburgerMenu
There is really nice one in MahappsMetro now
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With