Improve PaneToggleButtonVisibility behavior

Progress® Telerik® UI for WPF Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Completed

Last Updated: 31 Mar 2020 10:52 by ADMIN

Release LIB 2020.1.330 (03/30/2020)

Olivier

Created on: 18 Mar 2020 13:35

Category: NavigationView

Type: Feature Request

Improve PaneToggleButtonVisibility behavior

Hello,

I would like to hide the pane toggle button. Consequently I set the PaneToggleButtonVisibility to "Collapsed" but I get the same render as I set "Hidden".

That would be nice if this space no longer exists when we set the property to collapsed.

The code sample I used:

<telerik:RadNavigationView x:Name="navigationView" PaneToggleButtonVisibility="Collapsed">
    <telerik:RadNavigationView.Items>
        <telerik:RadNavigationViewItem Content="Foo">
            <telerik:RadNavigationViewItem.Icon>
                <telerik:RadGlyph Glyph="&#xe13a;" FontSize="20" />
            </telerik:RadNavigationViewItem.Icon>
        </telerik:RadNavigationViewItem>
    </telerik:RadNavigationView.Items>
</telerik:RadNavigationView>

Thanks,

3 comments

ADMIN

Vicky

Posted on: 31 Mar 2020 10:52

Hello Olivier,

If setting the PaneToggleButtonVisibility to Collapsed automatically leads to setting the PaneHeaderHeight to 0, this will result in the PaneHeader no longer being visible as well:

The suggested by you improvement would only be applicable for scenarios where the PaneHeader is null or not needed.

The mentioned issue with the border named HeaderBackground, shown when the control is in its Minimal mode is already implemented and will be part of the next LIB, scheduled for the beginning of next week. With the fix, setting both PaneToggleButtonVisibility to Collapsed and PaneHeaderHeight to 0, you will be able to achieve the desired look and feel.

Best Regards,
Vicky
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.

Olivier

Posted on: 24 Mar 2020 10:58

Hello Vicky,

That's works for me thanks!
A possible improvement could be to set automatically the PaneHeaderHeight to 0 when the property is "collapsed".

Regards,

ADMIN

Vicky

Posted on: 19 Mar 2020 09:43

Hi Olivier,

Thanks a lot for the provided resources.

The header area of the NavigationView control consists of the PaneToggleButton and the PaneHeader elements. This means that if the needed end result is to hide the whole area, you need to take care of both elements. Setting the PaneToggleButtonVisibility to Collapsed/Hidden only hides the button, yet the header remains visible and that's the reason why the space is kept.

To hide the header area, two things need to be done - setting PaneToggleButtonVisibility to Collapsed and the PaneHeaderHeight to 0. Following this approach, you may notice a small issue when the control is in its Minimal mode - there is a special border named HeaderBackground which is shown only in this mode. This issue is already brought to the attention of the development team and will be part of the next LIB, scheduled for the beginning of next week. With the fix, the end result when the control is in Minimal mode will look like the following image:

Please, try out the above suggestions and let me know if they deliver the desired result. I am looking forward to your reply.

Regards,
Vicky
Progress Telerik

Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.