Syncfusion Toolbar always starts in overflow mode when running application

[Kyle White]

Like the title says, we've been having this issue for a while where the SfToolbar at the top of our application will always start in overflow mode as if the window were sized for mobile.

Once the window size is made larger, it will stop overflowing and the toolbar works as normal.

When starting the application:

After window size change:

  

This is happening with OverflowMode set to both scroll and popup styles.

Any advice for how to debug this?

[Swathi Ravi]

Kyle,

We suspect that the toolbar styles are loading after the component rendering is finished, so we suggest you to make sure the Toolbar styles are loaded before the component rendering.

Regards,

Swathi Ravi

[Kyle White]

Sorry for the delay, do you have any recommendations for approaching this problem? I am not sure how to verify when the styles are loading.

[Swathi Ravi]

Kyle,

We require more additional details to check your reported problem at our end. Could you please share the below information to proceed further?

• Where the toolbar styles are loaded in your project.
• Share a snip of how it is referred to in your project.
• Is the toolbar rendered separately or inside any other component?

For example: If the Toolbar is rendering within the dialog, you need to call the Toolbar's RefreshAsync method on the Dialog Opened event to resolve this.

Api: https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Navigations.SfToolbar.html#Syncfusion_Blazor_Navigations_SfToolbar_RefreshAsync

https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Popups.DialogEvents.html#Syncfusion_Blazor_Popups_DialogEvents_Opened