FLUTTER APP

    How to Make Image to Pdf Converter app in Flutter with Source Code

    DeepikaBy Updated:No Comments4 Mins Read

    Creating an image-to-PDF converter app in Flutter involves several steps. Here’s a step-by-step guide, along with the necessary code snippets, to help you build this app.

    Step 1: Set Up Flutter Project

    1. Create a new Flutter project:
       flutter create image_to_pdf
   cd image_to_pdf
    1. Add necessary dependencies in pubspec.yaml:
       dependencies:
     flutter:
       sdk: flutter
     image_picker: ^0.8.4+2
     pdf: ^3.6.1
     path_provider: ^2.0.2

    Run flutter pub get to install the dependencies.

    Step 2: Implement UI

    1. Create a simple UI in lib/main.dart:
       import 'dart:io';

   import 'package:flutter/material.dart';
   import 'package:image_picker/image_picker.dart';
   import 'package:pdf/widgets.dart' as pw;
   import 'package:path_provider/path_provider.dart';
   import 'package:permission_handler/permission_handler.dart';

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

   class MyApp extends StatelessWidget {
     @override
     Widget build(BuildContext context) {
       return MaterialApp(
         home: ImageToPdfConverter(),
       );
     }
   }

   class ImageToPdfConverter extends StatefulWidget {
     @override
     _ImageToPdfConverterState createState() => _ImageToPdfConverterState();
   }

   class _ImageToPdfConverterState extends State<ImageToPdfConverter> {
     final picker = ImagePicker();
     List<File> _images = [];

     Future<void> pickImage() async {
       final pickedFile = await picker.pickImage(source: ImageSource.gallery);
       if (pickedFile != null) {
         setState(() {
           _images.add(File(pickedFile.path));
         });
       }
     }

     Future<void> createPDF() async {
       final pdf = pw.Document();
       for (var img in _images) {
         final image = pw.MemoryImage(img.readAsBytesSync());
         pdf.addPage(pw.Page(
           build: (pw.Context context) {
             return pw.Center(
               child: pw.Image(image),
             );
           },
         ));
       }

       final output = await getTemporaryDirectory();
       final file = File("${output.path}/example.pdf");
       await file.writeAsBytes(await pdf.save());
       print("PDF saved to ${file.path}");
     }

     @override
     Widget build(BuildContext context) {
       return Scaffold(
         appBar: AppBar(
           title: Text('Image to PDF Converter'),
         ),
         body: Center(
           child: Column(
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
               ElevatedButton(
                 onPressed: pickImage,
                 child: Text('Pick Image'),
               ),
               SizedBox(height: 20),
               ElevatedButton(
                 onPressed: createPDF,
                 child: Text('Create PDF'),
               ),
             ],
           ),
         ),
       );
     }
   }

    Step 3: Handle Permissions (Android)

    1. Add permissions to AndroidManifest.xml:
       <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
   <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    1. Request permission using permission_handler:
      Add the permission handling code to the createPDF method:
       Future<void> createPDF() async {
     if (await Permission.storage.request().isGranted) {
       final pdf = pw.Document();
       for (var img in _images) {
         final image = pw.MemoryImage(img.readAsBytesSync());
         pdf.addPage(pw.Page(
           build: (pw.Context context) {
             return pw.Center(
               child: pw.Image(image),
             );
           },
         ));
       }

       final output = await getTemporaryDirectory();
       final file = File("${output.path}/example.pdf");
       await file.writeAsBytes(await pdf.save());
       print("PDF saved to ${file.path}");
     }
   }

    Step 4: Run the App

    1. Run the app on an emulator or physical device:
       flutter run

    Step 5: Test the Output

    1. Pick an image and create a PDF:
    • Press the “Pick Image” button to select an image.
    • Press the “Create PDF” button to generate a PDF file from the selected image.
    1. Check the output:
    • The console will print the location of the generated PDF file.
    • You can open the PDF file using a file manager or PDF viewer.

    Step 6: (Optional) Improve the App

    • Add multiple image selection.
    • Enhance the UI for a better user experience.
    • Add options to save the PDF file to a specific location.
    • Handle edge cases, such as no image selected or permission denied.

    This basic app allows users to select an image from their device’s gallery, convert it into a PDF, and save it locally.

    Output

    Here’s the output image showing how the Flutter app might look on a mobile device. image to pdf converter app.

    Related Articles

    Share.

    Related Posts

    Leave A Reply