떨림 페이지 점프와 전통적 가치

용지가 다음 페이지로 전달 페이지 점프의 가치를 구현하고 점프하는 과정에서 이전 페이지로 돌아갑니다.

이 논문은 두 페이지 및 데이터 파일을 포함하여 세 가지 문서를 사용합니다.

데이터 파일 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天'
  },
]
  • 수신 된 페이지 StatelessWidget 경우

페이지 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,
    );
  }

페이지 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);
  }
}

주요 경로 사이의 페이지 점프를 구성하여 먼저 페이지 설정 클릭 이벤트를 보냅니다.

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

당신이 페이지 매개 변수의 정의를 받아 사전에 필요한 데이터의 유형에 따라 값을 전달하려면 내가 each_data 정의와 같은 데이터를 받아 들인다

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

그런 다음 수신 페이지에서 데이터를 수신 할 수 this.each_data를 사용합니다.

  •  수신 된 페이지 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,
          ),
        ),
      ),
    );
  }
}

전송 페이지를 수정해야하는 동시에,이 방식으로 데이터를 수신 할 필요가있다

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

최종 결과

 

추천

출처blog.csdn.net/caorya/article/details/92837926