仿苹果 底部弹窗 选择列表

showDialog(
                                  barrierDismissible: true,//是否点击空白区域关闭对话框,默认为true，可以关闭
                                  context: context,
                                  builder: (BuildContext context) {
                                    var list = List();
                                    list.add('拍摄照片');
                                    list.add('从相册选取');
                                    list.add('选择文件');
                                    return FHBottomSheet(
                                      list: list,
                                      onItemClickListener: (index) async {
                                        print(index);
                                        Navigator.pop(context);
                                      },
                                    );
                                  });
//                              print('点击跳转事件');
//                              List<File> files = await FilePicker.getMultiFile();
//                              print(files);
                            },



import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:te_guide/app/common/FHAdapt.dart';
import 'package:te_guide/app/common/FHColors.dart';

/// 底部弹出框
class FHBottomSheet extends StatefulWidget {
  FHBottomSheet({Key key, this.list, this.onItemClickListener})
      : assert(list != null),
        super(key: key);
  final list;
  final OnItemClickListener onItemClickListener;

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

typedef OnItemClickListener = void Function(int index);

class _FHBottomSheetState extends State<FHBottomSheet> {
  OnItemClickListener onItemClickListener;
  var itemCount;
  double itemHeight = 44.0;
  var borderColor = Colors.white;
  double circular = 10.0;

  @override
  void initState() {
    super.initState();
    onItemClickListener = widget.onItemClickListener;
  }

  @override
  Widget build(BuildContext context) {
    Orientation orientation = MediaQuery.of(context).orientation;
    Size screenSize = MediaQuery.of(context).size;

    var deviceWidth = orientation == Orientation.portrait
        ? screenSize.width
        : screenSize.height;

    /// *2-1是为了加分割线，最后还有一个cancel，所以加1
    itemCount = (widget.list.length) + 1;
    print(itemCount);
    var height = ((widget.list.length + 1) * 48).toDouble();
    var cancelContainer = Container(
        height: itemHeight,
        margin: EdgeInsets.only(left: 10.0, right: 10.0),
        decoration: BoxDecoration(
          color: Colors.white, // 底色
          borderRadius: BorderRadius.circular(circular),
        ),
        child: Center(
          child: GestureDetector(
            onTap: () {
              Navigator.pop(context);
            },
            child: Text(
              "取消",
              style: TextStyle(
                fontWeight: FontWeight.w400,
                decoration: TextDecoration.none,
                color: FHColors.btnColorBlue,
                fontSize: FHAdapt.px(32),
              ),
            ),
          ),
        ));
    var listview = ListView.builder(
        itemCount: itemCount,
        itemBuilder: (BuildContext context, int index) {
          if (index == itemCount - 1) {
            return new Container(
              child: cancelContainer,
              margin: const EdgeInsets.only(top: 10),
            );
          }
          return getItemContainer(context, index);
        });

    var totalContainer = Container(
      child: listview,
      height: height,
      width: deviceWidth * 0.98,
    );

    var stack = Stack(
      alignment: Alignment.center,
      children: <Widget>[
        Positioned(
          bottom: 0,
          child: totalContainer,
        ),
      ],
    );
    return stack;
  }

  Widget getItemContainer(BuildContext context, int index) {
    if (widget.list == null) {
      return Container();
    }

    var borderRadius;
    var margin;
    var border;
    var borderAll = Border.all(color: borderColor, width: 0.5);
    var borderSide = BorderSide(color: borderColor, width: 0.5);
    var isFirst = false;
    var isLast = false;

    /// 只有一个元素
    if (widget.list.length == 1) {
      borderRadius = BorderRadius.circular(circular);
      margin = EdgeInsets.only(bottom: 10, left: 10, right: 10);
      border = borderAll;
    } else if (widget.list.length > 1) {
      /// 第一个元素
      if (index == 0) {
        isFirst = true;
        borderRadius = BorderRadius.only(
            topLeft: Radius.circular(circular),
            topRight: Radius.circular(circular));
        margin = EdgeInsets.only(
          left: 10,
          right: 10,
        );
        border = Border(top: borderSide, left: borderSide, right: borderSide);
      } else if (index == itemCount - 2) {
        isLast = true;

        /// 最后一个元素
        borderRadius = BorderRadius.only(
            bottomLeft: Radius.circular(circular),
            bottomRight: Radius.circular(circular));

        margin = EdgeInsets.only(left: 10, right: 10);
        border =
            Border(bottom: borderSide, left: borderSide, right: borderSide);
      } else {
        /// 其他位置元素
        margin = EdgeInsets.only(left: 10, right: 10);
        border = Border(left: borderSide, right: borderSide);
      }
    }
    var isFirstOrLast = isFirst || isLast;
    int listIndex = index ~/ 2;
    var text = widget.list[index];
    var contentText = Text(
      text,
      style: TextStyle(
        fontWeight: FontWeight.w400,
        decoration: TextDecoration.none,
        color: FHColors.btnColorBlue,
        fontSize: FHAdapt.px(32),
      ),
    );

    var center;
    if (!isFirstOrLast) {
      center = Center(
        child: contentText,
      );
    }
    var itemContainer = Container(
        height: itemHeight,
        margin: margin,
        decoration: BoxDecoration(
          color: Colors.white, // 底色
          borderRadius: borderRadius,
          border: Border.all(width: 0.5, color: FHColors.backColorDivider),
        ),
        child: center);
    var onTap2 = () {
      if (onItemClickListener != null) {
        onItemClickListener(index);
      }
    };
    var stack = Stack(
      alignment: Alignment.center,
      children: <Widget>[itemContainer, contentText],
    );
    var getsture = GestureDetector(
      onTap: onTap2,
      child: isFirstOrLast ? stack : itemContainer,
    );
    return getsture;
  }
}