效果圖

調(diào)用：

    List<CustomBottomSheetTitleModel> modelList = [
      CustomBottomSheetTitleModel('男'),
      CustomBottomSheetTitleModel('女'),
      CustomBottomSheetTitleModel('其他'),
      CustomBottomSheetTitleModel('保密'),
    ];
    CustomBottomSheet.showTitleSheet(context, modelList, (index) {
      print('----------${index}');
    });

實(shí)現(xiàn)：

class CustomBottomSheetTitleModel {

  final String title;

  final TextStyle? textStyle;

  final VoidCallback? onTapCallback;

  CustomBottomSheetTitleModel(this.title, {this.textStyle, this.onTapCallback});
}

/// 點(diǎn)擊按鈕回調(diào)
typedef CustomBottomSheetOnTapCallback = void Function(int index);

class CustomBottomSheet {

  /// 顯示純文字
  static Future<void> showTitleSheet(
      BuildContext context,
      List<CustomBottomSheetTitleModel> modelList,
      CustomBottomSheetOnTapCallback sheetOnTapCallback) async {
    return await showModalBottomSheet(
      context: context,
      backgroundColor: Colors.transparent, //重點(diǎn) 去除黑色背景顏色 實(shí)現(xiàn)圓角
      isScrollControlled: true, // 不限制高度
      builder: (BuildContext context) {

        return GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: () {
            Navigator.of(context).pop();
          },
          child: Container(
            alignment: Alignment.bottomCenter,
            height: MediaQuery.of(context).size.height,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Container(
                  height: 5,
                  width: 20,
                  decoration: const BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.all(Radius.circular(3)),
                  ),
                ),
                const SizedBox(height: 10),
                Container(
                  padding: const EdgeInsets.symmetric(vertical: 32),
                  decoration: const BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(32),
                      topRight: Radius.circular(32),
                    ),
                  ),
                  child: ListView.builder(
                    physics: const NeverScrollableScrollPhysics(),
                    itemCount: modelList.length,
                    shrinkWrap: true,
                    itemBuilder: (context, index) {
                      return GestureDetector(
                        behavior: HitTestBehavior.opaque,
                        onTap: () {
                          Navigator.of(context).pop();
                          sheetOnTapCallback(index);
                          if (index < modelList.length) {
                            modelList[index].onTapCallback?.call();
                          }
                        },
                        child: Container(
                          alignment: Alignment.center,
                          padding: const EdgeInsets.symmetric(vertical: 10),
                          child: Text(
                            modelList[index].title,
                            style: modelList[index].textStyle ?? const TextStyle(color: Colors.black),
                          ),
                        ),
                      );
                    },
                  ),
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}