Why flutter dynamic switch does not changing?

Question

I am trying to change switch, which are created dynamically by using future builder. it does not changing. Following is my script

bool disabledLanguage = false;
ListView.builder(
  scrollDirection: Axis.vertical,
  shrinkWrap: true,
  itemCount: snapshot.data.length,
  itemBuilder: (context, index){
    var postId = snapshot.data[index].id;
    var postTranslate =  snapshot.data[index].translate;
    disabledLanguage = (postId == getLanguageId) ? true : false; 
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 10),
      child:  _singleSwitch(postId, postTranslate, disabledLanguage),
    );
  }
)

and below is function in which I added switch functionality

_singleSwitch(postId, postTranslate, disabledLanguage){
    return  Row(
      children: [
        Text(
          postTranslate,
          style: TextStyle(
            color: Color(0xff41453c), 
            fontSize: 16,
            fontWeight: FontWeight.w700
          )
        ),
        Switch(
          value: disabledLanguage,
          onChanged: (value){
            setState(() {
              disabledLanguage=value;
            });
          },
          activeTrackColor: Colors.lightGreenAccent,
          activeColor: Colors.green,
        )
      ],
    );

  }

When I try to switch any language, it does not changing, i mean if english by default enabled, when I click on it, it should change to disable. It is not happening. Can someone please help me. Thank you

Answer 1

The problem is here:

setState(() {
  disabledLanguage=value;
});

disabledLanguage is a function argument. You are updating a function argument and not an instance variable!

1. Declare an instance variable disabledLanguage,
2. and remove disabledLanguage from parameter list so that the value is persisted after the function call.

It should look something like this:

class MyWidgetState extends State<MyWidget> {

  ...
  ...

  bool disabledLanguage = true; //<-- Declared as instance variable

  _singleSwitch(postId, postTranslate){ //<-- Removed from parameter list
      return  Row(
        children: [
          Text(
            postTranslate,
            style: TextStyle(
              color: Color(0xff41453c), 
              fontSize: 16,
              fontWeight: FontWeight.w700
            )
          ),
          Switch(
            value: disabledLanguage,
            onChanged: (value){
              setState(() {
                disabledLanguage=value;
              });
            },
            activeTrackColor: Colors.lightGreenAccent,
            activeColor: Colors.green,
          )
        ],
      );

    }
}

Answer 2

You need to set postId value to getLanguageId instead of setting disabledLanguage.

Copy the below code to DartPad and try. Go through the code once, You'll understand.

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    home: MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  _State createState() => _State();
}

class _State extends State<MyApp> {

  var getLanguageId = 1;

  @override
  Widget build(BuildContext context) {
    var data = [
      {
        'id': 1,
        'translate': 'Eng',
      },
            {
        'id': 2,
        'translate': 'Kan',
      }
    ];

    return Scaffold(
        appBar: AppBar(
          title: Text('Flutter Tutorial - googleflutter.com'),
        ),
        body: getListView(data)
    );
  }
  
  getListView(data) {
    return ListView.builder(
            scrollDirection: Axis.vertical,
            shrinkWrap: true,
            itemCount: data.length,
            itemBuilder: (context, index) {
              var postId = data[index]['id'];
              var postTranslate = data[index]['translate'];
              var isdisabled = (postId == getLanguageId) ? true : false;
              return Padding(
                padding: EdgeInsets.symmetric(horizontal: 10),
                child: _singleSwitch(postId, postTranslate, isdisabled),
              );
            });
  }
  
  _singleSwitch(postId, postTranslate, isdisabled) {
    print('@Im here for' + postTranslate);
    return Row(
      children: [
        Text(postTranslate,
            style: TextStyle(
                color: Color(0xff41453c),
                fontSize: 16,
                fontWeight: FontWeight.w700)),
        Switch(
          value: isdisabled,
          onChanged: (value) {
            setState(() {
              getLanguageId = postId;
            });
          },
          activeTrackColor: Colors.lightGreenAccent,
          activeColor: Colors.green,
        )
      ],
    );
  }
}