Anchor Nav for Flow
Organizes content sections with tabs and provides anchor navigation while linking the tabs and sections
<vcf-anchor-nav> component organizes content sections with tabs and provides anchor navigation while linking the tabs and sections
Basic Usage
AnchorNav anchorNav = new AnchorNav();
anchorNav.setHeight("400px");
anchorNav.addSection(new Span("Section 1"));
anchorNav.addSection(new Span("Section 2"));
Development instructions
Starting the test/demo server:
- Run
mvn jetty:run
. - Open http://localhost:8080 in the browser.
Sponsored development
Major pieces of development of this add-on has been sponsored by multiple customers of Vaadin. Read more about Expert on Demand at: Support and Pricing
Sample code
AnchorNav anchorNav = new AnchorNav(); anchorNav.setHeight("400px"); anchorNav.addSection(new Span("Section 1")); anchorNav.addSection(new Span("Section 2"));
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Added a "noHistory" property to disable browser history within a view.
- Released
- 2023-06-13
- Maturity
- EXPERIMENTAL
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 23+
- Vaadin 14+ in 1.0.0
- Browser
- Browser Independent
Anchor Nav for Flow - Vaadin Add-on Directory
Organizes content sections with tabs and provides anchor navigation while linking the tabs and sections[Live Demo ↗](https://incubator.app.fi/anchor-nav-demo/anchor-nav)
[<vcf-anchor-nav>](https://www.npmjs.com/package/@vaadin-component-factory/vcf-anchor-nav) component organizes content sections with tabs and provides anchor navigation while linking the tabs and sections
## Basic Usage
```java
AnchorNav anchorNav = new AnchorNav();
anchorNav.setHeight("400px");
anchorNav.addSection(new Span("Section 1"));
anchorNav.addSection(new Span("Section 2"));
```
## Development instructions
Starting the test/demo server:
1. Run `mvn jetty:run`.
2. Open http://localhost:8080 in the browser.
## Sponsored development
Major pieces of development of this add-on has been sponsored by multiple customers of Vaadin. Read more about Expert on Demand at: [Support](https://vaadin.com/support) and [Pricing](https://vaadin.com/pricing)