setState for specific element in a loop-CodePudding

I have a listview builder and a time picker inside the listview that allows user to choose time. However when I wanted to change the time for ex: index[1] it changed the other index element as well (index[0],index[2] in this case). How can I change the state of just one element of a loop for example : index[1] instead of all the elements in the loop?

Code:

ListView.builder(
              shrinkWrap: true,
              itemCount: item.length,
              itemBuilder: (BuildContext context, int index) {
                return Column(
                  children: [
                      GestureDetector(
                       onTap: () {
                        _selectTime(context, index);
                                
                                 
                     },
                  )]),

_selectTime(BuildContext context, int index) async {
    final TimeOfDay? timeOfDay = await showTimePicker(
      context: context,
      initialTime: selectedTime,
      initialEntryMode: TimePickerEntryMode.dial,
      
    );
    
    if (timeOfDay != null && timeOfDay != selectedTime) {
      if (index == index) {
        setState(() {
          selectedTime = timeOfDay;
        });
      }
    }
  }

CodePudding user response：

_selectTime method is future, therefore you need to await to pick data, _selectTime methods already contain index that is needed to be updated. And define GestureDetector child.

Run on dartPad.

List<TimeOfDay> item =
      List.generate(4, (index) => const TimeOfDay(hour: 1, minute: 3));
....

 Future<void> _selectTime(BuildContext context, int index) async {
    final TimeOfDay? timeOfDay = await showTimePicker(
      context: context,
      initialTime: const TimeOfDay(hour: 3, minute: 3),
      initialEntryMode: TimePickerEntryMode.dial,
    );

    if (timeOfDay != null) {
      if (index == index) {
        setState(() {
          item[index] = timeOfDay;
        });
      }
    }
  }

.....
 ListView.builder(
  itemCount: item.length,
  itemBuilder: (BuildContext context, int index) {
    return Column(children: [
      GestureDetector(
        onTap: () async {
          await _selectTime(context, index);
        },
        child: Text("date: ${item[index].toString()}"),
      )
    ]);
  },
),