NavigationItem Background

[Michael Lutz]

Hello, I am pretty new to WPF template and style methods. Since I am not into C# but into vb.net, it is hard for me to find usage in provided sample projects. I am try to complete a probably simple task but can't find a working path.

I want to have the entire background of a selected Item colored and not just the small colored space left to the control.

Further more I want to change the background color of the togglebutton.

Thanks for any hint or sample.

[Brundha Velusamy]

Hi Michael,

Query 1: I want to have the entire background of a selected item colored and not just the small colored space left to the control.

Could you please share detailed information about your requirement, such as an image or video illustrating the customization of the selection item color based on your requirement?. This will be helpful for us to assist you further and provide a possible solution at earliest.

Query 2: I want to change the background color of the togglebutton.

Currently, we don't have support for the ToggleButton background color in SfNavigationDrawer. We have already created a feature request for the required behaviour "Provide Background property for ToggleButton in SfNavigationDrawer  " in WPF SfNavigationDrawer. Please find the below link for tracking the status of the feature implementation.

Feedback link: https://www.syncfusion.com/feedback/42757/provide-background-property-for-togglebutton-in-sfnavigationdrawer

Please cast your vote to make it count. We will prioritize the features every release based on the demands and we do not have an immediate plan to implement this feature since we have committed to already planned work. So, this feature will be available in any of our upcoming releases.

If you have any more specifications/suggestions for the feature request, you can add them as a comment in the portal. We will share the release details in the feedback itself.

We suggest a workaround to utilize the ToggleButtonIconTemplate property for customizing the Toggle button background color as shown in the code snippet. We have created the sample based on this and attached the sample for your reference. Please check the attached sample and let us know if you need any other details.

Please refer the below code snippet for this,

<syncfusion:SfNavigationDrawer DrawerBackground="LightYellow"

    x:Name="navigationDrawer"

    DisplayMode="Expanded"

    ItemContainerStyle="{StaticResource ItemStyle}"

    ItemsSource="{Binding Items}">   

    <syncfusion:SfNavigationDrawer.ToggleButtonIconTemplate>

        <DataTemplate>

            <Button

                x:Name="hamburgerButton"

                Width="40"

                Height="40"

                HorizontalAlignment="Left"

                Background="Red"

                BorderBrush="Transparent"

                Click="HamburgerButton_Click">

               …

            </Button>

        </DataTemplate>

    </syncfusion:SfNavigationDrawer.ToggleButtonIconTemplate>

    …

</syncfusion:SfNavigationDrawer>

Regards,

Brundha V

Attachment: NavigationDrawerSample_11b6bb58.zip