helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-10-17 18:19:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add video thumbnail with duration and icon

Browse source
This commit is contained in:
Alex Tran 2022-02-05 15:22:10 -06:00
parent d546c35e3f
commit 69ed287974
11 changed files with 118 additions and 126 deletions
Download patch file Download diff file Expand all files Collapse all files

127
mobile/lib/modules/home/ui/image_grid.dart
View file

@ -1,16 +1,15 @@
import 'package:chewie/chewie.dart';
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:immich_mobile/modules/home/ui/thumbnail_image.dart';
import 'package:immich_mobile/shared/models/immich_asset.model.dart';
import 'package:video_player/video_player.dart';
class ImageGrid extends StatelessWidget {
class ImageGrid extends ConsumerWidget {
final List<ImmichAsset> assetGroup;
const ImageGrid({Key? key, required this.assetGroup}) : super(key: key);
@override
Widget build(BuildContext context) {
Widget build(BuildContext context, WidgetRef ref) {
return SliverGrid(
gridDelegate:
const SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3, crossAxisSpacing: 5.0, mainAxisSpacing: 5),
@ -19,11 +18,33 @@ class ImageGrid extends StatelessWidget {
var assetType = assetGroup[index].type;
return GestureDetector(
onTap: () {},
child: assetType == 'IMAGE'
? ThumbnailImage(asset: assetGroup[index])
: VideoThumbnailPlayer(key: Key(assetGroup[index].id), videoAsset: assetGroup[index]),
);
onTap: () {},
child: Stack(
children: [
ThumbnailImage(asset: assetGroup[index]),
assetType == 'IMAGE'
? Container()
: Positioned(
top: 5,
right: 5,
child: Row(
children: [
Text(
assetGroup[index].duration.toString().substring(0, 7),
style: const TextStyle(
color: Colors.white,
fontSize: 10,
),
),
const Icon(
Icons.play_circle_outline_rounded,
color: Colors.white,
),
],
),
)
],
));
},
childCount: assetGroup.length,
),
@ -31,55 +52,55 @@ class ImageGrid extends StatelessWidget {
}
}
class VideoThumbnailPlayer extends StatefulWidget {
ImmichAsset videoAsset;
// class VideoThumbnailPlayer extends StatefulWidget {
// ImmichAsset videoAsset;
VideoThumbnailPlayer({Key? key, required this.videoAsset}) : super(key: key);
// VideoThumbnailPlayer({Key? key, required this.videoAsset}) : super(key: key);
@override
State<VideoThumbnailPlayer> createState() => _VideoThumbnailPlayerState();
}
// @override
// State<VideoThumbnailPlayer> createState() => _VideoThumbnailPlayerState();
// }
class _VideoThumbnailPlayerState extends State<VideoThumbnailPlayer> {
late VideoPlayerController videoPlayerController;
ChewieController? chewieController;
// class _VideoThumbnailPlayerState extends State<VideoThumbnailPlayer> {
// late VideoPlayerController videoPlayerController;
// ChewieController? chewieController;
@override
void initState() {
super.initState();
initializePlayer();
}
// @override
// void initState() {
// super.initState();
// initializePlayer();
// }
Future<void> initializePlayer() async {
videoPlayerController =
VideoPlayerController.network('https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4');
// Future<void> initializePlayer() async {
// videoPlayerController =
// VideoPlayerController.network('https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4');
await Future.wait([
videoPlayerController.initialize(),
]);
_createChewieController();
setState(() {});
}
// await Future.wait([
// videoPlayerController.initialize(),
// ]);
// _createChewieController();
// setState(() {});
// }
_createChewieController() {
chewieController = ChewieController(
showControlsOnInitialize: false,
videoPlayerController: videoPlayerController,
autoPlay: true,
looping: true,
);
}
// _createChewieController() {
// chewieController = ChewieController(
// showControlsOnInitialize: false,
// videoPlayerController: videoPlayerController,
// autoPlay: true,
// looping: true,
// );
// }
@override
Widget build(BuildContext context) {
return chewieController != null && chewieController!.videoPlayerController.value.isInitialized
? SizedBox(
height: 300,
width: 300,
child: Chewie(
controller: chewieController!,
),
)
: const Text("Loading Video");
}
}
// @override
// Widget build(BuildContext context) {
// return chewieController != null && chewieController!.videoPlayerController.value.isInitialized
// ? SizedBox(
// height: 300,
// width: 300,
// child: Chewie(
// controller: chewieController!,
// ),
// )
// : const Text("Loading Video");
// }
// }