2021-10-26 16:50:34 +00:00
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
|
|
|
|
import 'package:flutter_blurhash/flutter_blurhash.dart';
|
|
|
|
import 'package:matrix/matrix.dart';
|
2020-11-17 11:59:34 +00:00
|
|
|
|
2021-11-09 20:32:16 +00:00
|
|
|
import 'package:fluffychat/pages/image_viewer/image_viewer.dart';
|
2022-07-29 16:24:59 +00:00
|
|
|
import 'package:fluffychat/widgets/mxc_image.dart';
|
2020-04-28 12:11:56 +00:00
|
|
|
|
2022-07-29 16:24:59 +00:00
|
|
|
class ImageBubble extends StatelessWidget {
|
2020-04-02 12:05:32 +00:00
|
|
|
final Event event;
|
2020-05-16 06:02:33 +00:00
|
|
|
final bool tapToView;
|
2020-05-16 07:16:46 +00:00
|
|
|
final BoxFit fit;
|
2020-05-20 17:29:26 +00:00
|
|
|
final bool maxSize;
|
2022-01-29 11:35:03 +00:00
|
|
|
final Color? backgroundColor;
|
2020-09-03 10:58:54 +00:00
|
|
|
final bool thumbnailOnly;
|
2021-08-07 17:36:42 +00:00
|
|
|
final bool animated;
|
2021-07-19 16:23:47 +00:00
|
|
|
final double width;
|
|
|
|
final double height;
|
2022-01-29 11:35:03 +00:00
|
|
|
final void Function()? onTap;
|
2020-04-02 12:05:32 +00:00
|
|
|
|
2020-05-16 07:16:46 +00:00
|
|
|
const ImageBubble(
|
|
|
|
this.event, {
|
|
|
|
this.tapToView = true,
|
2020-05-20 17:29:26 +00:00
|
|
|
this.maxSize = true,
|
|
|
|
this.backgroundColor,
|
2020-05-16 07:16:46 +00:00
|
|
|
this.fit = BoxFit.cover,
|
2020-09-03 10:58:54 +00:00
|
|
|
this.thumbnailOnly = true,
|
2021-07-19 16:23:47 +00:00
|
|
|
this.width = 400,
|
|
|
|
this.height = 300,
|
2021-08-07 17:36:42 +00:00
|
|
|
this.animated = false,
|
2021-07-24 15:55:32 +00:00
|
|
|
this.onTap,
|
2023-10-28 11:03:16 +00:00
|
|
|
super.key,
|
|
|
|
});
|
2020-04-02 12:05:32 +00:00
|
|
|
|
2022-07-29 16:24:59 +00:00
|
|
|
Widget _buildPlaceholder(BuildContext context) {
|
|
|
|
if (event.messageType == MessageTypes.Sticker) {
|
|
|
|
return const Center(
|
|
|
|
child: CircularProgressIndicator.adaptive(),
|
|
|
|
);
|
2020-09-03 10:58:54 +00:00
|
|
|
}
|
2022-07-29 16:24:59 +00:00
|
|
|
final String blurHashString =
|
|
|
|
event.infoMap['xyz.amorgan.blurhash'] is String
|
|
|
|
? event.infoMap['xyz.amorgan.blurhash']
|
|
|
|
: 'LEHV6nWB2yk8pyo0adR*.7kCMdnj';
|
|
|
|
final ratio = event.infoMap['w'] is int && event.infoMap['h'] is int
|
|
|
|
? event.infoMap['w'] / event.infoMap['h']
|
|
|
|
: 1.0;
|
|
|
|
var width = 32;
|
|
|
|
var height = 32;
|
|
|
|
if (ratio > 1.0) {
|
|
|
|
height = (width / ratio).round();
|
2020-11-17 11:59:34 +00:00
|
|
|
} else {
|
2022-07-29 16:24:59 +00:00
|
|
|
width = (height * ratio).round();
|
2020-11-17 11:59:34 +00:00
|
|
|
}
|
2022-07-29 16:24:59 +00:00
|
|
|
return SizedBox(
|
|
|
|
width: this.width,
|
|
|
|
height: this.height,
|
|
|
|
child: BlurHash(
|
|
|
|
hash: blurHashString,
|
2020-11-17 11:59:34 +00:00
|
|
|
decodingWidth: width,
|
|
|
|
decodingHeight: height,
|
2022-07-29 16:24:59 +00:00
|
|
|
imageFit: fit,
|
|
|
|
),
|
2020-11-17 11:59:34 +00:00
|
|
|
);
|
2020-09-03 10:58:54 +00:00
|
|
|
}
|
|
|
|
|
2022-07-29 16:24:59 +00:00
|
|
|
void _onTap(BuildContext context) {
|
|
|
|
if (onTap != null) {
|
|
|
|
onTap!();
|
|
|
|
return;
|
2020-11-17 11:59:34 +00:00
|
|
|
}
|
2022-07-29 16:24:59 +00:00
|
|
|
if (!tapToView) return;
|
|
|
|
showDialog(
|
2023-08-13 11:41:01 +00:00
|
|
|
context: context,
|
2022-07-29 16:24:59 +00:00
|
|
|
useRootNavigator: false,
|
|
|
|
builder: (_) => ImageViewer(event),
|
|
|
|
);
|
2020-04-02 12:05:32 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
@override
|
|
|
|
Widget build(BuildContext context) {
|
2021-11-13 19:17:11 +00:00
|
|
|
return InkWell(
|
2022-07-29 16:24:59 +00:00
|
|
|
onTap: () => _onTap(context),
|
2021-11-13 19:17:11 +00:00
|
|
|
child: Hero(
|
2022-07-29 16:24:59 +00:00
|
|
|
tag: event.eventId,
|
2021-11-13 19:17:11 +00:00
|
|
|
child: AnimatedSwitcher(
|
2023-01-07 08:22:31 +00:00
|
|
|
duration: const Duration(seconds: 1),
|
2021-11-13 19:17:11 +00:00
|
|
|
child: Container(
|
2022-07-29 16:24:59 +00:00
|
|
|
constraints: maxSize
|
|
|
|
? BoxConstraints(
|
|
|
|
maxWidth: width,
|
|
|
|
maxHeight: height,
|
|
|
|
)
|
2021-11-13 19:17:11 +00:00
|
|
|
: null,
|
2022-07-29 16:24:59 +00:00
|
|
|
child: MxcImage(
|
|
|
|
event: event,
|
|
|
|
width: width,
|
|
|
|
height: height,
|
|
|
|
fit: fit,
|
|
|
|
animated: animated,
|
|
|
|
isThumbnail: thumbnailOnly,
|
|
|
|
placeholder: _buildPlaceholder,
|
|
|
|
),
|
2020-11-17 11:59:34 +00:00
|
|
|
),
|
2020-04-02 12:05:32 +00:00
|
|
|
),
|
|
|
|
),
|
|
|
|
);
|
|
|
|
}
|
2021-07-11 12:30:39 +00:00
|
|
|
}
|