在 Vaadin 版本 14+ 中显示 PDF答案

【问题标题】：Display PDF in Vaadin version 14+在 Vaadin 版本 14+ 中显示 PDF
【发布时间】：2021-05-21 04:56:55
【问题描述】：

在 Vaadin 14 中显示 PDF 文件的最佳方式是什么？我想在对话框中显示 pdf 文件，但我不确定如何呈现 pdf 文件。看了一些关于嵌入式 pdf 视图、pdf 浏览器和 EmbeddedPdfDocument 的帖子，但我不知道它们是否与 14 兼容。有没有新方法可以做到这一点？

【问题讨论】：

标签： vaadin14

【解决方案1】：

有一个第三方插件可以在 Vaadin 14 中呈现 PDF。你可以在这里找到它：https://vaadin.com/directory/component/pdf-browser/

这使您可以使用以下代码呈现 pdf：

StreamResource streamResource = new StreamResource(
        "report.pdf", () -> getClass().getResourceAsStream("/report.pdf")); // file in src/main/resources/

PdfBrowserViewer viewer = new PdfBrowserViewer(streamResource);
viewer.setHeight("100%");
layout.add(viewer);

或者，您可以像以前的 Vaadin 框架版本中通常那样做，嵌入到 IFrame 中（参见 Show PDF in a Vaadin View ），看起来像这样

StreamResource streamResource = new StreamResource(
                getPresenter().createPdfStreamSource(), report.getName() + ".pdf");
StreamRegistration registration = VaadinSession.getCurrent().getResourceRegistry().registerResource(resource);
        IFrame iframe = new IFrame(registration.getResourceUri().toString());
        iframe.setHEight("100%");
        layout.add(iframe);

【讨论】：

【解决方案2】：

要在 Vaadin Flow（没有插件）和对话框中按要求执行此操作，我想为您的对话框提供以下代码，该代码可以像任何其他类一样被调用。我不得不稍微调整一下 Jean-Christophe 他的回答。

public class ManualDialog extends Dialog {

    private IFrame iFrame;
    private final String fileName = "fileNameAsFoundUnderYourResourceMap";

    public ManualDialog() {
        this.setHeight("calc(100vh - (2*var(--lumo-space-m)))");
        this.setWidth("calc(100vw - (4*var(--lumo-space-m)))");

        buildLayout();
    }

    private void buildLayout() {
        // HEADER
        HorizontalLayout header = new HorizontalLayout();
        header.setMaxHeight("1em");
        header.setAlignItems(FlexComponent.Alignment.CENTER);
        header.setJustifyContentMode(FlexComponent.JustifyContentMode.BETWEEN);
        header.getStyle().set("margin-top", "-1em");

        Span caption = new Span(getTranslation("main.download.manual"));
        caption.getStyle().set("color", "black");
        caption.getStyle().set("font-weight", "bold");

        Icon closeIcon = new Icon(VaadinIcon.CLOSE);
        closeIcon.setColor(GENERIC_BUTTON_COLOR.getDescription());
        Button closeButton = new Button();
        closeButton.setIcon(closeIcon);
        closeButton.getStyle().set("border", "none");
        closeButton.getStyle().set("background", "transparent");
        closeButton.addClickListener(click -> this.close());

        header.add(caption, closeButton);
        this.add(header);

        // PDF-VIEW
        iFrame = new IFrame();
        iFrame.setSizeFull();
        StreamResource resource = new StreamResource(fileName, () -> new BufferedInputStream(getClass().getClassLoader().getResourceAsStream(fileName)));
        StreamRegistration registration = VaadinSession.getCurrent().getResourceRegistry().registerResource(resource);
        iFrame.setSrc(registration.getResourceUri().toString());

        this.add(iFrame);
        this.open();
    }

    
}

【讨论】：