有10条备注信息,每条对应一个按扭开关,自定义隐藏和显示,flutter怎么写
时间: 2024-04-02 13:34:49 浏览: 51
您可以使用Flutter中的StatefulWidget和State类来实现此功能。以下是一个简单的示例代码,它包含10个开关按钮和对应的备注信息。您可以根据实际情况进行修改。
```dart
import 'package:flutter/material.dart';
class RemarksPage extends StatefulWidget {
@override
_RemarksPageState createState() => _RemarksPageState();
}
class _RemarksPageState extends State<RemarksPage> {
List<bool> _isExpandedList = List.generate(10, (_) => false);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Remarks'),
),
body: ListView.builder(
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return ExpansionPanelList(
expansionCallback: (int panelIndex, bool isExpanded) {
setState(() {
_isExpandedList[index] = !isExpanded;
});
},
children: [
ExpansionPanel(
headerBuilder: (BuildContext context, bool isExpanded) {
return ListTile(
title: Text('Button ${index + 1}'),
);
},
body: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Text('Remarks ${index + 1}'),
),
isExpanded: _isExpandedList[index],
),
],
);
},
),
);
}
}
```
在上面的代码中,使用ExpansionPanelList和ExpansionPanel来实现可折叠的备注信息。_isExpandedList用于追踪每个开关按钮是否展开。当用户点击开关按钮时,使用setState方法更新_isExpandedList并重新构建UI。
阅读全文