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

发布于 1周前 作者 caililin 来自 Flutter

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

CosmosEpub 简介

CosmosEpub 是一个Flutter包,允许用户轻松打开和阅读EPUB文件。它提供了从资源(assets)或本地路径(local path)打开EPUB文件的功能,支持切换主题、调整字体样式和大小、访问章节内容等功能。该阅读器是响应式的,适用于普通智能手机和平板电脑。

展示

banner

功能特性

  • 从资源(assets)或本地路径(local path)打开EPUB文件
  • 提供5种主题:灰色、紫色、白色、黑色和粉色
  • 自定义字体样式和大小
  • 访问目录并导航到特定章节
  • 在屏幕底部显示当前章节名称
  • 上一页和下一页按钮切换章节
  • 调整屏幕亮度
  • 保存书籍阅读进度
  • 阅读时有漂亮的翻页动画

入门指南

在您的Flutter项目中添加依赖项:

dependencies:
  cosmos_epub: ^x.y.z

运行命令以获取依赖项:

flutter pub get

使用示例

首先,在Dart代码中导入包:

import 'package:cosmos_epub/cosmos_epub.dart';

main.dart文件中初始化数据库:

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 初始化并返回一个布尔值
  var _initialized = await CosmosEpub.initialize();
  
  if (_initialized) {
    // 获取书籍进度
    BookProgressModel bookProgress = CosmosEpub.getBookProgress('bookId');
    
    // 设置当前页面索引
    await CosmosEpub.setCurrentPageIndex('bookId', 1);
    
    // 设置当前章节索引
    await CosmosEpub.setCurrentChapterIndex('bookId', 2);
    
    // 删除书籍进度
    await CosmosEpub.deleteBookProgress('bookId');
    
    // 删除所有书籍进度
    await CosmosEpub.deleteAllBooksProgress();
  }

  runApp(MyApp());
}
打开来自资源的EPUB文件
await CosmosEpub.openAssetBook(
    assetPath: 'assets/book.epub',
    context: context,
    // 书籍ID是必需的,用于保存每本书的进度
    bookId: '3',
    // 回调函数是可选的
    onPageFlip: (int currentPage, int totalPages) {
      print(currentPage);
    },
    onLastPage: (int lastPageIndex) {
      print('我们到达了最后一页');
    });
打开来自本地存储的EPUB文件
await CosmosEpub.openLocalBook(
    localPath: book.path,
    context: context,
    // 书籍ID是必需的,用于保存每本书的进度
    bookId: '3',
    // 回调函数是可选的
    onPageFlip: (int currentPage, int totalPages) {
      print(currentPage);
    },
    onLastPage: (int lastPageIndex) {
      print('我们到达了最后一页');
    });
清除主题缓存
await CosmosEpub.clearThemeCache();

完整示例Demo

以下是一个完整的示例,展示了如何在Flutter应用中使用CosmosEpub插件:

