Блог

GridView В моем TabBar есть две вкладки, и эта вкладка является 2-й, которая вызывает некоторую задержку пользовательского интерфейса. Когда я извлек какое-то изображение в виде сетки, я не испытывал никаких задержек, поэтому я думаю, что сделал что-то не так в своем коде, который включает в себя фьючерсы, которые загружают видео из каталога внутреннего хранилища. Также я читал о HandlerThread том, что это может помочь в решении проблемы, но я не знаю, как ее реализовать.

 import 'dart:io';
import 'package:flutter/material.dart';
import 'package:thumbnails/thumbnails.dart';
import 'package:wastatusapp/utils/video_play.dart';

final Directory _videoDir =
Directory('/storage/emulated/0/WhatsApp/Media/.Statuses');

class VideoScreen extends StatefulWidget {
const VideoScreen({Key key}) : super(key: key);
@override
VideoScreenState createState() => VideoScreenState();
}

class VideoScreenState extends State<VideoScreen> {
@override
void initState() {
super.initState();
}

@override
Widget build(BuildContext context) {
if (!Directory('${_videoDir.path}').existsSync()) {
  return Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      const Text(
        'Install WhatsAppn',
        style: TextStyle(fontSize: 18.0),
      ),
      const Text(
        "Your Friend's Status Will Be Available Here",
        style: TextStyle(fontSize: 18.0),
      ),
    ],
  );
} else {
  return VideoGrid(directory: _videoDir);
}
}
}

class VideoGrid extends StatefulWidget {
final Directory directory;

const VideoGrid({Key key, this.directory}) : super(key: key);

@override
_VideoGridState createState() => _VideoGridState();
}

class _VideoGridState extends State<VideoGrid> {
 Future<String> _getImage(videoPathUrl) async {
  //await Future.delayed(Duration(milliseconds: 500));
  final thumb = await Thumbnails.getThumbnail(
     videoFile: videoPathUrl,
     imageType:
        ThumbFormat.PNG, //this image will store in created folderpath
    quality: 10);
  return thumb;
 }

@override
Widget build(BuildContext context) {
final videoList = widget.directory
    .listSync()
    .map((item) => item.path)
    .where((item) => item.endsWith('.mp4'))
    .toList(growable: false);

if (videoList != null) {
  if (videoList.length > 0) {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 8.0),
      child: GridView.builder(
        itemCount: videoList.length,
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          childAspectRatio: 0.7,
          mainAxisSpacing: 8.0,
          crossAxisSpacing: 8,
        ),
        itemBuilder: (context, index) {
          return InkWell(
            onTap: () => Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => PlayStatus(
                  videoFile: videoList[index],
                ),
              ),
            ),
            child: ClipRRect(
              borderRadius: const BorderRadius.all(Radius.circular(12)),
              child: Container(
                child: FutureBuilder(
                    future: _getImage(videoList[index]),
                    builder: (context, snapshot) {
                      if (snapshot.connectionState ==
                          ConnectionState.done) {
                        if (snapshot.hasData) {
                          return Hero(
                            tag: videoList[index],
                            child: Image.file(
                              File(snapshot.data),
                              fit: BoxFit.cover,
                            ),
                          );
                        } else {
                          return Center(
                            child: Column(
                              children: [
                                Text(
                                    "Open WhatsApp with your internet on and then try again."),
                                Text(
                                    "Make sure you have good internet connection!")
                              ],
                            ),
                          );
                        }
                      } else {
                        return Container(
                          child:
                              Image.asset('assets/images/video_loader.gif'),
                        );
                      }
                    }),
                //new cod
              ),
            ),
          );
        },
      ),
    );
  } else {
    return const Center(
      child: Text(
        'Sorry, No Videos Found.',
        style: TextStyle(fontSize: 18.0),
      ),
    );
  }
  } else {
  return const Center(
    child: CircularProgressIndicator(),
  );
  }
}
}