选择单个 CheckboxListTile 项会选择多个？

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

问题是由于 CheckboxListTile 中使用了相同的 timeDilation 变量。查看下面的代码，

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 项会选择多个？

Selecting a single CheckboxListTile item selects multiple ones?

widget

dart

flutter