본문 바로가기

개발하자

파일의 썸네일을 보여주기 위해 플러터를 사용하여 PDF를 이미지로 변환할 수 있습니까?

반응형

파일의 썸네일을 보여주기 위해 플러터를 사용하여 PDF를 이미지로 변환할 수 있습니까?

사용 사례: PDF의 썸네일을 파일 목록에 표시하려면.

목록에 썸네일을 표시하기 위해 FPF를 이미지로 변환할 수 있나요?




및 플러그인을 사용하여 PDF를 이미지로 변환하려면 다음과 같이 간단하게 수행할 수 있습니다:

// send pdfFile as params
imageFromPdfFile(File pdfFile) async {
    final document = await lib.PDFDocument.openFile(pdfFile.path);
    final page = await document.getPage(1);
    final pageImage = await page.render(width: page.width, height: page.height);
    await page.close();
    print(pageImage.bytes);

    //... now convert 
    // .... pageImage.bytes to image
}



사용 및 플러그인.

import 'package:pdf_render/pdf_render.dart';
import 'package:image/image.dart' as imglib;


final doc = await PdfDocument.openFile('abc.pdf');
final pages = doc.pageCount;
List<imglib.Image> images = [];

// get images from all the pages
for (int i = 1; i <= pages; i++) {
  var page = await doc.getPage(i);
  var imgPDF = await page.render();
  var img = await imgPDF.createImageDetached();
  var imgBytes = await img.toByteData(format: ImageByteFormat.png);
  var libImage = imglib.decodeImage(imgBytes.buffer
      .asUint8List(imgBytes.offsetInBytes, imgBytes.lengthInBytes));
  images.add(libImage);
}

// stitch images
int totalHeight = 0;
images.forEach((e) {
  totalHeight += e.height;
});
int totalWidth = 0;
images.forEach((element) {
  totalWidth = totalWidth < element.width ? element.width : totalWidth;
});
final mergedImage = imglib.Image(totalWidth, totalHeight);
int mergedHeight = 0;
images.forEach((element) {
  imglib.copyInto(mergedImage, element, dstX: 0, dstY: mergedHeight, blend: false);
  mergedHeight += element.height;
});

// Save image as a file
final documentDirectory = await getExternalStorageDirectory();
File imgFile = new File('${documentDirectory.path}/abc.jpg');
new File(imgFile.path).writeAsBytes(imglib.encodeJpg(mergedImage));



, 이것은 단순히 PDF의 썸네일을 보여주는 위젯이다.

enter image description here

내가 각 페이지를 받는 방법은 패키지를 통해서이다.

여기 제 소포의 코드 줄이 있어요.

https://github.com/mirkancal/pdf_thumbnail/blob/main/lib/src/pdf_thumbnail.dart#L77




내가 이것을 얻을 수 있는 유일한 방법은 .(이 패키지를 설치하는 것)을 사용하는 것이다

먼저 pdf 파일에서 이미지를 가져와야 합니다:

  Future<PdfPageImage?> getImage() async {
    final document = await PdfDocument.openAsset('assets/cv.pdf');

    final page = await document.getPage(1);

    final image = await page.render(
      width: page.width * 2, //decrement for less quality
      height: page.height * 2,
      format: PdfPageImageFormat.jpeg,
      backgroundColor: '#ffffff',

      // Crop rect in image for render
      //cropRect: Rect.fromLTRB(left, top, right, bottom),
    );

    return image;
  }

당신의 자산에서 파일의 PDF를 자유롭게 사용하세요.

그런 다음 위젯에서 생성된 이미지를 표시할 수 있습니다:

FutureBuilder(
   future: getImage(), //<- created image
   builder: (context, AsyncSnapshot<PdfPageImage?> snapshot) {

   // data is ready
   if(snapshot.hasData) {

       PdfPageImage image = snapshot.data!;
       return Image.memory(image.bytes);

    // loading
    } else {
       return const Center(child: CircularProgressIndicator(),);
    }

  }
)

반응형