Flutter中如何从Firebase获取随机排序的用户列表？

从Firebase读取用户列表并渲染到ListTile组件中，但默认获取的数据是按字母顺序排列的，希望实现随机排序，该如何修改现有代码？

原代码：

FutureBuilder(
  future: FirebaseFirestore.instance
      .collection('users')
      .get(),
  builder: (context, snapshot) {
    if (!snapshot.hasData) {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }
    return ListView.builder(
      itemCount: (snapshot.data! as dynamic).docs.length,
      padding: EdgeInsets.zero,
      itemBuilder: (context, index) {
        return InkWell(
          onTap: (){},
          child: ListTile(
            leading: CircleAvatar(
              backgroundImage: NetworkImage(
                (snapshot.data! as dynamic).docs[index]['photoUrl'],
              ),
              radius: 30,
            ),
            trailing: ClipOval(
              child: Container(
                width: 10,
                height: 10,
                color: Colors.green,
              ),
            ),
            title: Text(
              (snapshot.data! as dynamic).docs[index]['username'], style: TextStyle(color: Colors.white, fontSize: 20),
            ),
            subtitle: Text((snapshot.data! as dynamic).docs[index]['bio'],style: TextStyle(color: Colors.white70,fontSize: 14,)),
          ),
        );
      },
    );
}

核心是拿到Firebase返回的文档列表后，先对列表执行随机打乱操作，再基于打乱后的列表渲染UI。具体修改如下：

1. 复制文档列表并调用shuffle()方法打乱顺序（用List.from()复制是为了避免修改原数据源，若不需要保留原数据，直接调用snapshot.data!.docs.shuffle()也可）。
2. 基于打乱后的列表构建ListView，同时优化类型转换逻辑提升代码可读性。

修改后的完整代码：

FutureBuilder(
  future: FirebaseFirestore.instance
      .collection('users')
      .get(),
  builder: (context, snapshot) {
    if (!snapshot.hasData) {
      return const Center(
        child: CircularProgressIndicator(),
      );
    }
    // 复制文档列表并随机打乱
    final userDocs = List.from(snapshot.data!.docs);
    userDocs.shuffle();
    
    return ListView.builder(
      itemCount: userDocs.length,
      padding: EdgeInsets.zero,
      itemBuilder: (context, index) {
        // 提取当前用户数据，简化后续调用
        final userData = userDocs[index].data() as Map<String, dynamic>;
        return InkWell(
          onTap: (){},
          child: ListTile(
            leading: CircleAvatar(
              backgroundImage: NetworkImage(userData['photoUrl']),
              radius: 30,
            ),
            trailing: ClipOval(
              child: Container(
                width: 10,
                height: 10,
                color: Colors.green,
              ),
            ),
            title: Text(
              userData['username'], 
              style: TextStyle(color: Colors.white, fontSize: 20),
            ),
            subtitle: Text(
              userData['bio'],
              style: TextStyle(color: Colors.white70, fontSize: 14),
            ),
          ),
        );
      },
    );
}

内容的提问来源于stack exchange，提问作者Hüseyin Çavuş