How to create PDF viewer App using Flutter with source code

Below is a simple, complete guide to build a PDF Viewer app in Flutter, with working source code. This is beginner-friendly and commonly used in real apps.

1️⃣ Create a New Flutter Project

flutter create pdf_viewer_app
cd pdf_viewer_app

2️⃣ Add PDF Viewer Dependency

The most popular and stable package is flutter_pdfview.

Open pubspec.yaml and add:

dependencies:
  flutter:
    sdk: flutter
  flutter_pdfview: ^1.3.2
  path_provider: ^2.0.15

Then run:

flutter pub get

3️⃣ Add a PDF File

1. Create a folder:

assets/

2. Add a PDF file:

assets/sample.pdf

3. Register assets in pubspec.yaml:

flutter:
  assets:
    - assets/sample.pdf

4️⃣ Main App Code (Source Code)

📄 lib/main.dart

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_pdfview/flutter_pdfview.dart';
import 'package:path_provider/path_provider.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: PdfViewerScreen(),
    );
  }
}

class PdfViewerScreen extends StatefulWidget {
  const PdfViewerScreen({super.key});

  @override
  State<PdfViewerScreen> createState() => _PdfViewerScreenState();
}

class _PdfViewerScreenState extends State<PdfViewerScreen> {
  String? localPath;

  @override
  void initState() {
    super.initState();
    loadPdf();
  }

  Future<void> loadPdf() async {
    final bytes = await rootBundle.load('assets/sample.pdf');
    final dir = await getApplicationDocumentsDirectory();
    final file = File('${dir.path}/sample.pdf');

    await file.writeAsBytes(bytes.buffer.asUint8List());
    setState(() {
      localPath = file.path;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("PDF Viewer")),
      body: localPath == null
          ? const Center(child: CircularProgressIndicator())
          : PDFView(
              filePath: localPath!,
              enableSwipe: true,
              swipeHorizontal: false,
              autoSpacing: true,
              pageSnap: true,
            ),
    );
  }
}

5️⃣ Run the App

flutter run

🎉 Your PDF Viewer app is ready!

✨ Features You Can Add Next

• 📂 Open PDF from storage
• 🌐 Load PDF from URL
• 🔍 Zoom support
• 📄 Page navigation buttons
• 🌙 Dark mode

📦 Alternative Packages