# 【Flutter】 下方選擇器 IOS風格
###### tags: `Flutter`

相關package
https://github.com/yangyxd/flutter_picker

類似做法
https://blog.csdn.net/iOS_PING/article/details/102567294

使用CupertinoDatePicker搭配showCupertinoModalPopup可以達到此效果

相關API
https://api.flutter.dev/flutter/cupertino/showCupertinoModalPopup.html
showCupertinoModalPopup通常搭配CupertinoActionSheet
https://api.flutter.dev/flutter/cupertino/CupertinoActionSheet-class.html

範例

  Future<DateTime> _cuperetinopopup() {
    var date = DateTime.now();
    return
      showCupertinoModalPopup(
      context: context,
      builder: (ctx) {
        return CupertinoActionSheet(
//          title: Text('Favorite Dessert'),
//          message:
//              Text('Please select the best dessert from the options below.'),
          actions: <Widget>[
            SizedBox(
              height: 200,
              child: CupertinoDatePicker(
                mode: CupertinoDatePickerMode.dateAndTime,
                minimumDate: date,
                maximumDate: date.add(
                  Duration(days: 30),
                ),
                maximumYear: date.year + 1,
                onDateTimeChanged: (DateTime value) {
                  print(value);
                },
              ),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                RaisedButton(child: Text("data"), onPressed: (){}),
                RaisedButton(child: Text("data"), onPressed: (){})
              ],
            ),
//            CupertinoActionSheetAction(
//              child: Text('Trifie'),
//              onPressed: () {
//                /** */
//              },
//            ),
          ],
//          cancelButton: CupertinoActionSheetAction(
//            isDefaultAction: true,
//            child: Text('Cancel'),
//            onPressed: () {
//              /** */
//            },
//          ),
        );
      },
    );
  }