在 Xamarin.forms 中打开 Pdf 文件 [英] Open Pdf File in Xamarin.forms

问题描述

目前我正在为 PDF 格式的应用编写隐私政策.
请问Xamarin.Forms的PDF文件怎么打开?有参考源代码吗?

Currently I'm writing a Privacy policy for apps that I put in PDF format.
May I ask about how to open PDF file for Xamarin.Forms? Any references Source Code?

推荐答案

这完全取决于您的 PDF 文件是托管在其他地方还是设备本地这一事实.

It all depends a bit on the fact if your PDF file is hosted elsewhere or locally on the device.

如果是在线托管；最简单的方法是使用 PDF 文件的 URI 执行 Device.OpenUri()，但这会打开外部浏览器.

If it is hosted online; the easiest way would be to just do a Device.OpenUri() with the URI of the PDF file, but this would open an external browser.

如果您想将它合并到您的应用程序中，您可以创建一个带有 WebView 的页面，然后导航到其中的 PDF.这应该很简单.

If you want to incorporate it within your app you can create a page with a WebView and navigate to the PDF in there. This should be pretty straight-forward.

使用 WebView 实现一个页面，我假设您使用 XAML.

Implement a page with a WebView, I'm going to assume you use XAML.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DisplayPDF.WebViewPage"
             Padding="0,20,0,0">
    <ContentPage.Content>
        <WebView Source="http://www.yoursite.com/your.pdf" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
    </ContentPage.Content>
</ContentPage>

本地

本地在设备上没有统一的方法来做到这一点.一种方式是通过在WebView中展示来实现，与上面的WebView基本相同，只是需要创建一个CustomRenderer> 对于您要使用的每个平台.您可以使用 dylansturg 提供的链接作为参考.

Local

Local on the device there is no unified way to do this. One way is to implement it through showing it in a WebView, which is basically the same as the WebView above, but you need to create a CustomRenderer for each platform you want to use. You can use the link provided by dylansturg as a reference.

基本上，您使用自定义 WebView 组件实现相同的页面.

Basically you implement the same page with a custom WebView component.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DisplayPDF;assembly=DisplayPDF"
             x:Class="DisplayPDF.WebViewPage"
             Padding="0,20,0,0">
    <ContentPage.Content>
        <local:CustomWebView Uri="your.pdf" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" />
    </ContentPage.Content>
</ContentPage>

您的自定义 WebView 将如下所示:

Your custom WebView will look like this:

public class CustomWebView : WebView
{
    public static readonly BindableProperty UriProperty = BindableProperty.Create (propertyName:"Uri",
            returnType:typeof(string),
            declaringType:typeof(CustomWebView),
            defaultValue:default(string));

    public string Uri {
        get { return (string)GetValue (UriProperty); }
        set { SetValue (UriProperty, value); }
    }
}

它基本上只是一个 WebView，但我们向它添加了一个 Uri 属性.

It's basically just a WebView but we add a Uri property to it.

现在如果你想为 iOS 实现它，在你的平台项目中创建一个 CustomRenderer 并像这样实现它:

Now if you want to implement it for iOS, create a CustomRenderer in your platform project and implement it somewhat like this:

[assembly: ExportRenderer (typeof(CustomWebView), typeof(CustomWebViewRenderer))]
namespace DisplayPDF.iOS
{
    public class CustomWebViewRenderer : ViewRenderer<CustomWebView, UIWebView>
    {
        protected override void OnElementChanged (ElementChangedEventArgs<CustomWebView> e)
        {
            base.OnElementChanged (e);

            if (Control == null) {
                SetNativeControl (new UIWebView ());
            }
            if (e.OldElement != null) {
                // Cleanup
            }
            if (e.NewElement != null) {
                var customWebView = Element as CustomWebView;
                string fileName = Path.Combine (NSBundle.MainBundle.BundlePath, string.Format ("Content/{0}", WebUtility.UrlEncode (customWebView.Uri)));
                Control.LoadRequest (new NSUrlRequest (new NSUrl (fileName, false)));
                Control.ScalesPageToFit = true;
            }
        }
    }
}

在这里你会看到我们如何创建一个原生的 UIWebView 并在我们的应用程序提供的文件中导航它.注意:该文件应在内容文件中并标记为 BundleResource.如果您要下载文件(或新版本的策略)，请确保相应地调整路径.

Here you see how we create a native UIWebView and navigate it a file which is provided with our app. Note: the file should be in the Content file and marked as a BundleResource. If you are to download the file (or new versions of the policy) make sure you adjust the path accordingly.

对于 Android，它需要更多的工作，您必须下载 pdf.js 库将其添加到您的资产下的项目中.确保检查文件是否也添加到您的存储库中.在我的情况下，.js 文件默认位于我的 .gitignore 文件中.

For Android it's a bit more work, you have to download the pdf.js library add it to you project under Assets. Make sure to check if the files are added to your repository as well. In my case the .js files where in my .gitignore file by default.

现在创建一个像这样的自定义渲染器:

Now create a custom renderer like this:

[assembly: ExportRenderer (typeof(CustomWebView), typeof(CustomWebViewRenderer))]
namespace DisplayPDF.Droid
{
    public class CustomWebViewRenderer : WebViewRenderer
    {
        protected override void OnElementChanged (ElementChangedEventArgs<WebView> e)
        {
            base.OnElementChanged (e);

            if (e.NewElement != null) {
                var customWebView = Element as CustomWebView;
                Control.Settings.AllowUniversalAccessFromFileURLs = true;
                Control.LoadUrl (string.Format ("file:///android_asset/pdfjs/web/viewer.html?file={0}", string.Format ("file:///android_asset/Content/{0}", WebUtility.UrlEncode (customWebView.Uri))));
            }
        }
    }
}

注意我们如何在此处导航到 pdf.js 库并为其提供查询参数以指定我们的 PDF 文件.同样，这是您将文件与应用程序一起提供的时间.此外，这仅适用于 API 19 及更高版本.

Notice how we navigate to the pdf.js library here and provide it with a query parameter to specify our PDF file. Again, this is when you provide the file with the app. Also this is only available from API 19 and up.

对于 Windows，您还应该使用 pdf.js 库.

For Windows you should also use the pdf.js library.

根据尼古拉的善意回应，似乎还有一个轻量级的用于移动设备的 pdf.js 库 我自己还没有使用它，但用于移动设备似乎更好.

As per Nikolai's kind response it seems there is also a lightweight pdf.js lib for mobile I didn't us it myself yet, but it seems better to use for mobile use.

由于这个问题似乎仍然相关，我认为用更彻底的更新它会很好博文 我就是这样做的.

Since this question still seems relevant I thought it would be nice to update it with a more thorough blog post I did on this.

这篇关于在 Xamarin.forms 中打开 Pdf 文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！