[ImageFooter] Fix photosModalBottomSheet

Signed-off-by: Sahil Kumar <[email protected]>
This commit is contained in:
Sahil Kumar
2021-01-14 17:15:10 +05:30
parent ebc5ada241
commit 2e31ed077b
+122 -113
View File
@@ -174,129 +174,138 @@ class _ImageFooterState extends State<ImageFooter> {
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
barrierColor: StreamChatTheme.of(context).colorTheme.overlay, barrierColor: StreamChatTheme.of(context).colorTheme.overlay,
shape: RoundedRectangleBorder( backgroundColor: StreamChatTheme.of(context).colorTheme.white,
borderRadius: BorderRadius.circular(16.0), isScrollControlled: true,
shape: const RoundedRectangleBorder(
borderRadius: const BorderRadius.only(
topLeft: const Radius.circular(16.0),
topRight: const Radius.circular(16.0),
),
), ),
builder: (context) { builder: (context) {
return Column( final crossAxisCount = 3;
mainAxisSize: MainAxisSize.min, final noOfRowToShowInitially =
children: [ widget.mediaAttachments.length > 3 ? 2 : 1;
Container( final size = MediaQuery.of(context).size;
decoration: BoxDecoration( final initialChildSize =
color: StreamChatTheme.of(context).colorTheme.white, 48 + (size.width * noOfRowToShowInitially) / crossAxisCount;
borderRadius: BorderRadius.only( return DraggableScrollableSheet(
topRight: Radius.circular(16.0), expand: false,
topLeft: Radius.circular(16.0), initialChildSize: initialChildSize / size.height,
)), builder: (context, scrollController) {
child: Stack( return SingleChildScrollView(
controller: scrollController,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [ children: [
Center( Stack(
child: Padding( children: [
padding: const EdgeInsets.all(16.0), Center(
child: Text( child: Padding(
'Photos', padding: const EdgeInsets.all(16.0),
style: child: Text(
StreamChatTheme.of(context).textTheme.headlineBold, 'Photos',
style: StreamChatTheme.of(context)
.textTheme
.headlineBold,
),
),
), ),
), Align(
alignment: Alignment.centerRight,
child: IconButton(
icon: StreamSvgIcon.close(
color: StreamChatTheme.of(context).colorTheme.black,
),
onPressed: () => Navigator.maybePop(context),
),
),
],
), ),
Align( Flexible(
alignment: Alignment.centerRight, child: GridView.builder(
child: IconButton( shrinkWrap: true,
icon: StreamSvgIcon.close( physics: const NeverScrollableScrollPhysics(),
color: StreamChatTheme.of(context).colorTheme.black, itemCount: widget.mediaAttachments.length,
padding: const EdgeInsets.all(1),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: crossAxisCount,
mainAxisSpacing: 2.0,
crossAxisSpacing: 2.0,
), ),
onPressed: () => Navigator.maybePop(context), itemBuilder: (context, index) {
Widget media;
final attachment = widget.mediaAttachments[index];
if (attachment.type == 'video') {
var controllerPackage = widget.videoPackages[
videoAttachments.indexOf(attachment)];
media = InkWell(
onTap: () => widget.mediaSelectedCallBack(index),
child: FittedBox(
fit: BoxFit.cover,
child: Chewie(
controller: controllerPackage.chewieController,
),
),
);
} else {
media = InkWell(
onTap: () => widget.mediaSelectedCallBack(index),
child: AspectRatio(
child: CachedNetworkImage(
imageUrl: attachment.imageUrl ??
attachment.assetUrl ??
attachment.thumbUrl,
fit: BoxFit.cover,
),
aspectRatio: 1.0,
),
);
}
return Stack(
children: [
media,
Padding(
padding: EdgeInsets.all(8.0),
child: Container(
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: StreamChatTheme.of(context)
.colorTheme
.white
.withOpacity(0.6),
boxShadow: [
BoxShadow(
blurRadius: 8.0,
color: StreamChatTheme.of(context)
.colorTheme
.black
.withOpacity(0.3),
),
],
),
padding: const EdgeInsets.all(1),
child: UserAvatar(
user: widget.message.user,
constraints:
BoxConstraints.tight(Size(24, 24)),
showOnlineStatus: false,
),
),
),
],
);
},
), ),
), ),
], ],
), ),
), );
Container( },
color: StreamChatTheme.of(context).colorTheme.white,
child: GridView.builder(
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemBuilder: (context, position) {
Widget media;
if (widget.mediaAttachments[position].type == 'video') {
var controllerPackage = widget.videoPackages[
videoAttachments
.indexOf(widget.mediaAttachments[position])];
media = InkWell(
onTap: () {
widget.mediaSelectedCallBack(position);
},
child: FittedBox(
fit: BoxFit.cover,
child: Chewie(
controller: controllerPackage.chewieController,
),
),
);
} else {
media = InkWell(
onTap: () {
widget.mediaSelectedCallBack(position);
},
child: Padding(
padding: const EdgeInsets.all(1.0),
child: AspectRatio(
child: CachedNetworkImage(
imageUrl: widget
.mediaAttachments[position].imageUrl ??
widget.mediaAttachments[position].assetUrl ??
widget.mediaAttachments[position].thumbUrl,
fit: BoxFit.cover,
),
aspectRatio: 1.0,
),
),
);
}
return Stack(
children: [
media,
Padding(
padding: EdgeInsets.all(8.0),
child: Container(
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: StreamChatTheme.of(context)
.colorTheme
.white
.withOpacity(0.6),
boxShadow: [
BoxShadow(
blurRadius: 8.0,
color: StreamChatTheme.of(context)
.colorTheme
.black
.withOpacity(0.3),
),
],
),
padding: const EdgeInsets.all(1),
child: UserAvatar(
user: widget.message.user,
constraints: BoxConstraints.tight(Size(24, 24)),
showOnlineStatus: false,
),
),
),
],
);
},
itemCount: widget.mediaAttachments.length,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3),
),
),
],
); );
}, },
); );