Как я могу скрыть день из средства выбора даты в Купертино

#dart #flutter

#dart #flutter

Вопрос:

мне нужно указать только год и месяц из средства выбора даты, так как я могу скрыть день из средства выбора даты.

 CupertinoDatePicker(
    initialDateTime: DateTime.now(),
    onDateTimeChanged: (DateTime newdate) {
        print(newdate);
        widget.card.expDateTime = newdate.toString();
         dateCnt.text = newdate.toString().split(" ")[0];
    },
    minimumYear: DateTime.now().year,
    minimumDate: DateTime.now(),
    mode: CupertinoDatePickerMode.date,
)
  

Комментарии:

1. Вам нужен пользовательский интерфейс для выбора даты без дня? Или просто хотите игнорировать день после выбора даты?

2. мне нужно скрыть день из средства выбора даты.

Ответ №1:

У меня была эта проблема, я попробовал пакет flutter_cupertino_date_picker, но, похоже, у него нет возможности форматировать только месяц и год, исключая день, поэтому вам нужно запрограммировать на нем, чтобы расширить возможности. Мне показалось более логичным изменить сборку в CupertinoDatePicker, которая поставляется с Flutter, что я сделал, так это скопировал все содержимое ‘/Users/your_user_name /developer / flutter / packages / flutter/lib / src / cupertino / date_picker.dart’ в другой файл в моей локальной среде, я вызвал cupertino_picker_extended.dart , затем (потому что мне нужен был быстрый способ) в строке 1182 я изменил: Text(localizations.datePickerDayOfMonth(day),... для Text('',...

Затем, когда вам нужно использовать настраиваемый инструмент выбора, назовите его следующим образом:

 import 'package:local_app/ui/widgets/cupertino_picker_extended.dart' as CupertinoExtended;
  

и использовать его:

   CupertinoExtended.CupertinoDatePicker(
    onDateTimeChanged: (DateTime value) {
      setDate('${value.month}/${value.year}', setDateFunction,
          section, arrayPos);
    },
    initialDateTime: DateTime.now(),
    mode: CupertinoExtended.CupertinoDatePickerMode.date,
  ),
  

Вот результат:
скриншот

Надеюсь, это поможет кому-нибудь и сэкономит время, я искал простое и быстрое решение своей проблемы.

Ответ №2:

вы должны посмотреть на пакет flutter_cupertino_date_picker, чтобы сделать это. вы можете избежать выбора даты пользователем.

приведенный ниже пример я отредактировал по вашему желанию. я надеюсь, что это поможет вам достичь того, чего вы хотите.

   import 'package:flutter/material.dart';
  import 'package:flutter_cupertino_date_picker/flutter_cupertino_date_picker.dart';

  void main() => runApp(MyApp());

  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: 'Date Picker Demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        home: MyHomePage(),
      );
    }
  }

  class MyHomePage extends StatefulWidget {
    MyHomePage({Key key}) : super(key: key);

    @override
    _MyHomePageState createState() => _MyHomePageState();
  }

  class _MyHomePageState extends State<MyHomePage> {
    String _datetime = '';
    int _year = 2018;
    int _month = 11;

    String _lang = 'en';
    String _format = 'yyyy-mm';
    bool _showTitleActions = true;

    TextEditingController _langCtrl = TextEditingController();
    TextEditingController _formatCtrl = TextEditingController();

    @override
    void initState() {
      super.initState();
      _langCtrl.text = 'zh';
      _formatCtrl.text = 'yyyy-mm';

      DateTime now = DateTime.now();
      _year = now.year;
      _month = now.month;
    }

    /// Display date picker.
    void _showDatePicker() {
      final bool showTitleActions = false;
      DatePicker.showDatePicker(
        context,
        showTitleActions: _showTitleActions,
        minYear: 1970,
        maxYear: 2020,
        initialYear: _year,
        initialMonth: _month,
        confirm: Text(
          'custom ok',
          style: TextStyle(color: Colors.red),
        ),
        cancel: Text(
          'custom cancel',
          style: TextStyle(color: Colors.cyan),
        ),
        locale: _lang,
        dateFormat: _format,
        onChanged: (year, month,date) {
          debugPrint('onChanged date: $year-$month');

          if (!showTitleActions) {
            _changeDatetime(year, month);
          }
        },
        onConfirm: (year, month,date) {
          _changeDatetime(year, month);
        },
      );
    }

    void _changeDatetime(int year, int month) {
      setState(() {
        _year = year;
        _month = month;
        _datetime = '$year-$month';
      });
    }

    @override
    Widget build(BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text('Date Picker Demo'),
        ),
        body: Container(
          padding: EdgeInsets.symmetric(horizontal: 16.0),
          child: Column(
            children: <Widget>[
              // show title actions checkbox
              Row(
                children: <Widget>[
                  Text(
                    'Show title actions',
                    style: TextStyle(fontSize: 16.0),
                  ),
                  Checkbox(
                    value: _showTitleActions,
                    onChanged: (value) {
                      setState(() {
                        _showTitleActions = value;
                      });
                    },
                  )
                ],
              ),

              // Language input field
              TextField(
                controller: _langCtrl,
                keyboardType: TextInputType.url,
                decoration: InputDecoration(
                  labelText: 'Language',
                  hintText: 'en',
                  hintStyle: TextStyle(color: Colors.black26),
                ),
                onChanged: (value) {
                  _lang = value;
                },
              ),

              // Formatter input field
              TextField(
                controller: _formatCtrl,
                keyboardType: TextInputType.url,
                decoration: InputDecoration(
                  labelText: 'Formatter',
                  hintText: 'yyyy-mm-dd / yyyy-mmm-dd / yyyy-mmmm-dd',
                  hintStyle: TextStyle(color: Colors.black26),
                ),
                onChanged: (value) {
                  _format = value;
                },
              ),

              // Selected date
              Container(
                margin: EdgeInsets.only(top: 40.0),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    Text(
                      'Selected Date:',
                      style: Theme.of(context).textTheme.subhead,
                    ),
                    Container(
                      padding: EdgeInsets.only(left: 12.0),
                      child: Text(
                        '$_datetime',
                        style: Theme.of(context).textTheme.title,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: _showDatePicker,
          tooltip: 'Show DatePicker',
          child: Icon(Icons.date_range),
        ),
      );
    }
  }
  

Ответ №3:

В пакете flutter_cupertino_date_picker были обновления. Теперь вы можете указать формат даты

  DatePicker.showDatePicker(context,
            maxDateTime: DateTime.now(),
              dateFormat:'MMMM-yyyy'
            );
  

введите описание изображения здесь

Ответ №4:

Это правильный путь

   Widget datetime() {
return CupertinoDatePicker(
  initialDateTime: DateTime.now(),
  onDateTimeChanged: (DateTime newdate) {
    print(newdate);
  },
  minimumYear: 2010,
  maximumYear: 2030,
  mode: CupertinoDatePickerMode.date,
);
  

}