search

Kinnara / ModernWpf

Modern styles and controls for your WPF applications
MIT License
4.5k stars 448 forks source link

HamburgerMenu as AcrylicPanel #27

Open ghost opened 4 years ago

ghost commented 4 years ago

Hi, I wondered how to improve the appearance of HamburgerMenu. I tried to put AcrylicPanel from FluentWPF into HamburgerMenu and still other elements like Reveal. I tried it on my project and it looks pretty good. see picture or video https://vimeo.com/387566029, https://vimeo.com/387566695 bandicam 2020-01-27 23-56-31-505

bandicam 2020-01-27 23-55-54-506

Kinnara commented 4 years ago

Looks great. This could be part of the FluentWPF integration sample.

ghanimekki commented 4 years ago

Hello, Can you please share your code ? I'm trying to achieve the same effect, but unable too.

Thank you !

NickAcPT commented 4 years ago

+1 from me. It would make it even more realist than it already is. Would be nice if it were possible to enable/disable on all currently supported controls.

ghost commented 4 years ago

Hey @Kinnara @ghanimekki @NickAcPT, sorry for the late reply. Just add AcrylicPanel to the HamburgerMenu style or now to the newer NavigationView and set the Target to ContentGrid. For Reveal, I used either RevealBrush from FluentWPF or FluentCotrol from Telerik. Now I've tried it in NavigationView and it looks good. I will try to do some small demonstration of the program as soon as possible.

<acrylicControls:AcrylicPanel Target="{Binding ElementName=ContentGrid}" TintOpacity="0.3" TintColor="{DynamicResource SystemChromeMediumColor}" NoiseOpacity="0.025"> <Rectangle Fill="{DynamicResource NavigationViewExpandedPaneBackground}" Opacity="0.2"/> </acrylicControls:AcrylicPanel>

gif18 gif19

P.S. even now we can do even Accent Acrylic Menu gif20

AccentAcrylicMenu with gradient color

gif21

Top AccentAcrylicMenu with gradient color img01 img03 img02

kalatchev commented 4 years ago

@ORRNY66 Could you please share with us code snippet? How exactly you change the style of NavView?

Andrew24673 commented 4 years ago

@ORRNY66 Hi, can you share the source code of NavigationView?

ghost commented 4 years ago

@Andrew24673 @kalatchev I'm sorry I forgot. Here I attach the source code, it's created quickly, so it's not entirely ideal it needs some more editing. https://drive.google.com/file/d/1KebJWYT_YvVoUEXPN8eUhgI3VWSpJoHW/view?usp=sharing

RaoHammas commented 4 years ago

@ORRNY66 Thanks it would be helpful for some people. And @Kinnara it would be great if we can by default merge Fluent WPF into this Modern WPF and just somehow simplify things and give IsFluentEnable = True/False option ?

Andrew24673 commented 4 years ago

@ORRNY66 Can you explain how to replace the sidebar buttons with Reveal? The navigationview source code is very large, spent all day yesterday trying to figure it out, but it didn't work. I would be grateful for any help