microsoft / microsoft-ui-xaml

Windows UI Library: the latest Windows 10 native controls and Fluent styles for your applications
MIT License
6.17k stars 667 forks source link

Question: equivalent to NavigationRail in FluentDesign #3662

Closed JochnGst closed 3 years ago

JochnGst commented 3 years ago

I have a WPF programm that use a RailNavigation on the left like MS Teams and want to port it to WinUI3.

What is the best/right way to get a navigation like this with WinUI/Fluent design? In best case with the option of this little badges. For programms with only a few pages this looks much better then the heavy NavigationView list

image

mdtauk commented 3 years ago

The NavigationView control is the WinUI Standard.

image

image

https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/navigationview

JochnGst commented 3 years ago

Ok, thank you for your quick response. Than I have to build a UserControll for my portation

robloo commented 3 years ago

@Rogardo Yes, you might need to quickly make your own UserControl to get the same look as pictured. However, the NavigatiokView can be significantly customized. You can turn off the settings, hamburger and back button. You can also keep the sidebar from expanding to full size. I suspect you could actually get pretty close to what you want with NavigationView. It might be better to use NavigationView for your initial port and only write your own control if that fails.

StephenLPeters commented 3 years ago

I think with navigation view you can get very close to what teams has, some differences would include the selection icon being on the right in navigation view and the left in teams. Maybe some of the colors, and the badge which would be adressed in a future update when #2963 is resolved

StephenLPeters commented 3 years ago

Closing the issue but feel free to post more questions if you have them and I'll reopen