Reputation: 75
I've been playing around with the Windows Fluent Design system for a little while now, and I've noticed an element Microsoft docs use as an example for freeform footer content within the navigation view.
link to Microsoft Documentation page
this is obviously a user menu possibly intended for the use of managing account settings etc. from within the app.
looking at the "Top pane footer" example, you can see they use the windows default account image, which to my limited knowledge is not an actual "Segoe MDL2" icon of which these navigation elements utilize (side note, the "left pane footer" uses a more simple image).
This brings me to my question:
How do I go about recreating this and utilize external images (such as the user PFP) within the navigation view?
I am currently playing with the idea of using an image within the navigation item as shown below:
</NavigationViewItem>
<Ellipse Width="25" Height="25">
<Ellipse.Fill>
<ImageBrush x:Name="image"/>
</Ellipse.Fill>
</Ellipse>
</NavigationViewItem>
this is incredibly close to what I want and looks fine with the navigation view open, however the image gets pushed over a little too far and is not centered correctly when minimizing the navigation view. I've thought about overriding the icon image with the user image however I have absolutely no idea how I would go about that.
I have also opened a thread on r/ProgrammingHelp. (In the event that someone on the subreddit answers this, I will add an answer with the link to the solution for your convenience :P)
Upvotes: 0
Views: 221