juiShowBottomSheet function

Future juiShowBottomSheet({
  1. required BuildContext context,
  2. required Widget child,
  3. Color? backgroundColor,
  4. bool isDismissible = true,
  5. bool enableDrag = true,
  6. double? borderRadius,
})

Janela que abre em resposta a uma ação do usuário, deslizando de baixo para cima e sobrepondo completamente o conteúdo da página. Utilize o Widget JuiTopBarSheet para padronização da barra superior do sheet.

Para que o conteúdo final seja rolável, a função juiShowBottomSheet deve ser utilizada em conjunto com o widget JuiDraggableSheet.

Para conteúdos roláveis (recomendado): onTap: () { juiShowBottomSheet( context: context, child: JuiDraggableSheet( builder: (context, _controller) { return Column( children: [ JuiTopBarSheet(sheetTitle: "Recuperar senha"), Expanded( child: ListView( controller: widget.controller, children: SizedBox(height: 32.0), ... , ), ), ], ), }, ), ); },

Para conteúdos não roláveis: onTap: () { juiShowBottomSheet( context: context, child: Column( children: JuiTopBarSheet(), Widget(...), , ), ); },

Implementation

Future<dynamic> juiShowBottomSheet({
  required BuildContext context,
  required Widget child,
  Color? backgroundColor,
  bool isDismissible = true,
  bool enableDrag = true,
  double? borderRadius,
}) async {
  return showModalBottomSheet(
    context: context,
    isScrollControlled: true,
    enableDrag: enableDrag,
    isDismissible: isDismissible,
    backgroundColor: backgroundColor,
    barrierColor: JuiColors.black.withOpacity(0.5),
    clipBehavior: Clip.antiAlias,
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.vertical(
        top: Radius.circular(borderRadius ?? JuiBreakpoints.b16),
      ),
    ),
    builder: (BuildContext context) => Padding(
      padding: MediaQuery.of(context).viewInsets,
      child: child,
    ),
  );
}