UWP Simple PDF viewer

Some months ago, I blogged about how to display PDF files in your UWP app: Displaying PDF files in a UWP app

When I look at the stats of my blog, I notice that that particular blogpost gets a lot of visitors. Also, I regularly get mails from people having questions about displaying PDF files in a UWP app.

So, I figured out that this is something a lot of developers seem to need or want to use. And that’s why I thought I’d make a custom control for this exact purpose.

You can find the control, together with the source code, on my GitHub: SimplePdfViewer

Usage:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="250" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <StackPanel>
        <Button Content="Local PDF" Tapped="{x:Bind OpenLocal}" />
        <Button Content="Remote PDF" Tapped="{x:Bind OpenRemote}" />
    </StackPanel>
    <controls:SimplePdfViewerControl Grid.Column="1"
        Source="{x:Bind Source, Mode=OneWay}"
        AutoLoad="True"
        IsZoomEnabled="true"
        VerticalAlignment="Stretch" 
        HorizontalAlignment="Stretch"
        />
</Grid>

Result:
pdf print screen

If you have any suggestions for this control, please let me know! I’ll try to gradually keep on improving this control.

4 Comments

Add yours

Abellard Joseph
December 6, 2017 at 3:45 pm


Thanks on this post very interesting, I am creating a hosted universal windows apps based on my WordPress document library. I have couple pages with PDF file and when I click on it app crashed, can you please give me some idea. Thanks again

Riani
February 16, 2019 at 11:43 am


great article, thank you for sharing

shalinivathra
November 4, 2019 at 10:03 am


Hi, Your post is very useful. Thanks for this. i am totally new in windows UWP app development. I tried to do write bridge this in react-native for windows uwp.

<ItemsControl.ItemTemplate>

</ItemsControl.ItemTemplate>

How can i achieve this is programatically?..
you just add it in pdfpages and its biniding in xaml file. i need to do this in programatically. Could you please help me?..

- PieEatingNinjas
  December 3, 2019 at 9:28 am
  
  
  Sorry for my late reply…
  If you don’t want to use databinding, you can just loop over your collection of PDF pages (which are BitmapImages), foreach page create a new Image and add this image to your view. In pseudo code it would look something like this:
  foreach(BitmapImage img in pdfPages)
  {
  var image = new Image();
  image.Source = img;
  myUIElement.Add(image);
  }
  If it’s not clear, please feel free to reach out on GitHub where you can drop some code so I can help you out.