setstate - 避免在项目选择上重建列表视图：Flutter

问题描述

我有 listview.builder 从 FutureBuilder 获取数据。当我按住任何列表项时，首先会再次重建整个列表视图，然后突出显示所选项目。我知道这是因为当为项目选择调用 setstate 并且再次运行构建方法时，未来的构建器也会获取导致此问题的数据。如何避免这种行为并且只突出显示所选项目而不重建整个列表视图？我不确定如何在我的代码中实现 Consumer？这是我的代码：

_onSelected(int index) {
    setState(() => _selectedIndex = index);
  }

 Color getColor( int index){
   if(light_mode)
     {
       if(_selectedIndex != null && _selectedIndex == index)
         return Color(0xFFFFB2FF);
       else
         return Color(0xFFFFFFFF);
     }
   else{
     if(_selectedIndex != null && _selectedIndex == index)
     return Color(0xFF8E8E8E);
     else
     return Color(0xFF6D6D6D);
     }
   }

 @override
  Widget build(BuildContext context)  {
    // TODO: implement build

    final makeBody = Container(
        decoration: BoxDecoration(
            color: light_mode ? Color(0xFFFFFFFF) : Color(0xFF6D6D6D)),
        child: setView()
    );
}

Widget setView() {
return FutureBuilder<List<Juz>>(
      future:  getSurahData(context),

      builder:( BuildContext context, AsyncSnapshot<List<Juz>> snapshot) {

        if (snapshot.connectionState == ConnectionState.waiting) {

          return Center(child: CircularProgressIndicator());
        }
        if ( snapshot.connectionState==ConnectionState.done) {
         // Center(child: CircularProgressIndicator( value: 0.5, valueColor: AlwaysStoppedAnimation<Color>(Colors.white)));
          //while(surahcountlist.isEmpty);
          return returnListview();
        }
        else  {
          return Text("error");
        }
      
    );}

 Widget returnListview(){
            return   Column(
                textDirection: TextDirection.rtl,
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                new Expanded(
                      child: SizedBox(
                         height: 200.0,
                        child: ListView.builder(
                            controller:   hiding.controller,

                         itemCount:surahcountlist.length,
                         itemBuilder: (context, index) {

                          return new GestureDetector( //You need to make my child interactive
                             onLongPress: () => _onSelected(index),
                           child: Card(
                              color: getColor(index),

                              child: Column(
                                  textDirection: TextDirection.rtl,
                                  mainAxisAlignment:
                                  MainAxisAlignment.start,
                                  crossAxisAlignment:
                                  CrossAxisAlignment.stretch,
                                  children: <Widget>[
                                    showBSMLSV(index),
                                    Wrap(
                                        direction: Axis.horizontal,
                                        alignment:
                                        WrapAlignment.start,
                                        runAlignment:
                                        WrapAlignment.center,
                                        textDirection:
                                        TextDirection.rtl,
                                        spacing: 2.0,
                                        // gap between adjacent chips
                                        runSpacing: 5.0,
                                        children: makeSurahListview(
                                            surahcountlist[index].surah_no,
                                            surahcountlist[index].ayah_no,
                                            surahcountlist[index].count)),
                                  ])));
                        }


                        ) ))
          ]);
    }

标签： setstateflutter-listviewflutter-futurebuilder

setstate - 避免在项目选择上重建列表视图：Flutter

问题描述

解决方案

推荐阅读