如何通过在颤动中点击文本来启用复选框？答案

【问题标题】：how to enable checkbox with tapping on text in flutter?如何通过在颤动中点击文本来启用复选框？
【发布时间】：2021-12-08 14:10:10
【问题描述】：

我有一个复选框，当用户点击文本时，我想要的复选框旁边有一个文本复选框启用/禁用，我该怎么做？

  Widget buildRememberCb() {
    return Container(
      height: 200,
      child: Row(
        textDirection: TextDirection.rtl,
        children: [
          Theme(
            data: ThemeData(unselectedWidgetColor: Colors.white),
            child: Checkbox(
              value: isRememberMe,
              checkColor: Color(0xfff44336),
              activeColor: Colors.white,
              onChanged: (value) {
                setState(() {
                  isRememberMe = value!;
                });
              },
            ),
          ),
          Text(
            "Remember Me",
            style: TextStyle(
                fontWeight: FontWeight.w900, fontSize: 18, color: Colors.white),
          ),
        ],
      ),
    );
  }

【问题讨论】：

标签： flutter android-studio dart user-interface checkbox

【解决方案1】：

用GestureDetector 包裹Text 并在onTap 中更改isRememberMe 的值，

  Widget buildRememberCb() {
    return Container(
      height: 200,
      child: Row(
        textDirection: TextDirection.rtl,
        children: [
          Theme(
            data: ThemeData(unselectedWidgetColor: Colors.white),
            child: Checkbox(
              value: isRememberMe,
              checkColor: Color(0xfff44336),
              activeColor: Colors.white,
              onChanged: (value) {
                setState(() {
                  isRememberMe = value!;
                });
              },
            ),
          ),
          GestureDetector(
            onTap: (){
              setState((){
                isRememberMe = isRememberMe ? false : true;
              });
            },
            child: Text(
              "Remember Me",
              style: TextStyle(
                fontWeight: FontWeight.w900, fontSize: 18, color: Colors.white),
            ),
          ),
        ],
      ),
    );
  }

如果您想要 Ink 飞溅，可以将 GestureDetector 替换为 InkWell，但更好的方法是使用 TextButton，

TextButton(
  onPressed: () {
    setState((){
      isRememberMe = isRememberMe ? false : true;
     });
  },
  child: Text(
    "Remember Me",
    style: TextStyle(
      fontWeight: FontWeight.w900, 
      fontSize: 18, 
      color: Colors.white,
    ),
  ),
),

【讨论】：