首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

当按钮的highlightColor改变时,有没有办法改变FlatButton中的文本颜色?

当按钮的highlightColor改变时,可以通过自定义FlatButton的主题来改变文本颜色。

首先,需要创建一个自定义的主题,可以使用ThemeData类来定义。在主题中,可以指定按钮的highlightColor和文本的颜色。

代码语言:txt
复制
ThemeData customTheme = ThemeData(
  highlightColor: Colors.red, // 设置按钮的highlightColor为红色
  textTheme: TextTheme(
    button: TextStyle(color: Colors.white), // 设置按钮文本颜色为白色
  ),
);

然后,在使用FlatButton的地方,将主题应用到FlatButton的theme属性中。

代码语言:txt
复制
FlatButton(
  child: Text('Button'),
  onPressed: () {},
  theme: customTheme, // 应用自定义主题
)

这样,当按钮被按下时,highlightColor会变为红色,并且按钮文本的颜色会变为白色。

推荐的腾讯云相关产品:腾讯云云服务器(CVM),产品介绍链接地址:https://cloud.tencent.com/product/cvm

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Flutter | 常用组件

this.color, //按钮背景颜色 this.disabledColor,//按钮禁用时背景颜色 this.highlightColor, //按钮按下背景颜色 this.splashColor..., //点击,水波动画中水波颜色 this.colorBrightness,//按钮主题,默认是浅色主题 this.padding, //按钮填充 this.shape, //外形...3,可以应用文本样式,可以像文本一样改变字体图标颜色,大小对齐等 4,可以通过 TextSpan 和文本混用 使用 Material Design 字体图标 Flutter 默认包含了一套 Material... Switch 或者 CheckBox 被点击,会触发 onChanged 回调,我们可以回调改变逻辑 class SwitchAndCheckboxTest extends StatefulWidget...不同是后者回调是 ValueChanged ,前者不接受参数 inputFormatters:用于指定输入格式,输入内容改变,会根据指定格式来校验 enable:若为

