Задержка производительности при открытии PDF-файла с помощью Syncfusion PDF viewer

Я использую «Syncfusion PDF viewer», чтобы открывать PDF-файлы в Android. Я использую «Dio» и «Path_provider» для загрузки и сохранения файла при его первом открытии, чтобы его можно было открыть из локального хранилища без Интернета. Проблема, с которой я сталкиваюсь, когда пытаюсь открыть файл PDF из локального хранилища (после того, как он уже загружен и сохранен), сталкивается с отставанием производительности при переходе страницы. Я делюсь здесь полным кодом, ожидая предложений о том, сделал ли я какие-либо ошибки в реализации.

файл main.dart

import 'package:flutter/material.dart';
import 'book.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'title',
      theme: ThemeData(
        primarySwatch: Colors.cyan,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    List bookindex = [
      Books(subject: '১ম - ৩য় খন্ড', subtitle: 'সূরা ফাতিহা - সূরা বাকারা'),
      Books(
          subject: '৪র্থ - ৭ম খন্ড', subtitle: 'সূরা আল-ইমরান - সূরা মায়িদাহ'),
      Books(subject: '৮ম - ১১শ খন্ড', subtitle: 'সূরা আন\'আম - সূরা ইউনুস'),
      Books(subject: '১২শ - ১৩শ খন্ড', subtitle: 'সূরা হূদ - সূরা ইসরা'),
    ];

    return Scaffold(
      appBar: AppBar(
        title: Text(
          'Book List',
          style: TextStyle(
            //fontSize: 14,
            fontFamily: 'Baloo Da',
          ),
        ),
        centerTitle: true,
      ),
      body: ListView.builder(
        itemCount: bookindex.length,
        itemBuilder: (context, index) {
          return Card(
            child: ListTile(
              title: Text(
                bookindex[index].subject,
                style: TextStyle(
                  fontSize: 14,
                  fontFamily: 'HindSiliguri',
                ),
              ),
              subtitle: Text(
                bookindex[index].subtitle,
                style: TextStyle(
                  fontSize: 12,
                  fontFamily: 'HindSiliguri',
                ),
              ),
              trailing: Icon(Icons.arrow_forward),
              onTap: () {
                Navigator.push(context,
                    MaterialPageRoute(builder: (context) => Book(index)));
              },
            ),
          );
        },
      ),
      bottomNavigationBar: BottomAppBar(
        child: Container(
          height: 85.0,
        ),
      ),
    );
  }
}

class Books {
  String subject;
  String subtitle;
  String booklink;

  Books({this.subject, this.subtitle, this.booklink});
}

файл book.dart

import 'dart:io';

import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart';

class Book extends StatefulWidget {
  final int index;
  Book(this.index);

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

class _BookState extends State<Book> {
  Directory tempDir;
  String tempPath;

  List booklist = [
    'https://rongdhonustudio.com/islamic_books/Tafsir_Ibn_Katheer/Tafseer-Ibn-Kathir-01.pdf',
    'https://rongdhonustudio.com/islamic_books/Tafsir_Ibn_Katheer/Tafseer-Ibn-Kathir-02.pdf',
    'https://rongdhonustudio.com/islamic_books/Tafsir_Ibn_Katheer/Tafseer-Ibn-Kathir-03.pdf',
    'https://rongdhonustudio.com/islamic_books/Tafsir_Ibn_Katheer/Tafseer-Ibn-Kathir-04.pdf',
  ];

  @override
  void initState() {
    super.initState();
    fileDownload();
  }

  int percentage = 0, totalFileSize;

  Future<void> fileDownload() async {
    tempDir = await getTemporaryDirectory();
    //download file
    tempPath = tempDir.path + "/" + booklist[widget.index];

    var dio = Dio();

    if (await File(tempPath).exists()) {
      if (await File(tempPath).length() == 0) {
        dio.download(
          booklist[widget.index],
          tempPath,
          onReceiveProgress: (count, total) {
            this.setState(() {
              percentage = ((count / total) * 100).floor();
            });
          },
        );
      } else {
        this.setState(() {
          percentage = 100;
        });
      }
    } else {
      dio.download(
        booklist[widget.index],
        tempPath,
        onReceiveProgress: (count, total) {
          this.setState(() {
            percentage = ((count / total) * 100).floor();
          });
          percentage = ((count / total) * 100).floor();
          totalFileSize = total;
        },
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Syncfusion Flutter PDF Viewer'),
      ),
      body: percentage == 100
          ? SfPdfViewer.file(File(tempPath))
          : Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    padding: EdgeInsets.all(10),
                    child: LinearProgressIndicator(
                      backgroundColor: Colors.white,
                      value: percentage.toDouble() / 100,
                      valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
                    ),
                  ),
                  Text(
                    (percentage.toDouble()).toString() + " %",
                    style: TextStyle(fontWeight: FontWeight.bold, fontSize: 23),
                  ),
                  Text("Please wait file downloading",
                      style:
                          TextStyle(fontWeight: FontWeight.bold, fontSize: 23))
                ],
              ),
            ),
    );
  }
}

person Rifat Hossain    schedule 03.05.2021    source источник
comment
Обратите внимание, что у меня в консоли два предупреждения: I/Choreographer(31959): Пропущено 257 кадров! Приложение может выполнять слишком много работы в своем основном потоке. W/Looper (31959): Основной Slow Looper: doFrame опаздывает на 4295 мс   -  person Rifat Hossain    schedule 03.05.2021
comment
Вы должны выполнить большую асинхронную задачу в initState. Было бы лучше сделать это в FutureBuilder.   -  person Andrej    schedule 03.05.2021
comment
Как я могу это сделать? Я здесь новичок, не могли бы вы помочь с примером кода?   -  person Rifat Hossain    schedule 04.05.2021


Ответы (1)


Привет от Syncfusion.

Анализируя данные коды, мы можем воспроизвести сообщаемую задержку пользовательского интерфейса при переходе между страницами. Syncfusion Flutter PdfViewer загружает изображение страницы PDF, которое визуализируется с использованием собственного средства визуализации платформы, и этот процесс занимает некоторое время для загрузки документа PDF. Загрузка изображения указывается с помощью LinearProgressIndicator. Чтобы решить проблему с переходом страниц, мы рекомендуем добавлять Future.delayed перед загрузкой каждой страницы. Мы изменили код и поделились им для справки. Модифицированный код можно скачать по следующей ссылке. https://www.syncfusion.com/downloads/support/directtrac/general/ze/book496455946

Пожалуйста, дайте нам знать, если у вас есть какие-либо сомнения.

С уважением, Дилли Бабу.

person Dillibabu Nandhagopal    schedule 04.05.2021