手順1:アプリケーションへの C1PdfViewer の追加

この手順では、最初に Visual Studio で PdfViewer for UWP を使用する UWP スタイルのアプリケーションを作成します。プロジェクトをセットアップし、C1PdfViewer コントロールをアプリケーションに追加するには、次の手順に従います。

Visual Studio 2015 で、［ファイル］→［新規作成］→［プロジェクト］を選択します。
［新しいプロジェクト］ダイアログボックスで、［テンプレート］→［Visual C#］→［Windows］→［ユニバーサル］を選択します。テンプレートリストから、［空白のアプリ（ユニバーサルWindows）］を選択します。［名前］を入力し、［OK］をクリックしてプロジェクトを作成します。
MainPage.xaml が開いていない場合は開きます。<Grid> タグと </Grid> タグの間にカーソルを置き、１回クリックします。

次の列定義と行定義を <Grid> タグと </Grid> タグの間に追加します。

マークアップ	コードのコピー
<Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions>

グリッド内の要素が配置されて表示されます。

ツールボックスに移動し、［C1PdfViewer］アイコンをダブルクリックして、コントロールをアプリケーションに追加します。

C1PdfViewer のマークアップを次のように編集します。

マークアップ	コードのコピー
<PdfViewer:C1PdfViewer x:Name="pdfViewer" ViewMode="FitWidth"Grid.Row="1"Grid.ColumnSpan="2"/>

このマークアップは、コントロールに名前を付け、コントロールに PDF の幅全体が表示されるように ViewMode を設定し、コントロールのレイアウトをカスタマイズします。

ツールボックスに移動し、StackPanel アイコンをダブルクリックしてページに追加します。StackPanel のマークアップを次のように編集します。

マークアップ	コードのコピー
<StackPanel Orientation="Horizontal" Margin="8" VerticalAlignment="Center"> <TextBlock Text="{Binding ElementName=pdfViewer, Path=PageNumber}" FontSize="20" Foreground="{StaticResourceApplicationForegroundThemeBrush}" /> <TextBlock Text=" / " Foreground="{StaticResource ApplicationForegroundThemeBrush}" FontSize="20"/> <TextBlock Text="{Binding ElementName=pdfViewer, Path=PageCount}" FontSize="20" Foreground="{StaticResourceApplicationForegroundThemeBrush}" /> </StackPanel>

マークアップ

コードのコピー

<StackPanel Orientation="Horizontal" Margin="8" VerticalAlignment="Center">
<TextBlock Text="{Binding ElementName=pdfViewer, Path=PageNumber}" FontSize="20" 
      Foreground="{StaticResourceApplicationForegroundThemeBrush}" />
<TextBlock Text=" / " Foreground="{StaticResource ApplicationForegroundThemeBrush}" 
      FontSize="20"/>
<TextBlock Text="{Binding ElementName=pdfViewer, Path=PageCount}" FontSize="20" 
      Foreground="{StaticResourceApplicationForegroundThemeBrush}" />
</StackPanel>

このマークアップは、StackPanel に３つの TextBlock コントロールを追加します。

StackPanel の終了タグアイコンの直後に次のマークアップを追加して、ページに Button を追加します。

マークアップ	コードのコピー
<Button x:Name="btnLoad" Grid.Column="1" Content=" Load Pdf... " HorizontalAlignment="Right" VerticalAlignment="Top" Margin="8" Click="btnLoad_Click" />

これで、UWP スタイルのアプリケーションを作成できました。次の手順では、PDF を表示するコードをアプリケーションに追加します。