Flutter automatic settings from array-CodePudding

I'm trying to create settings page from json. But first i'm checking if creating is working on static array:

import 'package:flutter/material.dart';
import 'package:settings_ui/settings_ui.dart';

class _SettingsScreenState extends State<SettingsScreen> {
   bool lockInBackground = true;

@override
void initState() {
    super.initState();
}

@override
Widget build(BuildContext context) {
    var tilearray = [{'name':'settings no 1'},{'name':'settings no 2'},{'name':'settings no 3'}];
    List<SettingsTile> tiles = [];
    log('{$tilearray}');
    tiles.add( SettingsTile.switchTile(
        initialValue: lockInBackground,
        onToggle: (bool value) {
          setState(() {
            lockInBackground = value;
          });
        },
        leading: Icon(Icons.phonelink_lock),
        title: Text('settings no 0')));
    tilearray.map((item) => log('test{$item.name}'));
    tilearray.map((item) => tiles.add( SettingsTile.switchTile(
        initialValue: lockInBackground,
        onToggle: (bool value) {
          setState(() {
            lockInBackground = value;
          });
        },
        leading: Icon(Icons.phonelink_lock),
        //title: Text(item['name']!))));
        title: Text('debug item'))));
   log('{$tiles}');
   return Scaffold(
      appBar: AppBar(title: Text('Settings UI')),
      body: SettingsList(
        sections: [
          SettingsSection(
            title: Text('First Section'),
            tiles: tiles,
          )
        ]
      )
    );
  }
}

But the result is only one SettingsTile (Setting no 0)...

The comment I add to check if there's a problem with array item, but no. It looks like tilearray is empty.

It is strange that tilearray.map((item) => log('test{$item.name}')); is empty too

CodePudding user response：

Got it!

I have to use

 for (final item in tilearray){
      log('x{$item}');
      tiles.add( SettingsTile.switchTile(
        initialValue: lockInBackground,
        onToggle: (bool value) {
          setState(() {
            lockInBackground = value;
          });
        },
        leading: Icon(Icons.phonelink_lock),
        //title: Text(item['name']!))));
        title: Text('element')));
      log('{$tiles}');
    }
  }

instead of

tilearray.map((item) =>

And as @Yeasin Sheikh wrote - have to move it to initState()

CodePudding user response：

Follow current way.

try putting variable outside the build method or you can use initState


class SettingsScreen extends StatefulWidget {
  const SettingsScreen({super.key});

  @override
  State<SettingsScreen> createState() => _SettingsScreenState();
}

class _SettingsScreenState extends State<SettingsScreen> {
  @override
  void initState() {
    super.initState();
  }

  Map<String, bool> tilearray = {
    'settings no 1': false,
    'settings no 2': false,
    'settings no 3': false
  };

  List<SettingsTile> getTiles(BuildContext context) {
    List<SettingsTile> tiles = [];

    for (int i = 0; i < tilearray.length; i  ) {
      final question = tilearray.keys.elementAt(i);
      final value = tilearray.values.elementAt(i);
      tiles.add(SettingsTile.switchTile(
          initialValue: value,
          onToggle: (bool value) {
            setState(() {
              tilearray[question] = value;
            });
          },
          leading: Icon(Icons.phonelink_lock),
          title: Text(question)));
    }
    ;
    return tiles;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Settings UI')),
      body: SettingsList(
        sections: [
          SettingsSection(
            title: Text('First Section'),
            tiles: getTiles(context),
          )
        ],
      ),
    );
  }
}