flutter 如何使用日期选择器软件包

omqzjyyz  于 2022-12-14  发布在  Flutter
关注(0)|答案(1)|浏览(119)

没有太多的文档说明如何在flutter中使用日期选择器包,但是由于某种原因日历没有显示出来,有没有办法能够制作日期范围选择器?
main.dart
第一个

kq0g1dla

kq0g1dla1#

您可以使用软件包date_time_picker
现在,您可以将此容器小部件放在小部件树中,以获得如下所示的结果

Container(
                  decoration: BoxDecoration(
                    border: Border.all(
                      color: Color(0xff8E8E8E),
                    ),
                    borderRadius: BorderRadius.circular(6),
                  ),
                  margin: EdgeInsets.only(top: 10),
                  child: Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: DateTimePicker(
                            decoration: InputDecoration(
                              border: InputBorder.none,
                            ),
                            dateMask: 'dd/MM/yyyy',
                            initialValue: DateTime.now().toString(),
                            type: DateTimePickerType.date,
                            style: TextStyle(
                              fontWeight: FontWeight.w400,
                              fontSize:16,
                              fontFamily: 'Poppins',
                              color: Color(0xff362477),
                            ),
                            firstDate: DateTime(1800),
                            lastDate: DateTime(2050),
                            // This will add one year from current date
                            validator: (value) {
                              return null;
                            },
                            onChanged: (value) {
                              if (value.isNotEmpty) {
                                setState(() {
                                  // _selectedDate = value;
                                });
                              }
                            },
                            onSaved: (value) {
                              if (value!.isNotEmpty) {
                                // _selectedDate = value;
                              }
                            },
                          ),
                        ),
                        Expanded(
                          child: Padding(
                            padding:
                                const EdgeInsets.symmetric(horizontal: 150),
                            child: Icon(
                              Icons.calendar_today_outlined,
                              color: Colors.grey,
                              size: 20,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ),

相关问题