How to put an iOS style dismissible bar on flutter modal sheet - flutter

Question

I am pretty new to flutter and trying to achieve a dismissible bar for my modalSheet. Something like this image:
I can only think of a stack. But that would make the code complex. Please let me know if there is a better way.

Answer 1

Is this what you are looking for modal_bottom_sheet:
showBarModalBottomSheet(
expand: true,
context: context,
backgroundColor: Colors.transparent,
builder: (context, scrollController) =>
ModalInsideModal(
scrollController: scrollController),
)),

Answer 2

To display showModalBottomSheet as IOS modal style:
1- Create new Dart Class IOSModalStyle with this full code:
import 'package:flutter/material.dart';
class IOSModalStyle extends StatelessWidget {
final Widget childBody;
const IOSModalStyle({
Key? key,
required this.childBody,
}) : super(key: key);
#override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.all(16.0),
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: const BorderRadius.all(Radius.circular(16.0)),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
_dividerWidget(),
Container(
decoration: BoxDecoration(
color: Colors.white, // color of card
borderRadius: const BorderRadius.all(Radius.circular(16.0)),
),
height: 200, // body container height
width: double.infinity,
child: childBody,
)
],
),
);
}
Widget _dividerWidget() {
return FractionallySizedBox(
widthFactor: 0.2, // width of top divider bar
child: Container(
margin: const EdgeInsets.symmetric( // margin of top divider bar
vertical: 12.0,
),
child: Container(
height: 5.0,
decoration: BoxDecoration(
color: Colors.white, // color of top divider bar
borderRadius: const BorderRadius.all(Radius.circular(2.5)),
),
),
),
);
}
}
2- You can call above class from anywhere like this:
showModalBottomSheet<void>(
isScrollControlled: true, // to full height
useSafeArea: true, // to show under status bar
backgroundColor: Colors.transparent, // to show BorderRadius of Container
context: context,
builder: (BuildContext context) {
return IOSModalStyle(
childBody: Center(
child: Text('Hello, Im Anas...'),
),
);
},
);
Result: