在Flutter中,ExpansionTile
是一个常用的小部件,用于创建可折叠的列表项。如果你想在展开 ExpansionTile
时更改标题文本的颜色,可以通过自定义 title
属性来实现。以下是一个详细的示例代码,展示了如何根据展开状态动态更改标题颜色。
ExpansionTile
是 Flutter 提供的一个小部件,用于创建可折叠的列表项。它包含一个标题和一个子列表,用户可以点击标题来展开或折叠子列表。
ExpansionTile
主要用于列表视图中,特别是在需要展示多层次信息的场景。以下是一个示例代码,展示了如何在 ExpansionTile
展开时更改标题文本的颜色:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('ExpansionTile Example')),
body: ExpansionTileExample(),
),
);
}
}
class ExpansionTileExample extends StatefulWidget {
@override
_ExpansionTileExampleState createState() => _ExpansionTileExampleState();
}
class _ExpansionTileExampleState extends State<ExpansionTileExample> {
bool _isExpanded = false;
@override
Widget build(BuildContext context) {
return ListView(
children: [
ExpansionTile(
title: Text(
'Click me to expand',
style: TextStyle(
color: _isExpanded ? Colors.blue : Colors.black,
),
),
onExpansionChanged: (expanded) {
setState(() {
_isExpanded = expanded;
});
},
children: [
ListTile(title: Text('Item 1')),
ListTile(title: Text('Item 2')),
ListTile(title: Text('Item 3')),
],
),
],
);
}
}
StatefulWidget
来管理展开状态。ExpansionTile
的 title
属性中,使用 TextStyle
动态设置颜色。_isExpanded
变量。setState
来刷新界面。如果你遇到标题颜色没有变化的问题,可能是以下原因:
onExpansionChanged
回调中正确更新了状态。TextStyle
是否正确应用到 Text
小部件上。通过上述方法,你可以轻松实现 ExpansionTile
展开时标题颜色的动态变化。
领取专属 10元无门槛券
手把手带您无忧上云