tolyui_anchor 0.0.1 copy "tolyui_anchor: ^0.0.1" to clipboard
tolyui_anchor: ^0.0.1 copied to clipboard

Flutter 锚点导航组件,支持索引级滚动控制、双向联动、自定义样式、横向导航和大数据量虚拟滚动。适用于文档阅读、设置面板、目录导航等场景。

tolyui_anchor #

A powerful anchor component for TolyUI based on scrollable_positioned_list.

Features #

  • Precise Navigation: Based on scrollable_positioned_list for accurate scrolling to specific indices
  • Scroll Spy: Automatically syncs active menu state with scroll position
  • Smooth Animation: Smooth scroll animations with customizable duration and curve
  • Lock Mechanism: Prevents highlight flickering during scroll animations

Getting Started #

Add this to your package's pubspec.yaml file:

dependencies:
  tolyui_anchor:
    path: modules/navigation/tolyui_anchor

Usage #

1. Create a Controller #

final TolyAnchorController _controller = TolyAnchorController();
final List<TolyAnchorLink> _links = const [
  TolyAnchorLink(title: 'Section 1', href: 'section1'),
  TolyAnchorLink(title: 'Section 2', href: 'section2'),
  TolyAnchorLink(title: 'Section 3', href: 'section3'),
];

3. Build the UI #

Row(
  children: [
    // Left: Navigation
    Container(
      width: 160,
      child: TolyAnchor(
        controller: _controller,
        links: _links,
      ),
    ),
    // Right: Content
    Expanded(
      child: TolyAnchorScrollable(
        controller: _controller,
        itemCount: _links.length,
        itemBuilder: (context, index) {
          return YourSectionWidget(index);
        },
      ),
    ),
  ],
)

4. Clean Up #

@override
void dispose() {
  _controller.dispose();
  super.dispose();
}

API #

TolyAnchorController #

  • scrollToIndex(int index) - Scroll to a specific index with animation
  • scrollTo(String tag) - Scroll to a specific tag (for compatibility)
  • jumpToIndex(int index) - Jump to index without animation
  • activeIndex - Current active index
  • itemScrollController - Access to underlying ItemScrollController
  • itemPositionsListener - Access to underlying ItemPositionsListener

TolyAnchor #

  • controller - The controller to use
  • links - List of navigation links
  • linkBuilder - Custom builder for navigation items

TolyAnchorScrollable #

  • controller - The controller to use
  • itemCount - Number of items
  • itemBuilder - Builder function for items
0
likes
130
points
35
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

Flutter 锚点导航组件,支持索引级滚动控制、双向联动、自定义样式、横向导航和大数据量虚拟滚动。适用于文档阅读、设置面板、目录导航等场景。

Homepage
Repository (GitHub)
View/report issues

License

MIT (license)

Dependencies

collection, flutter

More

Packages that depend on tolyui_anchor