Flutter电子书阅读插件epub_view_2的使用

Flutter电子书阅读插件epub_view_2的使用

本项目是一个用于在所有平台上查看EPUB文档的纯Flutter小部件（非原生）。基于epub包。在任何平台上使用（Web、MacOs、Windows、Linux、Android 和 iOS）。

展示

开始使用

在你的Flutter项目中添加依赖：

flutter pub add epub_view_2

使用示例

以下是一个完整的示例代码，展示了如何在Flutter应用中集成epub_view_2插件来显示EPUB文档。

import 'dart:typed_data';

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

late EpubController _epubReaderController;

[@override](/user/override)
void initState() {
  super.initState();
  _epubReaderController = EpubController(
    // 加载文档
    document: EpubDocument.openAsset('assets/book.epub'),
    // 设置起始点
    epubCfi: 'epubcfi(/6/6[chapter-2]!/4/2/1612)',
  );
}

[@override](/user/override)
Widget build(BuildContext context) => Scaffold(
  appBar: AppBar(
    // 显示当前章节名称
    title: EpubViewActualChapter(
      controller: _epubReaderController,
      builder: (chapterValue) => Text(
        'Chapter: ' + (chapterValue?.chapter?.Title?.replaceAll('\n', '').trim() ?? ''),
        textAlign: TextAlign.start,
      ),
    ),
  ),
  // 显示目录
  drawer: Drawer(
    child: EpubViewTableOfContents(
      controller: _epubReaderController,
    ),
  ),
  // 显示EPUB文档
  body: EpubView(
    controller: _epubReaderController,
  ),
);

如何从上次阅读位置开始？

此方法允许你在章节内保持精确的阅读位置：

_epubReaderController = EpubController(
  // 初始化时使用EPUB CFI字符串以从上次位置打开书籍
  epubCfi: 'epubcfi(/6/6[chapter-2]!/4/2/1612)',
);

// 绑定控制器
EpubView(
  controller: _epubReaderController,
);

// 获取EPUB CFI字符串
// 例如输出 - epubcfi(/6/6[chapter-2]!/4/2/1612)
final cfi = _epubReaderController.generateEpubCfi();

// 或使用控制器导航
_epubReaderController.gotoEpubCfi('epubcfi(/6/6[chapter-2]!/4/2/1612)');

API

打开文档

本地文档打开：

EpubDocument.openAsset('assets/sample.epub')

EpubDocument.openData(FutureOr<Uint8List> data)

// 在Web上不支持
EpubDocument.openFile('path/to/file/on/device')

网络文档打开：

安装internet_file包（支持所有平台）：

flutter pub add internet_file

然后使用它：

import 'package:internet_file/internet_file.dart';

// 服务器需要CORS策略。你可以提升你的CORS代理。
EpubDocument.openData(InternetFile.get('https://link.to/book.epub'))

控制文档

// 获取实际视图插入的EPUB CFI字符串
// 例如输出 - epubcfi(/6/6[chapter-2]!/4/2/1612)
final cfi = _epubReaderController.generateEpubCfi();

// 导航到文档中的段落
_epubReaderController.gotoEpubCfi('epubcfi(/6/6[chapter-2]!/4/2/1612)');

文档回调

EpubView(
  controller: epubController,

  onExternalLinkPressed: (href) {},

  onDocumentLoaded: (document) {},
  onChapterChanged: (chapter) {},
  onDocumentError: (error) {},
);

完整示例代码

以下是从GitHub上提供的完整示例代码：

import 'package:epub_view/epub_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart' show SystemChrome, SystemUiOverlayStyle;

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

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> with WidgetsBindingObserver {
  [@override](/user/override)
  void initState() {
    WidgetsBinding.instance.addObserver(this);
    super.initState();
  }

  [@override](/user/override)
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  [@override](/user/override)
  void didChangePlatformBrightness() {
    _setSystemUIOverlayStyle();
  }

  Brightness get platformBrightness =>
      // ignore: deprecated_member_use
      MediaQueryData.fromView(WidgetsBinding.instance.window)
          .platformBrightness;

  void _setSystemUIOverlayStyle() {
    if (platformBrightness == Brightness.light) {
      SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
        statusBarBrightness: Brightness.light,
        statusBarIconBrightness: Brightness.dark,
        systemNavigationBarColor: Colors.grey[50],
        systemNavigationBarIconBrightness: Brightness.dark,
      ));
    } else {
      SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
        statusBarBrightness: Brightness.dark,
        statusBarIconBrightness: Brightness.light,
        systemNavigationBarColor: Colors.grey[850],
        systemNavigationBarIconBrightness: Brightness.light,
      ));
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) => MaterialApp(
        title: 'Epub demo',
        theme: ThemeData(
          primarySwatch: Colors.blue,
          brightness: Brightness.light,
        ),
        darkTheme: ThemeData(
          primarySwatch: Colors.blue,
          brightness: Brightness.dark,
        ),
        debugShowCheckedModeBanner: false,
        home: const MyHomePage(),
      );
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late EpubController _epubReaderController;

  [@override](/user/override)
  void initState() {
    _epubReaderController = EpubController(
      document:
          // EpubDocument.openAsset('assets/New-Findings-on-Shirdi-Sai-Baba.epub'),
          EpubDocument.openAsset('assets/New-Findings-on-Shirdi-Sai-Baba.epub'),
      // epubCfi:
      //     'epubcfi(/6/26[id4]!/4/2/2[id4]/22)', // book.epub Chapter 3 paragraph 10
      // epubCfi:
      //     'epubcfi(/6/6[chapter-2]!/4/2/1612)', // book_2.epub Chapter 16 paragraph 3
    );
    super.initState();
  }

  [@override](/user/override)
  void dispose() {
    _epubReaderController.dispose();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(
          title: EpubViewActualChapter(
            controller: _epubReaderController,
            builder: (chapterValue) => Text(
              chapterValue?.chapter?.Title?.replaceAll('\n', '').trim() ?? '',
              textAlign: TextAlign.start,
            ),
          ),
          actions: <Widget>[
            IconButton(
              icon: const Icon(Icons.save_alt),
              color: Colors.white,
              onPressed: () => _showCurrentEpubCfi(context),
            ),
          ],
        ),
        drawer: Drawer(
          child: EpubViewTableOfContents(controller: _epubReaderController),
        ),
        body: EpubView(
          builders: EpubViewBuilders<DefaultBuilderOptions>(
            options: const DefaultBuilderOptions(),
            chapterDividerBuilder: (_) => const Divider(),
          ),
          controller: _epubReaderController,
        ),
      );

  void _showCurrentEpubCfi(context) {
    final cfi = _epubReaderController.generateEpubCfi();

    if (cfi != null) {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(
          content: Text(cfi),
          action: SnackBarAction(
            label: 'GO',
            onPressed: () {
              _epubReaderController.gotoEpubCfi(cfi);
            },
          ),
        ),
      );
    }
  }
}