in this video we'll show how you can use
the pdf viewer control to display
pdf files on a ux component
so previously to display a pdf file
uh on a ux component you had to display
a iframe and then set the iframe source
to the
pdf file but now you can display pdfs
directly using the pdf viewer control so
you can see here we have a list
control that is displaying the names of
a bunch of pdf files
and then as i tap on each row in the
list
we're displaying the pdf file in the
pdf viewer control so the pdf viewer
control
has it comes with a toolbar here so you
can see you can
open up the toolbar to navigate by page
you can close the toolbar down and you
can also open up this menu here
to display various options such as the
document properties or
to search within the pdf file
etc or to rotate the pdf file etc so
let's take a look now at how this was
built so first of all let's go back to
the project properties here we can see
that
inside this project we've placed a whole
bunch of pdf files
so these are files that are in the
web project folder so that they'll be
published to the web route
at the time this project
is published and then you can see we've
gone over to
our list control over here and we've got
a static
data source where we've got the names of
all of the pdf files
and then what we've done is we've gone
to
the toolbox here and we've selected the
viewer control from the available
controls this is in other controls
you'll see there
we've got the pdf viewer and we've
configured the pdf viewer to
basically have a height of 6 inches
and a width of 60 of 50 percent and we
could also have set
the initial pdf file to display uh
had we wanted to so now let's go take a
look at this list
and if we look at the list we can see
that the list has an event
in the on click event so the on click
event is going to basically
get the value of the pdf file
in the current row of the list so that's
going to be this dot selection data 0
dot pdf name and i can get that
uh information by just going to more
help over there
and then i basically call the pdf viewer
load
method and i specify the name of the
pdf file to load so that was that's all
that was necessary
in order to display the um
pdf file that i'm pointing to over here
in the
pdf viewer so now i can go here and go
to say uh 125 and then
look at this pdf in a little bit more
detail so the ability to display
pdfs directly on a ux using the
pdf viewer control is a
nice enhancement that is easier to use
than using
iframes to display pdf files thanks very
much for watching
Customer Support