【Flutter】WEB上のPDFを表示する方法

file

PDF関連いろいろあるみたいですが、

advance_pdf_viewer
syncfusion_flutter_pdfviewer
flutter_full_pdf_viewer
native_pdf_view
flutter_pdfview

native_pdf_viewを使うことにしました

WEB上のPDFを表示しようといくつか試したんですが、
最終的に、native_pdf_viewしかうまくいかなかったんですよね
なんでだ????

その他は謎のエラーに苦しめられたので諦めました。

Execution failed for task ':app:mergeDebugAssets'.

flutter_pdfviewで出てきたエラー
これは結局解決できませんでした。


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:mergeDebugAssets'.
> Could not resolve all files for configuration ':app:debugRuntimeClasspath'.
   > Could not find com.github.barteksc:android-pdf-viewer:3.2.0-beta.1.
     Searched in the following locations:
       - https://dl.google.com/dl/android/maven2/com/github/barteksc/android-pdf-viewer/3.2.0-beta.1/android-pdf-viewer-3.2.0-beta.1.pom
       - https://repo.maven.apache.org/maven2/com/github/barteksc/android-pdf-viewer/3.2.0-beta.1/android-pdf-viewer-3.2.0-beta.1.pom
       - https://storage.googleapis.com/download.flutter.io/com/github/barteksc/android-pdf-viewer/3.2.0-beta.1/android-pdf-viewer-3.2.0-beta.1.pom
     Required by:
         project :app > project :flutter_pdfview

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.

native_pdf_viewを使って実装

https://pub.dev/packages/native_pdf_view

使ったパッケージ

  native_pdf_view: ^6.0.0+1
  http: ^0.13.4

コード全体

import 'dart:io';

import 'package:flutter/material.dart';
import 'package:path_provider/path_provider.dart';
import 'package:pdfx/pdfx.dart';
import 'package:http/http.dart' as http;

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const PdfPage(),
    );
  }
}

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

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

class _PdfPageState extends State<PdfPage> {
  load() async {
    Directory appDocDir = await getApplicationDocumentsDirectory();
    // String appDocPath = appDocDir.path;
    // String pdfPath = appDocPath + '/test.pdf';

    final http.Response res = await http.get(Uri.parse(
        "https://www.kansaigaidai.ac.jp/asp/img/pdf/82/7a79c35f7ce0704dec63be82440c8182.pdf"));
    // final file = File(pdfPath);
    // await file.writeAsBytes(res.bodyBytes, flush: true);

    setState(() {
      pdfController = PdfController(
        document: PdfDocument.openData(res.bodyBytes),
      );
    });
  }

  @override
  initState() {
    load();
    super.initState();
  }

  PdfController? pdfController;

  @override
  Widget build(BuildContext context) {
    if (pdfController == null) {
      return const Text('Now loading');
    }
    return Scaffold(
      backgroundColor: Colors.grey,
      body: PdfView(
        controller: pdfController!,
      ),
    );
  }
}

Flutter開発で知らないと損すること Flutter開発で知らないと損すること

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です