【重磅发布】flutter_chen_azlist - A–Z索引列表

Language: English | 中文简体

flutter_chen_azlist

Flutter 城市列表/联系人列表组件(支持悬停头与A--Z索引)。基于 scrollable_positioned_list

功能特性

  • 快速构建城市/联系人列表界面
  • 列表项按 A--Z 分组并支持悬停(可浮动)
  • 支持自定义 Header 与索引联动
  • IndexBar 支持自定义样式与本地图片
  • 支持滚动/跳转到指定条目
  • 索引交互可选触觉反馈(haptic feedback)

兼容性

  • Dart:>= 3.0.0 < 4.0.0
  • Flutter:推荐 3.x

安装

yaml 复制代码
dependencies:
  flutter_chen_azlist: ^3.0.0

快速开始

dart 复制代码
import 'package:flutter/material.dart';
import 'package:flutter_chen_azlist/flutter_chen_azlist.dart';

class City extends ISuspensionBean {
  City(this.name, this.tag);
  final String name;
  final String tag;
  @override
  String getSuspensionTag() => tag;
}

class DemoPage extends StatelessWidget {
  DemoPage({super.key});

  final List<City> cities = [
    City('北京', 'B'),
    City('上海', 'S'),
    City('深圳', 'S'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('AzListView Demo')),
      body: AzListView(
        data: cities,
        itemCount: cities.length,
        itemBuilder: (context, i) => ListTile(title: Text(cities[i].name)),
        susItemBuilder: (context, i) => Container(
          height: 40,
          padding: const EdgeInsets.symmetric(horizontal: 16),
          alignment: Alignment.centerLeft,
          child: Text(cities[i].getSuspensionTag()),
        ),
        indexBarOptions: const IndexBarOptions(hapticFeedback: true),
      ),
    );
  }
}

截图

示例

完整示例见 example/ 目录:

  • 运行:cd example && flutter run

Thanks

azlistview

许可

使用 MIT 协议,参见 LICENSE

相关推荐
程序员老刘·14 小时前
Flutter版本选择指南:避坑3.27 | 2025年9月
flutter·跨平台开发·客户端开发
懒得不想起名字16 小时前
Flutter二维码的生成和扫描
flutter
鹏多多17 小时前
flutter-详解控制组件显示的两种方式Offstage与Visibility
前端·flutter
猪哥帅过吴彦祖1 天前
Flutter 系列教程:常用基础组件 (上) - `Text`, `Image`, `Icon`, `Button`
android·flutter·ios
恋猫de小郭1 天前
Fluttercon EU 2025 :Let's go far with Flutter
android·前端·flutter
小李飞刀李寻欢1 天前
flutter 详细解读
flutter
QQ12958455042 天前
错误解决:Flutter找不到合适的Visual Studio 工具链
flutter·visual studio
程序员老刘2 天前
Flutter版本选择指南:避坑3.27 | 2025年9月
flutter·客户端
清风细雨_林木木2 天前
flutter 里面的渐变色设置
前端·flutter
猪哥帅过吴彦祖2 天前
Flutter 系列教程:布局基础 (下) - Stack 绝对定位和 Expanded 弹性布局
前端·flutter·ios