customBottomSheet function

void customBottomSheet({
  1. required BuildContext context,
  2. Widget? child,
  3. String? title,
  4. TextStyle? titleTxtStyle,
  5. String? supTitle,
  6. double borderRadius = 30,
  7. double? titleBottomPadding,
  8. double? sheetHeightFraction,
  9. Color? bgColor,
  10. bool hasPillGesture = true,
  11. bool isScrollControlled = true,
  12. VoidCallback? onWillPop,
})

Implementation

void customBottomSheet({
  required BuildContext context,
  Widget? child,
  String? title,
  TextStyle? titleTxtStyle,
  String? supTitle,
  double borderRadius = 30,
  double? titleBottomPadding,
  double? sheetHeightFraction,
  Color? bgColor,
  bool hasPillGesture = true,
  bool isScrollControlled = true,
  VoidCallback? onWillPop,
}) {
  showModalBottomSheet(
    isScrollControlled: isScrollControlled,
    context: context,
    builder: (_) {
      final theme = Theme.of(context);
      return PopScope(
        onPopInvokedWithResult: (bool canPop, dynamic data) {
          if (onWillPop != null) {
            onWillPop();
          }
        },
        child: Padding(
          padding: EdgeInsets.only(
            bottom: MediaQuery.of(context).viewInsets.bottom,
          ),
          child: FractionallySizedBox(
            heightFactor: sheetHeightFraction,
            child: Container(
              padding: const EdgeInsets.all(16.0),
              decoration: BoxDecoration(
                color: bgColor ?? theme.canvasColor,
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(borderRadius),
                  topRight: Radius.circular(borderRadius),
                ),
              ),
              child: SingleChildScrollView(
                reverse: true,
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    if (hasPillGesture) const PillGesture(),
                    if (title != null)
                      Padding(
                        padding: EdgeInsets.only(
                          bottom: titleBottomPadding ?? 16.0,
                        ),
                        child: Column(
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            Text(
                              title,
                              style:
                                  titleTxtStyle ??
                                  theme.textTheme.titleMedium?.copyWith(
                                    fontWeight: FontWeight.w600,
                                  ) ??
                                  const TextStyle(
                                    fontSize: 18,
                                    fontWeight: FontWeight.w600,
                                  ),
                            ),
                            if (supTitle != null)
                              Text(
                                supTitle,
                                style:
                                    theme.textTheme.bodySmall?.copyWith(
                                      color: Colors.grey[600],
                                    ) ??
                                    const TextStyle(
                                      fontSize: 14,
                                      color: Colors.grey,
                                    ),
                              ),
                          ],
                        ),
                      ),
                    if (child != null) child,
                  ],
                ),
              ),
            ),
          ),
        ),
      );
    },
  );
}