How can I change view of PDF files in UWP apps

Question

Am opening the PDF file as Image and displaying it in a flipview.

public async void OpenPDF(StorageFile file)
    {        
        var pdfFile = await PdfDocument.LoadFromFileAsync(file);

        if (pdfFile == null)
            return;

        for (uint i = 0; i < pdfFile.PageCount; i++)
        {
            StorageFolder tempFolder = ApplicationData.Current.LocalFolder;
            StorageFile jpgFile = await tempFolder.CreateFileAsync(pdfFile + "-Page-" + i.ToString() + ".png", CreationCollisionOption.ReplaceExisting);
            var pdfPage = pdfFile.GetPage(i);

            if (jpgFile != null && pdfPage != null)
            {
                IRandomAccessStream randomStream = await jpgFile.OpenAsync(FileAccessMode.ReadWrite);
                await pdfPage.RenderToStreamAsync(randomStream);
                await randomStream.FlushAsync();
                randomStream.Dispose();
                pdfPage.Dispose();
            }

            PdfImages.Add(jpgFile.Path);
        }
        this.pdfViewer.ItemsSource = PdfImages;
    }

I need to change the views(FitWidth,FitPage,100%) like windows 8.1 PDF viewer.

In windows 8.1 app I used Reader app and it will open the PDF side by side to app screen. But in UWP its not working like the same. So am looking for alternatives. Many PDF viewer is available, but all needs to be licensed. So is there any free source available?.

Answer 1

In UWP, you can display the PDF files content in the Image control, then you can set the Image.Stretch property to describe how an Image should be stretched to fill the destination rectangle. You can also adjust the layout to display the PDF file as you want. More details about display PDF files, please look into the PdfDocument sample.

Besides, here is a simple sample,

MainPage.xaml,

<Grid>
    <ListView Name="PDFListView" ItemsSource="{x:Bind PdfPages}">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="BitmapImage">
                <Image Source="{x:Bind }" Stretch="Uniform"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

MainPage.xaml.cs,

public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            PdfPages = new ObservableCollection<BitmapImage>();
            this.Loaded += MainPage_Loaded;
        }

        PdfDocument pdfDocument;
        public ObservableCollection<BitmapImage> PdfPages;
        private async void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            var picker = new FileOpenPicker();
            picker.FileTypeFilter.Add(".pdf");
            var file = await picker.PickSingleFileAsync();
            if (file != null)
            {
                try
                {

                    pdfDocument = await PdfDocument.LoadFromFileAsync(file);
                }
                catch (Exception ex)
                {
                    Debug.WriteLine(ex.Message);
                }
            }

            if (pdfDocument != null)
            {
                uint pageCount = pdfDocument.PageCount;
                for (uint pageIndex = 0; pageIndex < pageCount; pageIndex++)
                {
                    using (PdfPage page = pdfDocument.GetPage(pageIndex))
                    {
                        var stream = new InMemoryRandomAccessStream();
                        await page.RenderToStreamAsync(stream);
                        BitmapImage src = new BitmapImage();
                        await src.SetSourceAsync(stream);
                        PdfPages.Add(src);
                    }
                }
            }
        }
    }