Блог

Привет, я работаю над проектом Flutter, у меня возникла проблема с кнопкой flutter ListView, поэтому сейчас она выглядит так же, как я хотел, но работает не так, как я хотел

Итак, если вы видите изображение выше, если я нажимаю, затем появляется галочка overlay, для этого мне нужно setState(), но проблема в том, что прямо сейчас, чтобы получить эту галочку overlay, мне нужно нажать дважды, я не понимаю, как исправить эту проблему или есть какая-нибудь кнопка виджета, которую я проверял чаще всего их, но большинство из них не работали или я не знал об этом? Внутри контейнера у меня есть 14 одинаковых столбцов с номерами 1-14, я сделаю его более компактным, но сначала мне нужно исправить эту проблему, вот код.

 `bool _pressed = false;
 int _btnIndex = 0;
 TabBarView(children: <Widget>[
    Container(
      height: 300,
      // padding: EdgeInsets.only(bottom: 10),
      padding: EdgeInsets.all(10),
      color: Colors.white,
      child: ListView(
      padding: EdgeInsets.all(6),
      scrollDirection: Axis.horizontal,
      children: <Widget>[
        Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            Container(
              alignment: Alignment.center,
              child: Padding(
                padding: const EdgeInsets.all(6.0),
                child: Material(
                  elevation: 4.0,
                  shape: CircleBorder(),
                  clipBehavior: Clip.hardEdge,
                  color: !_pressed amp;amp; _btnIndex == 1
                      ? Colors.red
                      : Colors.white54,
                  child: Ink.image(
                    image: AssetImage('assets/images/colosseum.jpg'),
                    fit: BoxFit.cover,
                    colorFilter: _pressed amp;amp; _btnIndex == 1
                        ? ColorFilter.mode(
                            Colors.black87,
                            BlendMode.darken,
                          )
                        : null,
                    width: 60.0,
                    height: 60.0,
                    child: InkWell(
                      // splashColor: Colors.green,
                      focusColor: Colors.red,
                      highlightColor: Colors.white60,
                      // overlayColor: MaterialStateColor(),
                      child: _pressed amp;amp; _btnIndex == 1
                          ? Icon(
                              Icons.check,
                              color: Colors.white,
                            )
                          : null,
                      // onDoubleTap: () {
                      //   _pressed = !_pressed;
                      // },
                      onTap: () {
                        setState(() {
                          _pressed = !_pressed;
                          _btnIndex = 1;
                        });
                        // _pressed = true;
                        print('I tapped no 1');
                      },
                    ),
                  ),
                ),
              ),
            ),
            Container(
              alignment: Alignment.center,
              child: Text('10'),
            ),
          ],
        ),
      ]),
     ),
  ]);`
  

просто используйте Listview.builder для этого и внутри этого используйте GestureDetector внутри Builder для изменения выбранного элемента

сначала возьмите переменную для отслеживания выбранного индекса

 int selected;
  

затем создайте виджет ListView Builder

 ListView.builder(
 itemCount:5,
 scrollDirection: Axis.horizontal,
 itemBuilder:(ctx,index){

 return GestureDetector(
  onTap:(){
   selected = index;
   setState((){});
   }
  child: YourWidget(isSelected:this.selected == index);
 );
 }

)
  

просто напишите логику для отображения галочки в изображении вашего виджета, когда IsSelected имеет значение true

Привет, @user2572661 может быть, когда вы касаетесь контейнера, он может не взаимодействовать так, как вы хотите, вы можете использовать ListView.builder() с направлением прокрутки по горизонтали, также есть виджет, который вы можете использовать onTap: для изменения состояния или логического вызова GestureDetector() . Хотя, пожалуйста, не могли бы вы поделиться еще несколькими кодами, чтобы я мог понять и исправить вашу проблему.