Click here to Skip to main content
16,020,188 members
Search within:


How to make page navigate on dashboard sidebar menu button click ...
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
C#
WPF
 
<Grid>
               <StackPanel HorizontalAlignment="Left" Width="228" Margin="0,100,0,0">
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel>
                           <StackPanel Orientation="Horizontal">
                               <Image Source="dashboard (1).png" Margin="20,0,0,0" Width="56" Height="45"/>
                               <Button x:Name="Dasboard" Content="Dashboard"  VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" Height="45" HorizontalContentAlignment="Center" VerticalContentAlignment="Top" Background="{x:Null}"  Click="Dasboard_Click"/>
                           </StackPanel>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="scrum.png" Margin="20,0,0,0" Width="56" Height="45"/>
                           <Button Content="Master"  VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" Height="45" HorizontalContentAlignment="Center" VerticalContentAlignment="Top" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="inventory (1).png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Inventory" Content="Inventory" VerticalAlignment="Top"  FontWeight="Bold" FontSize="18" Padding="15,12,0,0"  Width="145" HorizontalAlignment="Center" Foreground="White" VerticalContentAlignment="Top" Height="45" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="salary.png" Margin="20,0,0,0" Width="55"/>
                           <Button x:Name="Payroll" Content="Payroll" VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" VerticalContentAlignment="Top" Height="45" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="report (1).png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Reports" Content="Reports" VerticalAlignment="Center"  FontWeight="Bold" FontSize="18" Padding="15,12,0,0"  Width="145" HorizontalAlignment="Left" Foreground="White" VerticalContentAlignment="Top" Height="46" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="settings.png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Settings" Content="Settings" VerticalAlignment="Center" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Left" Foreground="White" Height="45" VerticalContentAlignment="Top" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
               </StackPanel>
               <DatePicker HorizontalAlignment="Left" Height="50" Margin="42,0,0,50" VerticalAlignment="Bottom" Width="160" Foreground="Black" Background="White" FontWeight="Bold"/>
           </Grid>


What I have tried:



<Grid>
               <StackPanel HorizontalAlignment="Left" Width="228" Margin="0,100,0,0">
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel>
                           <StackPanel Orientation="Horizontal">
                               <Image Source="dashboard (1).png" Margin="20,0,0,0" Width="56" Height="45"/>
                               <Button x:Name="Dasboard" Content="Dashboard"  VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" Height="45" HorizontalContentAlignment="Center" VerticalContentAlignment="Top" Background="{x:Null}"  Click="Dasboard_Click"/>
                           </StackPanel>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="scrum.png" Margin="20,0,0,0" Width="56" Height="45"/>
                           <Button Content="Master"  VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" Height="45" HorizontalContentAlignment="Center" VerticalContentAlignment="Top" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="inventory (1).png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Inventory" Content="Inventory" VerticalAlignment="Top"  FontWeight="Bold" FontSize="18" Padding="15,12,0,0"  Width="145" HorizontalAlignment="Center" Foreground="White" VerticalContentAlignment="Top" Height="45" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="salary.png" Margin="20,0,0,0" Width="55"/>
                           <Button x:Name="Payroll" Content="Payroll" VerticalAlignment="Top" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Center" Foreground="White" VerticalContentAlignment="Top" Height="45" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="report (1).png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Reports" Content="Reports" VerticalAlignment="Center"  FontWeight="Bold" FontSize="18" Padding="15,12,0,0"  Width="145" HorizontalAlignment="Left" Foreground="White" VerticalContentAlignment="Top" Height="46" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
                   <Grid Height="45" Margin="0 20 0 0">
                       <StackPanel Orientation="Horizontal">
                           <Image Source="settings.png" Margin="20,0,0,0" Width="54" Height="36"/>
                           <Button x:Name="Settings" Content="Settings" VerticalAlignment="Center" FontWeight="Bold" FontSize="18" Padding="15,12,0,0" Width="145" HorizontalAlignment="Left" Foreground="White" Height="45" VerticalContentAlignment="Top" Background="{x:Null}"/>
                       </StackPanel>
                   </Grid>
               </StackPanel>
               <DatePicker HorizontalAlignment="Left" Height="50" Margin="42,0,0,50" VerticalAlignment="Bottom" Width="160" Foreground="Black" Background="White" FontWeight="Bold"/>
           </Grid>
Posted
Updated 2-Sep-22 2:20am
Add a Solution

1 solution

This is a great tutorial that will answer this question and more: Switching Views - WPF MVVM NAVIGATION TUTORIAL #1 - YouTube[^]

[Update] This may be exactly what you are looking for: Sidebar Navigation In WPF - YouTube[^] with full source code in the description.
 
Share this answer
 
Posted
Updated 2-Sep-22 21:21pm
v2
Add a Solution

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month
Related Questions
Dashboard layout not looking good using bootstrap
Trigger click event for multiple navigation menu
MAUI facing issue regarding page navigation
Navbar menu are not showing and menu are not toggle when clicking button
MAUI C# implement activity indicator before navigating to next page
Master page left Navigation menu
Expand navigation menu
Master Page Image Menu Navigation
Flash in navigation menu
dropdown menu on a dashboard page...

Advertise
Privacy
Cookies
Terms of Use
Last Updated 3 Sep 2022
Layout: fixed | fluid
Copyright © CodeProject, 1999-2024
All Rights Reserved.

Web02 2.8:2024-07-22:1

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900