Show PDF Inline File for iOS in Flutter - ios

Question

I am developing an App in flutter specifically for iOS (at this stage) and I need to add PDF file(s) to it. The problem is that flutter has no native way to display PDF files (as far as I researched).
From this tread it looks like it shouldn't it be too difficult to add PDF support to iOS devices using this plugin. However, I am still confused about how exactly to integrate it into my Flutter Application.
Any help would be appreciated!

Answer 1

When I was implementing the functionality for PDF viewer, there was no PDF plugin.
However, funny enough a friend at work found out that there is already a PDF viewer implemented for Flutter here, which we ended up using.
Note: At the time of writing the question, 16.08 there was not yet any plugin available. The mentioned was created on 30.08.

Answer 2

If you are looking for quick and easy way to display PDF, this might be the one.
pdf_flutter
Load PDF from network:
PDF.network(
'https://raw.githubusercontent.com/FlutterInThai/Dart-for-Flutter-Sheet-cheet/master/Dart-for-Flutter-Cheat-Sheet.pdf',
height: 500,
width: 300,
)
Load PDF from files:
File fileName;
PDF.file(
fileName,
height: 200,
width: 100,
)
Load PDF from assets:
PDF.assets(
"assets/pdf/demo.pdf",
height: 200,
width: 100,
)

Answer 3

add the dependencies in the pubspec.yaml
pubspec.yaml
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.2
pdf_viewer_plugin: ^1.0.0+2
path_provider: ^1.6.1
http: ^0.12.0+4
main.dart
import 'dart:async';
import 'dart:io';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:pdf_viewer_plugin/pdf_viewer_plugin.dart';
import 'package:path_provider/path_provider.dart';
import 'package:http/http.dart' as http;
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
String path;
#override
initState() {
super.initState();
}
Future<String> get _localPath async {
final directory = await getApplicationDocumentsDirectory();
return directory.path;
}
Future<File> get _localFile async {
final path = await _localPath;
return File('$path/teste.pdf');
}
Future<File> writeCounter(Uint8List stream) async {
final file = await _localFile;
// Write the file
return file.writeAsBytes(stream);
}
Future<Uint8List> fetchPost() async {
final response = await http.get(
'https://expoforest.com.br/wp-content/uploads/2017/05/exemplo.pdf');
final responseJson = response.bodyBytes;
return responseJson;
}
loadPdf() async {
writeCounter(await fetchPost());
path = (await _localFile).path;
if (!mounted) return;
setState(() {});
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Plugin example app'),
),
body: Center(
child: Column(
children: <Widget>[
if (path != null)
Container(
height: 300.0,
child: PdfViewer(
filePath: path,
),
)
else
Text("Pdf is not Loaded"),
RaisedButton(
child: Text("Load pdf"),
onPressed: loadPdf,
),
],
),
),
),
);
}
}

Answer 4

there working code -
Add this plugin to pubspec.yaml -
>> flutter_full_pdf_viewer: ^1.0.6
on alert dialog positive button click I redirecting to view pdf -
Future<void> onPositiveButtonClick() async {
String _filePath = '';
String _directory = await ExtStorage.getExternalStoragePublicDirectory(ExtStorage.DIRECTORY_DOWNLOADS);
//todo geeting right directory path here
print("directory" + _directory);
_filePath = '$_directory/$fileName';
Navigator.pushReplacement(context, MaterialPageRoute(builder: (context) => ActivityPdfView(_filePath)));
}
and this is my Activitypdfview to show pdf -
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_full_pdf_viewer/flutter_full_pdf_viewer.dart';
class ActivityPdfView extends StatefulWidget {
String filePath;
ActivityPdfView(String filePath){
this.filePath = filePath;
}
#override
_ActivityPdfViewState createState() => _ActivityPdfViewState();
}
class _ActivityPdfViewState extends State<ActivityPdfView> {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: MyPDFList(widget.filePath), //call MyPDF List file
);
}
}
class MyPDFList extends StatelessWidget {
String pathPDF = "";
MyPDFList(String filePath){
this.pathPDF = filePath;
}
#override
Widget build(BuildContext context) {
return PDFViewerScaffold(
appBar: AppBar(
title: Text("Document"),
backgroundColor: Colors.deepOrangeAccent,
),
path: pathPDF
);
}
}

Answer 5

Depending on what's the min version your app supports, if it's iOS 11 and above, you can use PDFKit. Otherwise WebKit is also a good option.