Question

我想更新在futurebuilder中创建的列表视图，我想在更改滑块时更新它

FlutterSlider(
          values: [150],
          min: 0,
          max: 150,

          onDragging: (handlerIndex, lowerValue, upperValue) {
            radius = upperValue;
            users.clear();
            fut = _gdb.getUsersInRadius(radius);
          },
        ),

futurebuilder的代码和列表视图

Expanded(
          child: FutureBuilder(
            future: fut,
            builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
              if(!snapshot.hasData && snapshot.connectionState == ConnectionState.done){
                return Center(
                    child: Text("No users"));
                   }else if(snapshot.connectionState == ConnectionState.waiting){
                return SpinKitWave(color: Theme.of(context).primaryColor);
              }
              return StreamBuilder(
                stream: snapshot.data,
                builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
                  if(!snapshot.hasData){
                    return Center(
                        child: SpinKitWave(
                          color: Theme.of(context).primaryColor,
                        ));
                       }else{
                         print(snapshot.data.length);
                         users.addAll(snapshot.data);
                         return ListView.builder(
                             controller: _scrollController ,
                             itemCount: users.length,
                             itemBuilder: (BuildContext ctx, int index){

                                 return GestureDetector(
                                   onTap: (){
                                    Navigator.pushNamed(context, '/userWidget', arguments: users[index]);
                                   },
                                   child: Card(
                                     child: Column(
                                       children: [
                                         Text(users[index].data['username']),
                                         FutureBuilder(
                                           future: FirebaseStorage.instance.ref().child('profilepics').child('${users[index].documentID}.jpg').getDownloadURL(),
                                           builder: (BuildContext context, AsyncSnapshot<dynamic> snapshot) {
                                             if(!snapshot.hasData){
                                               return CircleAvatar();
                                             }
                                             return CircleAvatar(backgroundImage: NetworkImage(snapshot.data) ,) ;//.network(snapshot.data)
                                           },
                                         ),
                                         Text(users[index].data['city'] == null ? "No city" : users[index].data['city'] )
                                       ],
                                     ),
                                   ),
                                 );
                             });
                       }
                     },
                   );
                 },
               ),
             )

当用户更改滑块的值时，附近的新用户将被加载到列表视图中，而旧用户将被删除使用Geoflutterfire从Firestore下载用户，

Answer 1

在进行setState时只需调用fut = _gdb.getUsersInRadius(radius);

关于滑块部分

FlutterSlider(
          values: [sliderValue], // initialize it with 150
          min: 0,
          max: 150,

      onDragging: (handlerIndex, lowerValue, upperValue) {
        radius = upperValue;
        users.clear();
        setState(){(){
            sliderValue = upperValue; // update it like this.
            fut = _gdb.getUsersInRadius(radius);
        }}


      },
    ),

颤振如何在FutureBuilder中更新ListView

1 个答案: