Flutter page jump and traditional values

Paper implements page jump value passed to the next page and returns to the previous page in the course of the jump.

This paper uses three documents, including two pages and a data file.

Data file listData.dart

List listData=[
  {
    "patrol_plan_name": 'TSD-8351',
    "address": '郑州大学与文化路交叉口向南100米',
    "remainder_days": '5天'
  },
  {
    "patrol_plan_name": 'ASD-8352',
    "address": '郑州大学与学府路交叉口向南100米',
    "remainder_days": '6天'
  },
  {
    "patrol_plan_name": 'AAX-8353',
    "address": '中州大道与文化路交叉口向南100米',
    "remainder_days": '15天'
  },
]
  • If the received page is StatelessWidget

Send page Patrol.dart

import 'package:flutter/material.dart';
import 'package:flutter_app1111/res/listData.dart';
import 'package:flutter_app1111/pages/PatrolTask.dart';


class PatrolPage extends StatelessWidget{

  //自定义方法
  Widget _getListData(context, index){
      return ListTile(
        title: Text(listData[index]["patrol_plan_name"]),
        subtitle: Text(
                    listData[index]["address"],
                    style: new TextStyle(
                    color: Colors.grey[500],
                  ),
                  overflow: TextOverflow.ellipsis,),
        trailing: Text(listData[index]["remainder_days"]),
        onTap: (){
          Navigator.of(context).push(
              MaterialPageRoute(builder: (context)=>PatrolTaskPage(each_data: listData[index]))
          );
        },
      );
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return ListView.builder(
      itemCount: listData.length,
      itemBuilder: this._getListData,
    );
  }

Receiving a page PatrolTask.dart

import 'package:flutter/material.dart';

class PatrolTaskPage extends StatelessWidget{
  
      final Map<String, String> each_data ;
      PatrolTaskPage({this.each_data});
  
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text("${each_data["patrol_plan_name"]}"),
      ),
      body: ListTile(
        title: Text("${each_data["address"]}"),
        subtitle: Text("${each_data["remainder_days"]}"),
        onTap: (){
          _backCurrentPage(context);
        },
      ),
    );
  }

  void _backCurrentPage(BuildContext context){
    Navigator.pop(context);
  }
}

By configuring the page jump between the main route, first sends the Page Setup click event.

onTap: (){
          Navigator.of(context).push(
              MaterialPageRoute(builder: (context)=>PatrolTaskPage(each_data: listData[index]))
          );
        },

If you want to pass a value, according to the data type required in advance to accept the definition of a page parameter accepts data, such as I defined each_data

final Map<String, String> each_data ;
      PatrolTaskPage({this.each_data});

Then use this.each_data can receive data at the receiving page.

  •  If the received page is StatefulWidget
class PatrolTaskPage extends StatefulWidget{

  final Map<String, String> each_data;
  PatrolTaskPage(this.each_data);

  _PatrolTaskPageState createState() => _PatrolTaskPageState();
}

class _PatrolTaskPageState extends State<PatrolTaskPage> {

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text(
          "${widget.each_data["patrol_plan_name"]}",
          textAlign: TextAlign.center,
          style: TextStyle(
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }
}

It is necessary to receive data in this manner, while transmitting pages need to be modified

Navigator.of(context).push(
              MaterialPageRoute(builder: (context)=>PatrolTaskPage(listData[index]))
          );

final effect

 

Guess you like

Origin blog.csdn.net/caorya/article/details/92837926