import 'package:cosmos_epub/Model/book_progress_model.dart';
import 'package:cosmos_epub/cosmos_epub.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 初始化并返回一个布尔值
  var _initialized = await CosmosEpub.initialize();

  if (_initialized) {
    // 使用BookProgressModel实例在应用中访问特定书籍的当前进度
    BookProgressModel bookProgress = CosmosEpub.getBookProgress('bookId');
    await CosmosEpub.setCurrentPageIndex('bookId', 1);
    await CosmosEpub.setCurrentChapterIndex('bookId', 2);
    await CosmosEpub.deleteBookProgress('bookId');
    await CosmosEpub.deleteAllBooksProgress();
  }

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      useInheritedMediaQuery: true,
      title: 'CosmosEpub 💫 Reader Example',
      debugShowCheckedModeBanner: false,
      theme: ThemeData.dark().copyWith(
        appBarTheme: AppBarTheme(
          backgroundColor: Color(0xff0a0e21),
        ),
        scaffoldBackgroundColor: Color(0xff0a0e21),
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  Future<void> readerFuture = Future.value(true);

  Future<void> _openEpubReader(BuildContext context) async {
    await CosmosEpub.openAssetBook(
        assetPath: 'assets/book.epub',
        context: context,
        bookId: '3',
        onPageFlip: (int currentPage, int totalPages) {
          print(currentPage);
        },
        onLastPage: (int lastPageIndex) {
          print('我们到达了最后一页');
        });
  }

  lateFuture() {
    setState(() {
      readerFuture = _openEpubReader(context);
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('CosmosEpub 💫 Reader Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            lateFuture();
          },
          style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(Colors.yellow),
              padding: MaterialStateProperty.all(EdgeInsets.all(20))),
          child: FutureBuilder<void>(
            future: readerFuture, // 设置异步操作的未来
            builder: (context, snapshot) {
              switch (snapshot.connectionState) {
                case ConnectionState.waiting:
                  {
                    // 在等待异步操作完成时,显示加载指示器
                    return CupertinoActivityIndicator(
                      radius: 15,
                      color: Colors.black, // 根据需要调整半径
                    );
                  }
                default:
                  // 默认情况下,显示按钮文本
                  return Text(
                    '打开书籍 🚀',
                    style: TextStyle(fontSize: 20, color: Colors.black),
                  );
              }
            },
          ),
        ),
      ),
    );
  }
}

更多关于Flutter电子书阅读插件cosmos_epub的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter电子书阅读插件cosmos_epub的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,关于在Flutter项目中使用cosmos_epub插件来构建电子书阅读功能,下面是一个简单的代码示例,展示了如何集成和使用该插件。

首先,确保你已经在pubspec.yaml文件中添加了cosmos_epub依赖:

dependencies:
  flutter:
    sdk: flutter
  cosmos_epub: ^最新版本号  # 请替换为实际的最新版本号

然后运行flutter pub get来安装依赖。

接下来,我们编写一个简单的Flutter应用来展示如何使用cosmos_epub插件。

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'EPUB Reader Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: EpubReaderScreen(),
    );
  }
}

class EpubReaderScreen extends StatefulWidget {
  @override
  _EpubReaderScreenState createState() => _EpubReaderScreenState();
}

class _EpubReaderScreenState extends State<EpubReaderScreen> {
  late EpubController _epubController;

  @override
  void initState() {
    super.initState();
    // 初始化EpubController并加载EPUB文件
    _epubController = EpubController(
      ...EpubOptions(
        filePath: 'assets/sample.epub', // 请确保你的assets文件夹中有这个EPUB文件
        autoPlay: false,
        enableTts: true,
        nightMode: false,
        fontSize: 18.0,
        themeColor: Colors.blue,
        allowFontScaling: true,
      ),
    );
    // 监听EpubController的状态变化
    _epubController.listen((state) {
      if (state is EpubLoadedState) {
        // EPUB文件加载完成后可以执行一些操作,比如跳转到第一页
        _epubController.goToPage(1);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('EPUB Reader'),
      ),
      body: Center(
        child: EpubView(
          controller: _epubController,
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 示例:跳转到下一页
          _epubController.nextPage();
        },
        tooltip: 'Next Page',
        child: Icon(Icons.arrow_forward),
      ),
    );
  }

  @override
  void dispose() {
    _epubController.dispose();
    super.dispose();
  }
}

在这个示例中,我们做了以下几件事:

  1. 初始化EpubController:在initState方法中,我们创建了EpubController实例并传入了一些配置选项,包括EPUB文件的路径。
  2. 监听EpubController的状态:我们监听了_epubController的状态变化,当EPUB文件加载完成后,可以执行一些操作,比如跳转到第一页。
  3. 构建UI:我们使用EpubView来显示EPUB内容,并添加了一个浮动按钮来跳转到下一页。
  4. 资源释放:在dispose方法中,我们释放了_epubController资源。

请注意,你需要将你的EPUB文件放置在assets文件夹中,并在pubspec.yaml文件中声明它,例如:

flutter:
  assets:
    - assets/sample.epub

以上代码提供了一个基本的电子书阅读功能框架,你可以根据需要进行扩展和自定义。

回到顶部