如何通过在flutter中传递参数来使用具有相同功能的不同日期选择器？

问题描述

今天，我正在从事一个项目，但发现使用flutter中的单个功能来制作许多日期选择器很困难。代码如下

import 'dart:ffi';

import 'package:AllInOneCalci/customAppBar.dart';
import 'package:flutter/material.dart';

class AgeCalcUI extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var AppBarHeight = MediaQuery.of(context).size.height;
    return Scaffold(
      appBar: customAppBar(
        height: (AppBarHeight / 3) * 0.4,child: Row(
          mainAxisAlignment: MainAxisAlignment.center,children: [
            Padding(
              padding: const EdgeInsets.only(top: 18.0),child: Text(
                'All In One Cali',style: TextStyle(
                    color: Colors.black,fontSize: 35.0,fontFamily: 'DancingScript',fontWeight: FontWeight.bold),),],body: CustomDatePicker(),);
  }
}

class CustomDatePicker extends StatefulWidget {
  @override
  _CustomDatePickerState createState() => _CustomDatePickerState();
}

class _CustomDatePickerState extends State<CustomDatePicker> {
  //getting the current date
  DateTime selectedDate = DateTime.now();

  Future<void> selectDateTime(BuildContext context) async {
    final DateTime chosen = await showDatePicker(
      context: context,initialDate: selectedDate,firstDate: DateTime(1700),lastDate: DateTime(2030),initialDatePickerMode: DatePickerMode.year,);
    if (chosen != null && chosen != selectedDate) {
      setState(() {
         selectedDate = chosen;
       });
    } 
  }

   //widget for displaying and choosing date onTap
  Widget CustomButtonDatePicker(Color ButtonColor,Color TextColor) {
    return Column(
      children: [
        Text(
          "${selectedDate.toLocal()}".split(' ')[0],style: TextStyle(
            color: TextColor,fontSize: 30.0,fontWeight: FontWeight.bold,Padding(
          padding: const EdgeInsets.only(top: 18.0),child: MaterialButton(
            shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(20.0)),elevation: 10.0,onPressed: () {
              selectDateTime(context);
            },color: ButtonColor,child: Text(
              'Select',style: TextStyle(
                fontSize: 15.0,color: Colors.white,);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      height: (MediaQuery.of(context).size.height) / 2,alignment: Alignment.center,child: Column(
        children: [
          Spacer(),CustomButtonDatePicker(Colors.redAccent,Colors.cyan[200]),Spacer(),CustomButtonDatePicker(Colors.cyan[200],Colors.redAccent),);
  }
}

我想对两个日期选择器使用selectDateTime（）函数，但是两个选择器的数据都相同。您能否建议我如何在不为另一个selectdate编写双重代码的情况下为两个日期选择器传递函数值

解决方法

在下面尝试我的代码：

class AgeCalcUI extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var AppBarHeight = MediaQuery.of(context).size.height;
    return Scaffold(
      appBar: AppBar(
        title: Text("All In One Cali"),),body: CustomDatePicker(),);
  }
}

enum DateSelection { first,second }

class CustomDatePicker extends StatefulWidget {
  @override
  _CustomDatePickerState createState() => _CustomDatePickerState();
}

class _CustomDatePickerState extends State<CustomDatePicker> {
  //getting the current date
  DateTime selectedDateFirst = DateTime.now();
  DateTime selectedDateSecond = DateTime.now();
  DateTime selectedDate = DateTime.now();

  Future<void> selectDateTime(
      BuildContext context,DateSelection dateSelection) async {
    final DateTime chosen = await showDatePicker(
      context: context,initialDate: selectedDate,firstDate: DateTime(1700),lastDate: DateTime(2030),initialDatePickerMode: DatePickerMode.year,);
    if (chosen != null && chosen != selectedDate) {
      setState(() {
        switch (dateSelection) {
          case DateSelection.first:
            selectedDateFirst = chosen;

            break;

          case DateSelection.second:
            selectedDateSecond = chosen;

            break;
        }
      });
    }
  }

  //widget for displaying and choosing date onTap
  Widget CustomButtonDatePicker(
      DateSelection dateSelection,Color ButtonColor,Color TextColor) {
    return Column(
      children: [
        Text(
          dateSelection == DateSelection.first
              ? "${selectedDateFirst.toLocal()}".split(' ')[0]
              : "${selectedDateSecond.toLocal()}".split(' ')[0],style: TextStyle(
            color: TextColor,fontSize: 30.0,fontFamily: 'DancingScript',fontWeight: FontWeight.bold,Padding(
          padding: const EdgeInsets.only(top: 18.0),child: MaterialButton(
            shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20.0)),elevation: 10.0,onPressed: () {
              selectDateTime(context,dateSelection);
            },color: ButtonColor,child: Text(
              'Select',style: TextStyle(
                fontSize: 15.0,color: Colors.white,],);
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      height: (MediaQuery.of(context).size.height) / 2,alignment: Alignment.center,child: Column(
        children: [
          Spacer(),CustomButtonDatePicker(
              DateSelection.first,Colors.redAccent,Colors.cyan[200]),Spacer(),CustomButtonDatePicker(
              DateSelection.second,Colors.cyan[200],Colors.redAccent),);
  }
}