Flutter如何让指定TextButton不使用ThemeData全局样式,使用默认Material Design风格
- 方案1:直接配置TextButton的
style属性
TextButton自身style属性的优先级高于全局Theme配置,直接赋值即可覆盖全局样式。如果需要完全恢复Material Design默认风格,直接调用TextButton.defaultStyleOf(context)赋值即可。
代码示例:// 自定义单独样式 TextButton( style: TextButton.styleFrom( foregroundColor: Colors.black, backgroundColor: Colors.grey.shade200, padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8), ), onPressed: () {}, child: const Text('自定义样式按钮'), ); // 完全使用默认MD风格 TextButton( style: TextButton.defaultStyleOf(context), onPressed: () {}, child: const Text('默认风格按钮'), ); - 方案2:使用Theme组件局部覆盖主题
当存在多个需要脱离全局样式的TextButton时,可以用Theme组件包裹对应组件树,重写局部textButtonTheme配置,局部主题优先级高于全局主题。
代码示例:Theme( data: Theme.of(context).copyWith( // 清空自定义的textButtonTheme即可恢复该区域默认样式,也可以自定义局部样式 textButtonTheme: TextButtonThemeData( style: TextButton.styleFrom( foregroundColor: Colors.red, ), ), ), child: Column( children: [ TextButton(onPressed: (){}, child: const Text('局部样式按钮1')), TextButton(onPressed: (){}, child: const Text('局部样式按钮2')), ], ), ); - 方案3:合并全局样式仅修改指定属性
不需要完全脱离全局样式时,可以通过merge方法继承全局配置,仅覆盖需要调整的属性。
代码示例:TextButton( style: Theme.of(context).textButtonTheme.style?.merge( const ButtonStyle( foregroundColor: MaterialStatePropertyAll(Colors.green), ), ), onPressed: () {}, child: const Text('仅修改文字颜色'), );
内容的提问来源于stack exchange,提问作者MBK
相关产品推荐
相关产品推荐

