从列表磁贴导航到不同的屏幕(颤振,飞镖)



我是 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
}

相关内容

  • 没有找到相关文章

最新更新