List PDF files from Storage and View on Click

In this example, we have shown to list all the PDF files from internal or external storage on the app and build a list. And whenever the user taps or pressed on it, show it on the next page. See the example below and learn how to list all PDF files from the internal storage or SD card on the app and view it when the user chooses from the list.
  path: ^1.6.4
  flutter_file_manager: ^0.2.0
  flutter_full_pdf_viewer: ^1.0.6
Add read / write permissions in your android/app/src/main/AndroidManifest.xml before <application> tag.
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<application
      android:requestLegacyExternalStorage="true"
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_file_manager/flutter_file_manager.dart';
import 'package:flutter_full_pdf_viewer/full_pdf_viewer_scaffold.dart';
import 'package:path_provider_ex/path_provider_ex.dart';
//import package files

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyPDFList(), //call MyPDF List file
    );
  }
}

//apply this class on home: attribute at MaterialApp()
class MyPDFList extends StatefulWidget {
  @override
  State createState() {
    return _MyPDFList(); //create state
  }
}

class _MyPDFList extends State {
  var files;

  void getFiles() async {
    // //asyn function to get list of files
    // List storageInfo = await PathProviderEx.getStorageInfo();
    // var root = storageInfo[0]
    //     .rootDir; //storageInfo[1] for SD card, geting the root directory
    // root = '$root/Hastlekh';
    // print(root);

    var fm = FileManager(root: Directory('/storage/emulated/0')); //
    files = await fm.filesTree(
        excludedPaths: ["/storage/emulated/0/"],
        extensions: ["pdf"] //optional, to filter files, list only pdf files
        );
    print(files);
    setState(() {}); //update the UI
  }

  @override
  void initState() {
    getFiles(); //call getFiles() function on initial state.
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            title: Text("PDF File list from SD Card"),
            backgroundColor: Colors.redAccent),
        body: files == null
            ? Text("Searching Files")
            : ListView.builder(
                //if file/folder list is grabbed, then show here
                itemCount: files?.length ?? 0,
                itemBuilder: (context, index) {
                  return Card(
                      child: ListTile(
                    title: Text(files[index].path.split('/').last),
                    leading: Icon(Icons.picture_as_pdf),
                    trailing: Icon(
                      Icons.arrow_forward,
                      color: Colors.redAccent,
                    ),
                    onTap: () {
                      Navigator.push(context,
                          MaterialPageRoute(builder: (context) {
                        return ViewPDF(pathPDF: files[index].path.toString());
                        //open viewPDF page on click
                      }));
                    },
                  ));
                },
              ));
  }
}

class ViewPDF extends StatelessWidget {
  String pathPDF = "";
  ViewPDF({this.pathPDF});

  @override
  Widget build(BuildContext context) {
    return PDFViewerScaffold(
        //view PDF
        appBar: AppBar(
          title: Text("Document"),
          backgroundColor: Colors.deepOrangeAccent,
        ),
        path: pathPDF);
  }
}

List of PDF FilesPDF viewer

Post a Comment

Previous Post Next Post

Subscribe Us


Get tutorials, Flutter news and other exclusive content delivered to your inbox. Join 1000+ growth-oriented Flutter developers subscribed to the newsletter

100% value, 0% spam. Unsubscribe anytime