图像中的边框onTap

时间:2019-02-28 23:42:51

标签: flutter

我正在尝试在我点击的图像上放置边框,并从GridView上的其他边框中删除边框,但是我不知道该怎么做。 我已在保存图像的容器中放置了一个手势检测器,单击时应输入边框,但我希望其他图像的边框像选择一样消失。

class ImageTile extends StatelessWidget {
  final ImageLessonData imageLessonData;
  final String collection;
  static bool tapped = false;
  static bool other = true;

  ImageTile(this.imageLessonData, this.collection);

  @override
  Widget build(BuildContext context) {

    return Material(
      child: GestureDetector(
        child: FutureBuilder<QuerySnapshot>(
            future: Firestore.instance.collection("images-lessons").document("images").collection(collection).getDocuments(),
            builder: (context, snapshot){
              if(!snapshot.hasData){
                return Center(child: CircularProgressIndicator(),);
              }
              else {
                return GridView.count(
                  crossAxisCount: 1,
                  children: snapshot.data.documents.map((doc){
                    return GridView(
                      gridDelegate:  SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
                      children: <Widget>[
                        GestureDetector(
                          onTap: (){
                            tapped = true;
                            other = false;
                          },
                          child: Container(
                            decoration: BoxDecoration(border: tapped || !other ? Border.all(color: Colors.black, width: 1.0) : Border.all(color: Colors.transparent,),),
                            child: Image.network(doc.data["imageL"][0],),
                          ),
                        ),
                        GestureDetector(
                          onTap: (){
                            tapped = false;
                            other = true;
                          },
                          child: Container(
                            decoration: BoxDecoration(border: !tapped || other ? Border.all(color: Colors.black, width: 1.0) : Border.all(color: Colors.transparent,),),
                            child: Image.network(doc.data["imageL"][1],),
                          ),
                        ),
                        GestureDetector(
                          onTap: (){
                            tapped = true;
                            other = false;
                          },
                          child: Container(
                            decoration: BoxDecoration(border: tapped || !other ? Border.all(color: Colors.black, width: 1.0) : Border.all(color: Colors.transparent,),),
                            child: Image.network(doc.data["imageL"][2],),
                          ),
                        ),
                        GestureDetector(
                          onTap: (){
                            tapped = true;
                            other = false;
                          },
                          child: Container(
                            decoration: BoxDecoration(border: tapped || !other ? Border.all(color: Colors.black, width: 1.0) : Border.all(color: Colors.transparent,),),
                            child: Image.network(doc.data["imageL"][3],),
                          ),
                        ),
                      ],
                    );
                  }).toList() ,);
              }
            }),
      ),
    );
  }
}

1 个答案:

答案 0 :(得分:1)

我想知道您是否同时需要df.melt(id_vars='age').groupby(['variable', 'value']).mean() tapped

您可以试试吗? other将跟踪当前选择。

tappedGestureDetector