Hello Radzen Community,
I want to share a basic project I recently published on GitHub: TabMenuComponent-Blazor-Razor. This component aims to enhance user navigation within Blazor applications by providing a tab-based interface. Here are some key points Iβd like to highlight:
Purpose and Vision
- Sharing with the Community: After finding this concept useful in my own project, I wanted to share it with the Radzen community.
- Room for Improvement: I am not an expert in designing components like this, so there may be errors.
- Future Enhancements: There are many aspects of the component that need further development, such as adding more customization options, reordering tabs, saving the last position, and reloading it in new sessions.
- Hope for Future Integration: It would be great to see a similar component in the Radzen component library in the future.
How the Component Works
- Default Page: When the application is accessed, the Index page is displayed with the name assigned to the DefaultPage property of the component.
- Adding New Tabs: When new pages are selected from the menu, new tabs are added to the TabMenuComponent. Unlike the DefaultPage, these tabs have a close button (x).
- Switching Tabs: Clicking on an open tab displays the previously opened page.
- Closing Tabs: Clicking the (x) button closes the tab.
Files to use
All the files are under the Components folder.
TabService.cs: Main functions.(Register on the Program.cs)
TabComponent.razor(.cs): Visuals of the component and screen functions. (Add to MainLayout)
css/tab-component.css: The CSS file for the component. (move it to wwwroot/css folder and add _Loayout.cshtml -or similar others-)
I look forward to your feedback and suggestions for improving this component.
Best regards,
BaΕar Koksal