Flutter 如何使用itemBuilder选择最后点击的ListTile小部件?
我试图在抽屉中将最后点击的ListTile小部件的selected属性更改为true(然后很明显,其他ListTile的selected属性更改为false),但我不明白如何使用itemBuilder(在官方的Flitter文档中提到)。 我试着把我的ListTiles放到一个动画ListItemBuilder小部件中,但这对我不起作用Flutter 如何使用itemBuilder选择最后点击的ListTile小部件?,flutter,dart,Flutter,Dart,我试图在抽屉中将最后点击的ListTile小部件的selected属性更改为true(然后很明显,其他ListTile的selected属性更改为false),但我不明白如何使用itemBuilder(在官方的Flitter文档中提到)。 我试着把我的ListTiles放到一个动画ListItemBuilder小部件中,但这对我不起作用 Widget _buildDrawer() { return ListView( // Important: Remove any
Widget _buildDrawer() {
return ListView(
// Important: Remove any padding from the ListView.
padding: EdgeInsets.zero,
children: <Widget>[
DrawerHeader(
child:
Wrap(
alignment: WrapAlignment.center,
direction: Axis.vertical,
children: <Widget>[
Text(
_currentUser.displayName,
style: TextStyle(
fontSize: 20,
color: Colors.white
),
),
Wrap(
direction: Axis.vertical,
children: <Widget>[
Text(
"Iskolai kategória: A",
style: TextStyle(
fontSize: 18,
color: Colors.white70
),
),
Text(
"Kollégiumi kategória: A",
style: TextStyle(
fontSize: 18,
color: Colors.white70
),
),
],
)
],
),
decoration: BoxDecoration(
color: Colors.blue,
),
),
ListTile(
selected: true,
leading: Icon(Icons.date_range_rounded),
title: Text('Stúdium jelentkezés'),
onTap: () {
// Update the state of the app.
// ...
// Then close the drawer.
Navigator.pop(context);
},
),
ListTile(
leading: Icon(Icons.article_rounded),
title: Text('Koleszhírek'),
onTap: () {
// Update the state of the app.
// ...
Navigator.pop(context);
},
),
ListTile(
leading: Icon(Icons.account_box_rounded),
title: Text('Profil'),
onTap: () {
// Update the state of the app.
// ...
Navigator.pop(context);
},
),
ListTile(
leading: Icon(Icons.logout),
title: Text('Kijelentkezés'),
onTap: () => {
_googleSignIn.disconnect(),
Navigator.pop(context)
},
),
],
);
}
Widget\u buildDrawer(){
返回列表视图(
//重要提示:从ListView中删除任何填充。
填充:EdgeInsets.zero,
儿童:[
抽屉阅读器(
儿童:
包裹(
对齐:wrappalignment.center,
方向:轴垂直,
儿童:[
正文(
_currentUser.displayName,
样式:TextStyle(
尺寸:20,
颜色:颜色。白色
),
),
包裹(
方向:轴垂直,
儿童:[
正文(
“Iskolai Kategoória:A”,
样式:TextStyle(
尺码:18,
颜色:Colors.white70
),
),
正文(
“Kollégiumi Kategoória:A”,
样式:TextStyle(
尺码:18,
颜色:Colors.white70
),
),
],
)
],
),
装饰:盒子装饰(
颜色:颜色,蓝色,
),
),
列表砖(
选择:正确,
前导:图标(图标。日期\范围\四舍五入),
标题:文本(“Stúdium jelentkezés”),
onTap:(){
//更新应用程序的状态。
// ...
//然后关上抽屉。
Navigator.pop(上下文);
},
),
列表砖(
前导:图标(图标。文章四舍五入),
标题:文本(“Koleszhírek”),
onTap:(){
//更新应用程序的状态。
// ...
Navigator.pop(上下文);
},
),
列表砖(
前导:图标(图标。帐户框四舍五入),
标题:文本(“Profil”),
onTap:(){
//更新应用程序的状态。
// ...
Navigator.pop(上下文);
},
),
列表砖(
前导:图标(图标.注销),
标题:文本(“Kijelentkezés”),
onTap:()=>{
_googleSignIn.disconnect(),
Navigator.pop(上下文)
},
),
],
);
}
您必须将“选定索引”保存在变量中,并检查当前索引是否等于选定索引以突出显示列表视图。我已经更新了你的代码以使其正常工作
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _selectedIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
drawer: _buildDrawer(context),
body: Center(
child: Text("DrawerHeader Demo"),
),
);
}
Widget _buildDrawer(BuildContext context) {
List<Widget> leading = [
Icon(Icons.date_range_rounded),
Icon(Icons.article_rounded),
Icon(Icons.account_box_rounded),
Icon(Icons.logout),
];
List<Widget> title = [
Text('Stúdium jelentkezés'),
Text('Koleszhírek'),
Text('Profil'),
Text('Kijelentkezés'),
];
return Container(
color: Colors.white,
child: ListView(
padding: EdgeInsets.zero,
children: <Widget>[
DrawerHeader(
child: Wrap(
alignment: WrapAlignment.center,
direction: Axis.vertical,
children: <Widget>[
Text(
"A",
style: TextStyle(fontSize: 20, color: Colors.white),
),
Wrap(
direction: Axis.vertical,
children: <Widget>[
Text(
"Iskolai kategória: A",
style: TextStyle(fontSize: 18, color: Colors.white70),
),
Text(
"Kollégiumi kategória: A",
style: TextStyle(fontSize: 18, color: Colors.white70),
),
],
)
],
),
decoration: BoxDecoration(
color: Colors.blue,
),
),
ListView.builder(
itemCount: 4,
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: title[index],
leading: leading[index],
selected: index == _selectedIndex,
onTap: () {
setState(() {
_selectedIndex = index;
Navigator.pop(context);
});
},
);
},
),
],
),
);
}
}
导入“包装:颤振/材料.省道”;
void main(){
runApp(MyApp());
}
类MyApp扩展了无状态小部件{
//此小部件是应用程序的根。
@凌驾
小部件构建(构建上下文){
返回材料PP(
标题:“颤振演示”,
主题:主题数据(
主样本:颜色。蓝色,
视觉密度:视觉密度。自适应平台密度,
),
主页:MyHomePage(标题:“颤振演示主页”),
);
}
}
类MyHomePage扩展StatefulWidget{
MyHomePage({Key,this.title}):超级(Key:Key);
最后的字符串标题;
@凌驾
_MyHomePageState createState()=>\u MyHomePageState();
}
类_MyHomePageState扩展状态{
int _selectedIndex=0;
@凌驾
小部件构建(构建上下文){
返回脚手架(
appBar:appBar(
标题:文本(widget.title),
),
出票人:_buildDrawer(上下文),
正文:中(
子:文本(“抽屉阅读器演示”),
),
);
}
Widget\u buildDrawer(BuildContext上下文){
列表前导=[
图标(图标、日期、范围、四舍五入),
图标(图标。文章四舍五入),
图标(图标。帐户框四舍五入),
图标(图标。注销),
];
列表标题=[
文本(“Stúdium jelentkezés”),
文本(“Koleszhírek”),
文本(“profile”),
文本(“Kijelentkezés”),
];
返回容器(
颜色:颜色,白色,
子:ListView(
填充:EdgeInsets.zero,
儿童:[
抽屉阅读器(
孩子:包裹(
对齐:wrappalignment.center,
方向:轴垂直,
儿童:[
正文(
“A”,
样式:TextStyle(字体大小:20,颜色:Colors.white),
),
包裹(
方向:轴垂直,
儿童:[
正文(
“Iskolai Kategoória:A”,
样式:TextStyle(字体大小:18,颜色:Colors.white70),
),
正文(
“Kollégiumi Kategoória:A”,
样式:TextStyle(字体大小:18,颜色:Colors.white70),
),
],
)
],
),
装饰:盒子装饰(
颜色:颜色,蓝色,
),
),
ListView.builder(
物品计数:4,
收缩膜:对,
itemBuilder:(构建上下文,int索引){
返回列表块(
标题:标题[索引],
前导:前导[索引],
所选:索引==\u使用