flutter切换按钮始终使用默认颜色

332nm8kg  于 2023-06-30  发布在  Flutter
关注(0)|答案(1)|浏览(112)

我的toggleButton有问题,不清楚问题在哪里。当我运行下面的代码时,切换按钮会出现在所需的位置,并且也可以根据需要进行支付。但是,它们始终仅为默认颜色(选中时为蓝色背景,未选中时为无背景),而不是ToggleButtons中定义的颜色。我已经尝试了一些事情,比如将列表定义为List<List<bool>>List<List<Widget>>,这是我在其他问题中找到的解决方案。但是,在initState()中生成的列表、setState()方法、isSelected和子对象上都出现了错误。谢谢你的帮助
代码:

import 'package:calendar_vertical/provider/toggle_provider.dart';
import 'package:calendar_vertical/provider/user_model.dart';
import 'package:calendar_vertical/widgets/user_item.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class ToggleButtonUsers extends StatefulWidget {
  @override
  _ToggleButtonUsersState createState() => _ToggleButtonUsersState();
}

class _ToggleButtonUsersState extends State<ToggleButtonUsers> {
  bool vertical = false;
  List<bool> selectedUser = [];
  //final List<Widget> children = [];
  List<Widget> selectedChildren = [];

  @override
  void initState() {
    final userModelData = Provider.of<UserModel>(context, listen: false);
    final userModel = userModelData.items;
    final toggleModelData = Provider.of<ToggleProvider>(context, listen: false);
    final toggleModel = toggleModelData.items;

    for (var index = 0; index < toggleModel.length; index += 1) {
      selectedUser = List.generate(
        toggleModel.length,
        (index) => index == 0 ? true : false,
      );

      selectedChildren = List.generate(
        toggleModel.length,
        (index) => UserItem(
          userModel[index].id,
          userModel[index].name,
          userModel[index].image,
          userModel[index].color,
        ),
      );
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: ToggleButtons(
        constraints: const BoxConstraints(
          minHeight: 40.0,
          maxHeight: 45,
          minWidth: 80.0,
          maxWidth: 85,
        ),
        selectedBorderColor: Colors.green,
        disabledBorderColor: Colors.red,
        direction: vertical ? Axis.vertical : Axis.horizontal,
        onPressed: (int index) {
          setState(() {
            selectedUser[index] = !selectedUser[index];
          });
          debugPrint('selected User ist nun: ' + selectedChildren.toString());
        },
        children: selectedChildren,
        isSelected: selectedUser,
      ),
    );
  }
}
9udxz4iz

9udxz4iz1#

您可以使用其他颜色选项,如fillColor、selectedColor、disabledColor、fillColor、focusColor、highlightColor、hoverColor、splashColor。
如果你想改变背景颜色,使用fillColor;如果你想改变里面内容的颜色,使用selectColor
但是,disabledColordisableddBorderColor决定按钮禁用时的颜色。此属性仅适用于在没有onPressed回调的情况下使用按钮的情况。这意味着当按钮无法按下(禁用)时应用。
另外,focusColor确定按钮聚焦时的背景颜色。当启用键盘导航或按钮以编程方式获得焦点时应用。

相关问题