我是 Flutter 的新手,非常感谢一些帮助!为混乱的代码提前道歉 - 我正在尽力理解颤振!
我正在创建一个简单的测验应用程序。
第一页以 listTile 开头,其中包含每个后续页面的标题。
通过单击每个列表磁贴,我希望导航到不同的屏幕。屏幕都在单独的飞镖文件中。
理想情况下,我希望在以下代码中使用 ontap 函数,以便每个单独标题的 listTile 都指向不同的屏幕:
Lesson(title: "Hosea", scoreString: "1 / 10", score: 0.1),
但是,我的 ontap 功能只能在 listTile 中构建,因此我无法为每张卡单独设置!
请帮忙!!
**
class WelcomeScreen extends StatelessWidget {
static const String id = 'welcome_screen';
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Minor Prophets',
theme: new ThemeData(
primaryColor: Color.fromRGBO(58, 66, 86, 1.0), fontFamily: 'Raleway'),
home: new ListPage(title: 'Lessons'),
// home: DetailPage(),
);
}
}
class ListPage extends StatefulWidget {
ListPage({Key key, this.title}) : super(key: key);
final String title;
@override
_ListPageState createState() => _ListPageState();
}
class _ListPageState extends State<ListPage> {
List lessons;
@override
void initState() {
lessons = getLessons();
super.initState();
}
@override
Widget build(BuildContext context) {
ListTile makeListTile(Lesson lesson) => ListTile(
contentPadding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 1.0),
leading: Container(
padding: EdgeInsets.only(right: 12.0),
decoration: new BoxDecoration(
border: new Border(
right: new BorderSide(width: 1.0, color: Colors.white24))),
child: Icon(Icons.face, color: Colors.white),
),
title: Text(
lesson.title,
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
),
//
subtitle: Row(
children: <Widget>[
Expanded(
flex: 1,
child: Container(
// tag: 'hero',
child: LinearProgressIndicator(
backgroundColor: Color.fromRGBO(209, 224, 224, 0.2),
value: lesson.indicatorValue,
valueColor: AlwaysStoppedAnimation(Colors.green)),
)),
Expanded(
flex: 4,
child: Padding(
padding: EdgeInsets.only(left: 10.0),
child: Text(lesson.level,
style: TextStyle(color: Colors.white))),
)
],
),
trailing:
Icon(Icons.keyboard_arrow_right, color: Colors.white, size: 30.0),
onTap: () {
},
);
Card makeCard(Lesson lesson) => Card(
elevation: 8.0,
margin: new EdgeInsets.symmetric(horizontal: 10.0, vertical: 6.0),
child: Container(
decoration: BoxDecoration(color: Color.fromRGBO(64, 75, 96, .9)),
child: makeListTile(lesson),
),
);
final makeBody = Container(
// decoration: BoxDecoration(color: Color.fromRGBO(58, 66, 86, 1.0)),
child: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: lessons.length,
itemBuilder: (BuildContext context, int index) {
return makeCard(lessons[index]);
},
),
);
**
`enter code here`List getLessons() {
return [
Lesson(title: "Hosea", scoreString: "1 / 10", score: 0.1),
Lesson(title: "Joel", scoreString: "1 / 10", score: 0.1),
Lesson(title: "Amos", scoreString: "1 / 10", score: 0.1),
Lesson(title: "Obadiah", scoreString: "1 / 10"),
Lesson(title: "Jonah", scoreString: "1 / 10"),
Lesson(title: "Micah", scoreString: "1 / 10"),
Lesson(title: "Nahum", scoreString: "1 / 10"),
Lesson(title: "Habakkuk", scoreString: "1 / 10"),
Lesson(title: "Zephaniah", scoreString: "1 / 10"),
Lesson(title: "Haggai", scoreString: "1 / 10"),
Lesson(title: "Zechariah", scoreString: "1 / 10"),
Lesson(title: "Malachi", scoreString: "1 / 10"),
];
}
**
class Lesson {
String title;
String scoreString;
double score;
Lesson({this.title, this.scoreString, this.score});
}
尝试传入makeListTile(lesson,index)
,根据此索引,您可以导航到不同的屏幕
onTap(){
if(index==0)
// do something
else if(index==1)
// do something different
}