[英]Im having trouble populating ListTile in ListView.builder from database
[英]Change particular ListTile Icon in ListView.builder
我對 Flutter 和 Dart 比較陌生,所以我有一個關於 ListView 操作的問題。 目前,下面的代碼可以工作並在 ListView 中顯示一些基本信息。 我將如何實施解決方案,以便當我單擊特定的列表磁貼時,其圖標會更改為其他內容? 以下是我目前的股票代碼:
import 'package:flutter/material.dart';
void main() => runApp(MaterialApp(
home: HomePage(),
));
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
Widget _getListItemTile(BuildContext context, int index) {
return Card(
child: GestureDetector(
child: ListTile(
leading: Icon(Icons.check_box_outline_blank),
title: Text('My Item'),
onTap: () {},
),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('My Test App'),
centerTitle: true,
),
body: ListView.builder(
itemCount: 7,
itemBuilder: _getListItemTile,
),
);
}
}
您可以在下面復制粘貼運行完整代碼
您可以聲明List<bool>
並通過boolList[index]
更改leading
圖標
代碼片段
List<bool> boolList = [true, true, true, true, true, true, true];
...
Card(
child: GestureDetector(
child: ListTile(
leading: boolList[index]
? Icon(Icons.check_box_outline_blank)
: Icon(Icons.place),
title: Text('My Item'),
onTap: () {
boolList[index] = !boolList[index];
setState(() {});
},
),
),
)
工作演示
完整代碼
import 'package:flutter/material.dart';
void main() => runApp(MaterialApp(
home: HomePage(),
));
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
List<bool> boolList = [true, true, true, true, true, true, true];
Widget _getListItemTile(BuildContext context, int index) {
return Card(
child: GestureDetector(
child: ListTile(
leading: boolList[index]
? Icon(Icons.check_box_outline_blank)
: Icon(Icons.place),
title: Text('My Item'),
onTap: () {
boolList[index] = !boolList[index];
setState(() {});
},
),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('My Test App'),
centerTitle: true,
),
body: ListView.builder(
itemCount: boolList.length,
itemBuilder: _getListItemTile,
),
);
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.