Question

我使用收音机地图，文本字段，显示结果的文本和用于清除所有内容的按钮。

可以删除TextField：

RaisedButton(onPressed: () { _controllerTextField.clear();},
                  child: Text('Clear',style:Theme.of(context).textTheme.body2.merge(TextStyle(color: Colors.white)),),)

但是我不知道如何删除我的文字并将收音机设置为默认的取消选中状态。

更多，当选择广播时，我给它指定了一种自定义颜色，但是我不能给“广播”图标赋予相同的颜色。

您对使用方法有想法吗？

谢谢

Answer 1

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

class Test extends StatefulWidget {
  Test({Key key, this.title}) : super(key: key);
  final String title;

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

class _TestState extends State<Test> {

  final TextEditingController _controllerTextField =  TextEditingController();


  double nombreTextField;
  int radioSelectionne;
  int resultat;

  Map coefMultipicateur = {
    0: 'x 2',
    1: 'x 5',
    2: 'x 10',
  };


  @override
  Widget build(BuildContext context) {
    return  GestureDetector(
      onTap: (() => FocusScope.of(context).requestFocus(FocusNode())),
      child: Scaffold(
        appBar: AppBar(
          title: Text('Test'),
        ),
        body: SingleChildScrollView(
          child: Padding(
            padding: EdgeInsets.only(left:10.0, right: 10.0),
            child: Column(
              children: <Widget>[
                Container(
                    margin: EdgeInsets.only(top: 10.0, bottom: 50.0),
                    child:
                    Row(
                      children: <Widget>[
                        Expanded(
                            flex:6,
                            child: Text('entrer nombre :',
                              style:Theme.of(context).textTheme.body2.merge(
                                  TextStyle(
                                      fontSize: 16)),
                            )
                        ),
                        Expanded(
                          flex: 4,
                          child: TextField(
                            controller: _controllerTextField,
                            keyboardType: TextInputType.number,
                            onChanged: (String string) {
                              setState(() {
                                nombreTextField = double.tryParse(string);
                              });
                            },
                            decoration: InputDecoration(
                              labelText: 'entrer nombre',
                            ),
                          ),
                        )
                      ],
                    )
                ),
                Container(
                  margin: EdgeInsets.only(top: 10.0, bottom: 20.0),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Expanded(
                        flex: 3,
                        child: Container(
                          color: Colors.blue,

                          child:columnRadio(),
                        ),
                      ),
                      Expanded(
                          flex: 7,
                          child: Center(
                              child: Column(
                                children: <Widget>[
                                  Text('resultat\n= ',
                                    textAlign: TextAlign.center,
                                    style:Theme.of(context).textTheme.title.merge(TextStyle(color: Colors.blueGrey)),),
                                  Container(
                                    margin: EdgeInsets.only(bottom: 10.0),
                                    child: Text(nombreTextField == null || radioSelectionne == null ? '' : '$resultat',
                                      style:Theme.of(context).textTheme.title.merge(TextStyle(color: Colors.green)),),
                                  ),
                                ],
                              )
                          )
                      )
                    ],
                  ),
                ),
                Container(
                    margin: EdgeInsets.only(top: 50.0),
                    child: RaisedButton(
                      onPressed: () {
                        _controllerTextField.clear();
                      },
                      color: Colors.blue,
                      child: Text('Clear',
                        style:Theme.of(context).textTheme.body2.merge(TextStyle(color: Colors.white)),
                      ),
                    )
                )
              ],
            ),
          ),
        ),
      ),
    );
  }

  Column columnRadio() {
    List<Widget> pourcentages = [];
    coefMultipicateur.forEach((key, value) {
      Row listePourcentages = Row(
        children: <Widget>[
          Radio(
              activeColor: Colors.white,
              value: key,
              groupValue: radioSelectionne,
              onChanged: (Object i) {
                setState(() {
                  radioSelectionne = i;
                  if (nombreTextField != null) {
                    switch (radioSelectionne) {
                      case 0:
                        resultat = (nombreTextField * 2).toInt();
                        break;
                      case 1:
                        resultat = (nombreTextField * 5).toInt();
                        break;
                      case 2:
                        resultat = (nombreTextField *  10).toInt();
                        break;
                    }
                  }
                });
              }),
          Text(value,
              style: TextStyle(
                  color: (radioSelectionne == key) ? Colors.white : Colors.blue[200],
                  fontWeight: FontWeight.bold)),
        ],
      );
      pourcentages.add(listePourcentages);
    });
    return Column(
      children: pourcentages,
    );
  }
}

Answer 2

如果您只能选择一个选项；将groupValue指定为单选按钮

示例：

const TYPE_DOG = 1
const TYPE_CAT = 2

                      Radio(
                        value: TYPE_DOG,
                        groupValue: type,
                        onChanged: (value) => setState(() => type = value),
                      ),
                      Radio(
                        value: TYPE_CAT,
                        groupValue: type,
                        onChanged: (value) => setState(() => type = value),
                      ),

然后在onPressed中将此值设置为0；

Answer 3

感谢Karim的建议。

对不起，我正忙于其他事情。最后，我做到了：

onPressed: () {
    _controller.clear();
    setState(() {
    radioSelectionne = 3;
     nombreTextField = null;
     Resultat = null;});
     },

关于收音机的颜色：在我的主文件中 ->主题数据 -> unselectedWidgetColor

一切都如我所愿。

感谢您的帮助。

Answer 4

使用 Radio 的 toggleable 属性。

<块引用>

Documentation 如果此单选按钮被允许通过在选中时再次选择它而返回到不确定状态，则设置为 true。

如何在颤动中取消选择单选按钮？

4 个答案: