I have bottomsheet with ListView and a textField, I want the bottomSheet to scroll up when the keyboard appears, But it is not. Here is my code
Future<void> _bottomSheetMore(context, PostId postId, showLikes) async {
if (homeController.getShowModalBottomSheet) {
return;
}
homeController.setModalBottomSheet(true);
await Future<void>.delayed(
const Duration(milliseconds: 10),
() => showModalBottomSheet<void>(
context: context,
isScrollControlled: true,
builder: (_) => CommentWidget(
post: postId,
),
),
);
homeController.setModalBottomSheet(false);}
Widget containing ListView and TextField
class _CommentWidgetState extends State<CommentWidget> {
@override
void initState() {
Future.delayed(Duration.zero, () => getAllComments(widget.post.id));
super.initState();
}
final TextEditingController commentController = TextEditingController();
final FeedsController _feedsController = Get.find();
@override
void dispose() {
commentController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 20.0),
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'Comments',
style: titleLargeTextStyle.copyWith(
fontSize: 22, fontWeight: FontWeight.w600),
),
const SizedBox(
height: 20,
),
widget.post.totalcomments == '0'
? const Center(
child: Text(
'Oops! No one has commented yet, Be the first one to comment.'),
)
: Obx(() => _feedsController.isLoading.value
? const Center(
child: CircularProgressIndicator(
color: gradientBlue,
))
: SizedBox(
height: size.height * 0.3,
child: ListView.builder(
itemBuilder: (ctx, index) => CommentItemWidget(
comment:
_feedsController.getPostComments[index]),
itemCount:
_feedsController.getPostComments.length,
),
))
],
),
),
),
const Spacer(),
const Divider(
color: colorSubtitle,
),
Row(
children: [
Expanded(
child: TextField(
controller: commentController,
decoration: const InputDecoration(
hintText: 'Type your comment here...',
hintStyle: titleMediumTextStyle,
border: InputBorder.none,
focusedBorder: InputBorder.none),
)),
IconButton(onPressed: () {}, icon: SvgPicture.asset(emoji)),
Container(
margin: const EdgeInsets.only(right: 10, bottom: 5),
decoration: BoxDecoration(
shape: BoxShape.circle,
gradient: RallyRateAppTheme.blueGradient),
child: IconButton(
onPressed: () async {
await _feedsController.addCommentToPost(
commentController.text,
widget.post.userId,
widget.post.id);
commentController.text = '';
},
icon: SvgPicture.asset(icSendBtn)))
],
)
],
);
}
Future<List<Comment>> getAllComments(String postID) async {
return await _feedsController.getPostsComments(postID);
}
}
I've tried solutions from the below link which suggests to set paddingInsets and isScrollControlled: true, but it covers whole screen when bottom sheet opens without textField focus
and this was the result
What I want is that bottomSheet only moves up when user is writing in textField.