XamHtmlViewerを使ってSilverlightアプリ内でPDFを表示する。

Silverlightアプリ内でPDFを表示する。ではブラウザ上で実行中のSilverlight内ではPDFを表示できないと述べました。しかし、infragistics社のXamHtmlViewerを使用するとブラウザ上のSilverlightでPDFを表示できます。

アジェンダ

  • XamHtmlViewerを入手
  • 検証コード
  • XamHtmlViewerの注意点
  • まとめ

XamHtmlViewerを入手

XamHtmlViewerはNetAdvantage for Silverlightに含まれています。トライアル版が公開されているので、とりあえずこれを使って試してみると良いのではないでしょうか。

検証コード

XamHtmlViewerを使用するためには、以下のDLLをプロジェクトに追加します。

  • InfragisticsSL4.Controls.Interactions.XamHtmlViewer.v10.2.dll
  • InfragisticsSL4.v10.2.dll


次にMainPage.xamlにxmlnsを追加します。

xmlns:ig="http://schemas.infragistics.com/xaml"

最後にMainPage.xamlにXamHtmlViewerを追加します。

<ig:XamHtmlViewer SourceUri="http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/iac_developer_guide.pdf"/>

MainPage.xamlの全コードです。

<UserControl x:Class="PdfViewerForXamHtmlViewer.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ig="http://schemas.infragistics.com/xaml"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <ig:XamHtmlViewer SourceUri="http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/iac_developer_guide.pdf"/>
    </Grid>
</UserControl>

このコードを実行してみます。

PDFが表示されていますね。

XamHtmlViewerの注意点

XamHtmlViewerは最上位レイアに表示されてしまいます。そのため、下記のようなXAMLを実行した場合ボタンがXamHtmlViewerの下に表示されます。

<Grid x:Name="LayoutRoot" Background="White">
    <ig:XamHtmlViewer
          SourceUri="http://www.adobe.com/content/dam/Adobe/en/devnet/acrobat/pdfs/iac_developer_guide.pdf"
          Margin="50"/>
    <Button Content="テスト"/>
</Grid>

期待する画面はこうですが、

実際の動作はこうなります。

以上のように、XamHtmlViewerの上にはコントロールを表示できません。そのため、このことを考慮した画面設計が必要となります。

まとめ

Silverlight標準コントロールではブラウザ実行中にPDFを表示できませんが、infragistics社のXamHtmlViewerを使用すると表示可能であることがわかりました。
恐らく他のサードパーティ製コントロールでも同様のことが可能だと思われます。いくつか試してみると良いのではないでしょうか。