[ImageFooter] Fix photosModalBottomSheet
Signed-off-by: Sahil Kumar <[email protected]>
This commit is contained in:
+122
-113
@@ -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),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user