英文:
flutter Toggle Button uses always the default color
问题
我有一个关于我的toggleButton
的问题,问题出在哪里并不清楚。当我运行下面的代码时,切换按钮会出现在期望的位置,并且也可以按照期望的方式工作。然而,它们始终只显示默认颜色(选中时为蓝色背景,未选中时没有背景),而不是在ToggleButtons
中定义的颜色。我已经尝试过一些方法,比如将列表定义为List<List<bool>>
和List<List<Widget>>
,这是我在其他问题中找到的解决方案。但是然后我在initState()
中生成的列表、setState()
方法、isSelected
和children
上会得到错误。
谢谢你的帮助。
英文:
I have a problem with my toggleButton
and it is not clear where the problem is. When I run the below code the toggle buttons appear in the desired location and are also payable as desired. However, they are always only in the default color (blue background when selected, no background when not selected) and not as defined in the ToggleButtons
. I have already tried a few things, like defining the lists as List<List<bool>>
and List<List<Widget>>
, which I found as a solution in other questions. But then I get errors on the lists generated in initState()
, in the setState()
method, on isSelected
and children.
Thanks for your help.
Code:
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,
),
);
}
}
答案1
得分: 1
你可以使用其他颜色选项,比如fillColor,selectedColor,disabledColor,fillColor,focusColor,highlightColor,hoverColor,splashColor。
如果你想改变背景颜色,可以使用fillColor
,如果你想改变内容的颜色,可以使用selectColor
。
但是,disabledColor
和disableddBorderColor
确定按钮被禁用时的颜色。只有在没有onPressed回调的情况下才适用此属性。这意味着当按钮不能被按下(禁用)时会应用此属性。
另外,focusColor
确定按钮获得焦点时的背景颜色。当启用键盘导航或以编程方式将焦点放在按钮上时适用。
英文:
you can use other color options like fillColor, selectedColor, disabledColor, fillColor, focusColor, highlightColor, hoverColor, splashColor.
Use fillColor
if you want to change the background color or selectColor
if you want to change the color of the contents inside.
But, The disabledColor
and disableddBorderColor
determine the color when the button is disabled. This property only applies if the button is used without an onPressed callback. This means that it is applied when the button cannot be pressed (disabled).
Also, focusColor
Determines the background color when the button is focused. Applies when keyboard navigation is enabled or when the button is programmatically focused.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论