11.4K30
  • Flutter按钮组件Button

    Flutter提供了丰富按钮组件可以让我们快速构建UI界面。 常见按钮组件如下: 1. RaisedButton 凸起按钮; 2. FlatButton 扁平化按钮; 3....FloatingActionButton 浮动按钮按钮组件常见属性: 1. onPressed  按下按钮触发回调方法,为必填参数,如果值为 null 表示禁用按钮,会显示禁用相关样式; 2.... child 子组件; 3. textColor 文本颜色; 4. color 按钮颜色; 5. disabledColor 按钮禁用时颜色; 6. disabledTextColor 按钮禁用时文本颜色...; 7. splashColor 点击按钮时水波纹颜色; 8. highlightColor 长按按钮按钮颜色; 9. elevation 阴影范围; 10. padding 内边距; 11....shape 按钮形状。

    4.1K10

    Flutter 按钮组件

    Flutter提供了丰富按钮组件可以让我们快速构建UI界面。 常见按钮组件如下: 1. RaisedButton :凸起按钮; 2. FlatButton :扁平化按钮; 3....FloatingActionButton:浮动按钮按钮组件常见属性: 1. onPressed 按下按钮触发回调方法,为必填参数,如果值为 null 表示禁用按钮,会显示禁用相关样式; 2....值类型为Widget; 3. textColor 文本颜色。值类型为Colors; 4. color 按钮颜色。值类型为Colors; 5. disabledColor 按钮禁用时颜色。...值类型为Colors; 6. disabledTextColor 按钮禁用时文本颜色。值类型为Colors; 7. splashColor 点击按钮时水波纹颜色。...值类型为Colors; 8. highlightColor 长按按钮按钮颜色。值类型为Colors; 9. elevation 阴影范围。

    3.1K30

    15.Flutter学习之路按钮组件系列

    RaisedButton:凸起按钮,其实就是Material Design风格Button....FlatButton:扁平化按钮 OutlineButton:线框按钮 ButtonBar:按钮组 FloatingActionButton:浮动按钮 RaisedButton 属性 描述 textColor...文本颜色 color 按钮颜色 disabledColor 按钮被禁用时颜色 disabledTextColor 按钮被禁用时文本颜色 splashColor 点击按钮时水波纹颜色 highlightColor...点击(长按)按钮按钮颜色 elevation 阴影范围,值越大阴影范围越大 padding 内边距 shape 设置按钮形状 FloatingActionButton 属性 描述 child...子视图,一般为Icon tooltip FAB被长按时显示,也是无障碍功能 backgroundColor 背景颜色 elevation 未点击阴影 highlightElevation 点击阴影值

    57610

    Flutter第4天--基础控件(下)+Flex布局详解

    Flutter七日游第四天:2018-12-19 天气:晴朗 零、前言 最近有些人问我怎么学,操作这么6,有没有什么技巧。...图片颜色混合模式.png ---- Row和Column应该说是非常常用控件,其中有几个属性挺重要, 本文最后,我将对Flex布局(Row和Column父类)进行细致讲解,希望你不要错过。...当你遇到很多种情况问题,都可以用这个套路,多分析,你才能巩固自己知识库 ?...: Colors.red,//点击时间稍长时候背景渐变到这个颜色 splashColor: Colors.blue,//点击一闪而过颜色 disabledColor: Colors.blueGrey...: Colors.blue, ); ---- 2.FlatButton--平按钮 FlatButton相当于精简版RaisedButton,没有阴影凸起效果 可见源码里关于elevation都被过滤了

    2.2K30

    你知道吗,Flutter内置了10多种Button控件

    disabledColor 禁用状态下背景颜色 highlightColor 高亮颜色,按下颜色 splashColor...FlatButton FlatButton是一个扁平按钮,用法和RaisedButton一样,代码如下: FlatButton( child: Text('Button'), color: Colors.blue...,它不使用当前系统主题和按钮主题,用于自定义按钮或者合并现有的样式,而RaisedButton和FlatButton都是基于RawMaterialButton配置了系统主题和按钮主题,相关属性可以参考...风格关闭按钮,本身是一个IconButton,点击默认执行Navigator.maybePop即如果路由栈有上一页则返回到上一页。...(splashColor)和按下高亮颜色highlightColor): ToggleButtons( splashColor: Colors.purple, highlightColor

    2.5K00

    Flutter跨平台移动端开发丨Text、Button、Image、Switch、Checkbox、TextField

    目录 Text Widget(文本) Button Widget(按钮) Image Widget(图片) Switch and Checkbox(开关按钮及复选框) TextField Widget(...) Material 库按钮点击默认带有“水波动画”,点击事件监听通过 onPressed 属性设置,若不设置 onPressed 则按钮处于禁用状态,无点击动效也不响应点击事件 const...,默认带有阴影和灰色背景,点击阴影会变大 FlatButton:扁平按钮, OutlineButton:带边框按钮 IconButton:带图标按钮 Custom FlatButton:自定义扁平按钮...(15.0), child: new FlatButton(onPressed: _BtnClick, child: Text("FlatButton / 扁平按钮")...NetworkImage:从网络记载图片 ImageProvider AssetImage(加载本地图片) 工程根目录下创建文件夹 images 存放图片文件 在 pubspec.yaml 文件

    2.5K40

    Flutter 密码锁定屏幕

    在任何情况下,如最新Andriod先决条件所指出那样,您需要在生物识别认证被破坏或受损偶然机会上提供选择性认证策略。 在在本文中,我们将探讨「Flutter「密码锁定屏幕」。...屏幕可适应颜色,大小,文本样式等。它将显示在flutter应用程序中使用密码屏幕如何解锁屏幕。 该演示视频演示了如何在Flutter创建密码锁定屏幕。...*,我们将使用按钮。...我们将在按钮内添加填充,颜色文本和onPressed方法,并在此方法上添加**_showLockScreen()**小部件。当我们运行应用程序时,我们应该获得屏幕输出,如屏幕下方截图所示。...「在屏幕内部,我们将添加标题,内置圆圈配置和键盘。我们将添加一个」passwordEnteredCallback」方法。在此方法,添加_passcodeEntered小部件,我们将在下面进行定义。

    5K30

    Flutter 按钮,看这篇文章就够了

    我在之前文章文本、图片和按钮在Flutter怎么用,简单介绍过按钮组件,本篇文章来详细聊聊Flutter各种按钮组件各种应用场景。...在Flutter,有很多按钮组件,常见有:FlatButton、RaisedButton、OutlineButton、IconButton、ButtonBar、FloatingActionButton...首先来看一下按钮组件属性: onPressed,必填参数,按下按钮触发回调,接收一个方法,传null值表示按钮禁用,会显示禁用相关样式 child,表示按钮展示状态Widget,一般为一个文本组件...textColor,文本颜色 color,按钮背景颜色 disabledColor,按钮禁用时背景颜色 disabledTextColor,按钮禁用时文本颜色 splashColor,点击按钮时水波纹颜色...highlightColor,点击(长按)按钮按钮背景颜色 elevation,阴影范围,值越大阴影范围就越大 padding,内边距 shape,设置按钮形状 下面是代码实例: Column

    9.5K31

    【Flutter 专题】61 图解基本 Button 按钮小结 (一)

    Button 在日常是必不可少,和尚尝试过不同类型 Button,也根据需求自定义过,今天和尚系统学习一下最基本 Button; Flutter 没有 Button Widget,但提供了很多不同类型...this.highlightColor, // 点击高亮颜色 this.splashColor, // 水波纹颜色 this.disabledColor,...cyan,点击高亮背景色为 deepPurple,水波纹颜色为 redAccent;注意 icon 自身设置颜色 color 属性不生效; IconButton(icon: Icon(Icons.android...// 文字属性 this.fillColor, // 填充颜色 this.highlightColor, // 背景高亮颜色...,可根据 padding 或外层依赖 Container 适当调整位置和大小;默认最小尺寸为 88px * 36px; 案例尝试 和尚定义了一个基本按钮,并监听其高亮改变状态,与我们常见按钮基本一致

    1.5K21

    AngularDart4.0 高级-属性(Attribute)指令 顶

    现在在AppComponent引用此模板,并将Highlight指令添加到指令列表Angular在模板遇到myHighlight,就会识别该指令。...在本节,您将为开发人员提供在应用指令设置突出显示颜色能力。...在本节,您将把AppComponent转换为一个线束,让您用单选按钮选取高亮颜色,并将您颜色选择绑定到指令。...您可以通过绑定属性名称位置来判断是否需要@Input。 它出现在等号(=)右边模板表达式,它属于模板组件,不需要@Input注解。...它出现在等号(=)左边方括号([]),该属性属于某个其他组件或指令; 该属性必须用@Input注解来修饰。

    3.2K10

    ​Flutter | 1.9 全新组件 ToggleButtons

    创建一组水平切换按钮。 它水平显示 children 列表中提供小部件。 其实这段文本是在源码翻出来,现在在网上搜 「ToggleButtons」 还是搜不出来官方文档。...则该控件状态为 disable4.color:Text / Icon 状态为已启用并且未选中颜色5.selectedColor:不用多说,选中颜色6.disabledColor:未启用时颜色...7.fillColor:选中按钮背景颜色8.focusColor:按钮具有输入焦点填充颜色9.highlightColor:点击颜色10.hoverColor:按钮上有指针悬停用于填充按钮颜色...11.splashColor:点击后颜色12.focusNodes:每一个按钮焦点13.renderBorder:是否在每个切换按钮周围呈现边框14.borderColor:边框颜色15.selectedBorderColor...逻辑其实都在 「onPressed」,导致结果不一样。 最后 这里我没有改变外观之类,只是借用了官方 demo,其实想改变外观之类,回头看看构造函数,我想了一下,基本能用到都提供了。

    1.9K20

    flutter主题设置

    ThemeData(Color类型属性): accentColor - 前景色(文本按钮等) backgroundColor - 与primaryColor对比颜色(例如 用作进度条剩余部分)。...highlightColor - 用于类似墨水喷溅动画或指示菜单被选中高亮颜色。 hintColor - 用于提示文本或占位符文本颜色,例如在TextField。...focusColor - 焦点获取颜色,例如,一些按钮焦点、输入框焦点。 hoverColor - 点击之后徘徊颜色,例如,按钮长按,按住之后颜色。...buttonTheme - ButtonThemeData类型,定义了按钮等控件默认配置,像RaisedButton和FlatButton。...由按钮等Widget使用,以确定在不使用主色或强调色要选择颜色。 platform - TargetPlatform类型,Widget需要适配目标类型。

    4.5K20

    PythonGUI编程(二)Butto

    这个函数或方法将在按钮被点击执行. 按钮Button控件属性: activebackground, activeforeground 类型:颜色; 说明:按钮被激活所使用颜色。...cursor 类型:光标; 说明:当鼠标移动到按钮所显示光标。 default 类型:常量; 说明:如果设置了,则按钮为默认按钮。注意这个语法在Tk 8.0b2改变。...disabledforeground 类型:颜色; 说明:按钮无效颜色。 font 类型:字体; 说明:按钮所使用字体。按钮只能包含一种字体文本。...highlightbackground, highlightcolor 类型:颜色; 说明:控制焦点所在高亮边框颜色窗口部件获得焦点时候,边框为highlightcolor所指定颜色。...textvariable 类型:变量; 说明:与按钮相关Tk变量(通常是一个字符串变量)。如果这个变量改变,那么按钮文本相应更新。

    1.7K10

    python button使用方法_python gui界面设计

    这个函数或方法将在按钮被点击执行. 按钮Button控件属性: activebackground, activeforeground 类型:颜色; 说明:按钮被激活所使用颜色。...cursor 类型:光标; 说明:当鼠标移动到按钮所显示光标。 default 类型:常量; 说明:如果设置了,则按钮为默认按钮。注意这个语法在Tk 8.0b2改变。...disabledforeground 类型:颜色; 说明:按钮无效颜色。 font 类型:字体; 说明:按钮所使用字体。按钮只能包含一种字体文本。...highlightbackground, highlightcolor 类型:颜色; 说明:控制焦点所在高亮边框颜色窗口部件获得焦点时候,边框为highlightcolor所指定颜色。...textvariable 类型:变量; 说明:与按钮相关Tk变量(通常是一个字符串变量)。如果这个变量改变,那么按钮文本相应更新。

    1.5K30

    【Flutter 实战】简约而不简单计算器

    _CalculatorKeyboard 是底部输入按钮组件,也是此项目的重点,除了 0 这个按钮外,其余都是圆形按钮,不同之处是 高亮颜色(按住颜色)、背景颜色按钮文本文本颜色不同,因此先实现一个按钮组件...,其中高亮颜色(按住颜色)、背景颜色按钮文本文本颜色属性作为参数,封装如下: class _CalculatorItem extends StatelessWidget { final String...: onValueChange, ); }), ); } } onValueChange 是点击按钮回调,参数是当前按钮文本,用于计算,下面说下计算逻辑:...: 不足之一:计算结果逻辑,上面计算结果逻辑是不完美的,增加一个操作符(比如 取余),计算逻辑复杂度将会以指数级方式增加,那为什么还要用此方式?...不足之二:此App没有考虑横屏情况,为什么?因为横屏很可能导致整体布局发生变化,横屏按钮是变大还是拉伸,或者拉伸间隙?

    60010
    领券