Сброс опции радио, выбранной, когда dateRange выбран в Flutter - PullRequest
0 голосов
/ 02 октября 2019

Моя панель инструментов имеет нижнюю таблицу, похожую на this , которая состоит из параметров радио и средства выбора даты. Что я хочу сделать, если выбран диапазон дат, то параметр радио отменен, я хочу, чтобы любойбыть выбран не оба. дайте мне знать, если есть какие-либо изменения, спасибо

Здесь я добавляю свой код

import 'package:flutter/material.dart';
import 'package:datetime_picker_formfield/datetime_picker_formfield.dart'; //USED WHEN DATE ENABLED
import 'package:intl/intl.dart';

class DashboardFilter extends StatefulWidget {
  @override
  _DashboardFilterState createState() => _DashboardFilterState();

  final ValueChanged<List<Map<Object, Object>>> parentAction;
  var globalData;
  Map<String, int> timeSelected;

  DashboardFilter(
      {Key key,
      this.parentAction,
      this.timeSelected,
      this.globalData})
      : super(key: key);
}

class _DashboardFilterState extends State<DashboardFilter> {
  var radioSelected;

  @override
  void initState() {
    super.initState();
    radioSelected = widget.timeSelected.keys.firstWhere(
        (k) => widget.timeSelected[k] == 1,  //here I am setting the default radio button value
        orElse: () => null);
  }

  void showModalSheet() {
    List<Map<String, Object>> timeData = List<Map<String, Object>>();
    Map<String, Object> tData = Map<String, Object>();
    widget.globalData['dashboardTimestamps']
        .map((data) => {
              tData = data,
              timeData.add(tData),
            })
        .toList();

    showModalBottomSheet<void>(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0),
        ),
        context: context,
        builder: (BuildContext context) {
          return StatefulBuilder(
              builder: (BuildContext context, StateSetter state) {
            return createBox(context,timeData, state);
          });
        });
  }

  createBox(BuildContext context,List<Map<String, Object>> time, StateSetter state) {
    DateTime toDate;
    DateTime fromDate;

    var timeData = time.map<Widget>((data) {
      var id = data["id"];
      var dispId = data["displayId"];
      return radiogen(context, id, dispId, state);
    }).toList();

    return SingleChildScrollView(
      child: LimitedBox(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[

            Row(children: <Widget>[Expanded(child: Divider())]),
            Container(
              child: Column(
                children: timeData,
              ),
            ),
            Padding(
              child: Row(children: <Widget>[
                Text("Or select a custom date of your choice",
                style: TextStyle(
                      fontSize: 17.0,
                      fontWeight: FontWeight.bold,
                      color: Colors.grey),
                ),
              ]),
            ),

            Padding(
                padding: const EdgeInsets.symmetric(
                  horizontal: 27.0,
                  vertical: 5.0,
                ),
                child: Column(
                  children: <Widget>[
                    DateTimePickerFormField(
                      initialDate: DateTime.now(),
                      firstDate: DateTime(2019),
                      lastDate: DateTime.now(),
                      inputType: InputType.both,
                      format: DateFormat("EEEE, MMMM d, yyyy 'at' h:mma"),
                      editable: false,
                      decoration: InputDecoration(
                          labelText: 'From Date', hasFloatingPlaceholder: false),
                      onChanged: (dt) {
                        setState(() => fromDate = dt);
                        print('Selected date: $fromDate');
                      },
                    ),
                    DateTimePickerFormField(
                      initialDate: DateTime.now(),
                      firstDate: DateTime(2019),
                      lastDate: DateTime.now(),
                      inputType: InputType.both,
                      format: DateFormat("EEEE, MMMM d, yyyy 'at' h:mma"),
                      editable: false,
                      decoration: InputDecoration(
                          labelText: 'To Date', hasFloatingPlaceholder: false),
                      onChanged: (dt) {
                        setState(() => toDate = dt);
                        print('Selected date: $toDate');
                      },
                    ),
                  ],
                )),
            ButtonBar(
              alignment: MainAxisAlignment.center,
              children: <Widget>[
                new RaisedButton(
                  onPressed: () {
                    widget.parentAction(generateUserAction(widget.timeSelected));
                    Navigator.of(context).pop();
                  },
                  child: Text('GO'),
                ), ],  ), ],   ),  ),
    );
  }

  generateUserAction(Map<String, int> tiMap) {
    List<Map<Object, Object>> userList = List<Map<Object, Object>>();
    userList.add(tiMap);
    return userList;
  }


  _handleRadioValueChange1(var value, StateSetter state) {
    setState(() {
      radioSelected = value;
      switch (radioSelected) {
        case "today":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastThirtyMinutes":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastOneHour":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastThreeHour":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastSixHour":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastTwelveHour":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
        case "lastTwentyFourHour":
          widget.timeSelected.clear();
          widget.timeSelected[value] = 1;
          break;
      }
    });
  }

  Widget radiogen(
      BuildContext context, var id, var disp, StateSetter stateSetter) {
    return Container(
      padding: EdgeInsets.all(8.0),
      child: new Column(
        children: <Widget>[
          new Row(
            children: <Widget>[
              new Radio(
                  value: id,
                  groupValue: radioSelected,
                  onChanged: (value) {
                    stateSetter(() {
                      _handleRadioValueChange1(value, stateSetter);
                    });
                  }),
              new Text(
                disp,
                style: new TextStyle(fontSize: 16.0),
              ),
            ],
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: IconButton(
          icon: new Icon(Icons.more_horiz), onPressed: showModalSheet),
    );
  }
}

В приведенном выше коде я получаю отображаемое имя переключателя, нажимая API и сохраняя его вкарта, и я передаю значения конструктора этому классу из другого файла, т.е. выбранное время содержит: {"today": 1, "lastThirtyMinutes": 0, "lastOneHour": 0, "lastThreeHour": 0, "lastSixHour": 0, "lastTwelveHour": 0, "lastTwentyFourHour": 0};

globalData содержит: карту, для которой выбирается displayName для радиокнопки.

т.е.

"dashboardTimestamps": [
        {
            "id": "today",
            "displayId": "Today"
        },
        {
            "id": "lastThirtyMinutes",
            "displayId": "Last 30 Minutes"
        },
        {
            "id": "lastOneHour",
            "displayId": "Last Hour"
        },
        {
            "id": "lastThreeHour",
            "displayId": "Last 3 Hour"
        },
        {
            "id": "lastSixHour",
            "displayId": "Last 6 Hour"
        },
        {
            "id": "lastTwelveHour",
            "displayId": "Last 12 Hour"
        },
        {
            "id": "lastTwentyFourHour",
            "displayId": "Last 24 Hour"
        }
...