Question

在下面的代码上，选择“选项A”也会自动选择“选项B”。

这段代码基本上是CheckboxListTile class documentation example的两次复制粘贴。

class Alergias extends StatefulWidget {
  @override
  _AlergiasState createState() => _AlergiasState();
}

class _AlergiasState extends State<Alergias> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
    ...
      body: Column(
          CheckboxListTile(
            title: const Text("Option A"),
            value: timeDilation != 1.0,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                timeDilation = value ? 2.0 : 1.0;
              });
            },
          ),
          CheckboxListTile(
            title: const Text("Option B"),
            value: timeDilation != 1.0,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                timeDilation = value ? 2.0 : 1.0;
              });
            },
          ),
        ],
      ),
    );
  }
}

我不明白为什么会发生这种情况，或者是否与StatefulWidget状态有关。谁能帮我吗？

Answer 1

由于两个timeDilation中使用了相同的CheckboxListTile变量而引起了问题。查看下面的代码，

import 'package:flutter/material.dart';

import 'package:flutter/scheduler.dart' show timeDilation;

void main() => runApp(MyApp());

/// This Widget is the main application widget.
class MyApp extends StatelessWidget {
  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: Center(
          child: MyStatefulWidget(),
        ),
      ),
    );
  }
}

class MyStatefulWidget extends StatefulWidget {
  MyStatefulWidget({Key key}) : super(key: key);

  @override
  _MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  var value1 = timeDilation.abs();
  var value2 = timeDilation.abs();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children : <Widget>[
          CheckboxListTile(
            title: const Text("Option A"),
            value: value1 != 1.0,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                value1 = value ? 2.0 : 1.0;
              });
            },
          ),
          CheckboxListTile(
            title: const Text("Option B"),
            value: value2 != 1.0,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                value2 = value ? 2.0 : 1.0;
              });
            },
          ),
        ],
      ),
    );
  }
}

Answer 2

似乎您是Flutter的新手。欢迎来到Flutter社区！您的两个CheckBoxListTile同时选择的原因是因为您对两个都使用了相同的值。您已将CheckBoxListTile的值设置为timeDilation，更改timeDilation的值将导致同时选择两个CheckBoxListTile。
如果只需要选项，我建议使用布尔值来保存值：

bool _first;
CheckboxListTile(
            title: const Text("Option B"),
            value: _first??false,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                _first=true;
              });
            },
          ),
CheckboxListTile(
            title: const Text("Option B"),
            value: _first??true?false:true,
            controlAffinity: ListTileControlAffinity.leading,
            onChanged: (bool value) {
              setState(() {
                _first=false;
              });
            },
          ),

选择一个CheckboxListTile项目会选择多个项目吗？

2 个答案: