我正在尝试构建多级列表视图,当我们点击子项时,它应该将参数传递给名为QuizOptionsDialog的其他页面。
1)我可以使用print(root.name)打印root.name;使用onTap
2),但是当我们尝试使用以下代码进行导航时,它会显示未定义的名称“上下文”
完整代码和错误
enter code here
Code page 1/2
enter code here
Code page 2/2
enter code here
Error
import 'package:flutter/material.dart';
import 'package:iti/quiz/ui/widgets/quiz_options.dart';
class ExpansionTileDemo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('List of Question Papers'),
),
body: ListView.builder(
itemCount: data.length,
itemBuilder: (BuildContext context, int index) => CategoryItem(
data[index],
),
),
),
);
}
}
// Welcome to another flutter tutorial
// In this video we will see how to create a multi-level Expansion List
// First Let's create a class for each row in the Expansion List
class Category {
final String id;
final String name;
final List<Category>
children; // Since this is an expansion list ...children can be another list of entries
Category(this.id, this.name, [this.children = const <Category>[]]);
}
// This is the entire multi-level list displayed by this app
final List<Category> data = <Category>[
Category(
'1',
'Main Category',
<Category>[
Category(
'1.1',
'Sub Category',
<Category>[
Category('1.1.1', 'Sub-Sub Category', <Category>[
Category('1.1.1.1', 'Sub-Sub-Sub Category',),
Category('1.1.1.2', 'Sub-Sub-Sub Category',),
]),
Category('1.1.2','Sub-Sub Category',
<Category>[
Category('1.1.2.1', 'Sub-Sub-Sub Category',),
Category('1.1.2.2', 'Sub-Sub-Sub Category',),
]
),
Category('1.1.3', 'Sub-Sub Category',
<Category>[
Category('1.1.3.1', 'Sub-Sub-Sub Category',),
Category('1.1.3.2', 'Sub-Sub-Sub Category',),
]
),
],
),
],
),
];
// Create the Widget for the row
class CategoryItem extends StatelessWidget {
const CategoryItem(this.category);
final Category category;
// This function recursively creates the multi-level list rows.
Widget _buildTiles(Category root) {
if (root.children.isEmpty) {
return ListTile(
title: Text(root.name),
onTap: () {
print(root.name);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => QuizOptionsDialog(category: category,),
),
);
},
);
}
return ExpansionTile(
key: PageStorageKey<Category>(root),
title: Text(root.name),
children: root.children.map<Widget>(_buildTiles).toList(),
);
}
@override
Widget build(BuildContext context) {
return _buildTiles(category);
}
_categoryPressed(BuildContext context,Category category) {
showModalBottomSheet(
context: context,
builder: (sheetContext) => BottomSheet(
builder: (_) => QuizOptionsDialog(category: category,),
onClosing: (){},
),
);
}
}
答案 0 :(得分:0)
更改您的CategoryItem类,使其在构造函数中也接受一个BuildContext context
变量,然后像对待category一样将其分配给BuildContext变量,然后在创建新的{{1}时从主窗口小部件传递该上下文。 }。这将使您可以访问上下文,并且应该可以进行导航。
要这样做:
将上下文存储在CategoryItem类中,以便每个实例都可以访问它。
CategoryItem
更新ListView.builder()以适当地实例化更新的CategoryItem类并传递上下文。
class CategoryItem extends StatelessWidget {
const CategoryItem(this.category, this.context);
final Category category;
final BuildContext context;
现在您应该可以在需要它的页面上访问BuildContext。