クリックして画像を拡大C＃UWP

Question

クリックしてC＃（まさにUWP）で画像を拡大するにはどうすればよいですか？ 私はいくつかのことを試しました：

1）私は、画像の内容を持つボタンを追加しようとしましたが、拡大したいものをクリックしてから、イベントをクリックしました。しかし、私はそのコードに何を追加すべきか分かりません。

2）画像を直接XAMLページに追加しようとしましたが、タップされたイベントを作成したかったのですが、もう一度そのコードに何を追加するべきかわかりません。

ちょうど小さなフォトギャラリーを作成したいので、画像サムネイルをクリックすると拡大画像が開きます。

また、pdfファイルを追加する可能性がある場合は、それも書き込むことができます。それが私の問題のもう一つの解決です。

Answer 1

あなたはScaleTransformに設定することにより、そのRenderTransformプロパティをイメージすると拡大できます

private void Image_Tapped(object sender, TappedRoutedEventArgs e) 
{ 
    Image image = sender as Image; 
    image.RenderTransform = new ScaleTransform() { ScaleX = 2, ScaleY = 2 }; 
} 

---

<Image Source="ms-appx:///Assets/pic.png" Tapped="Image_Tapped" Stretch="None" /> 

scaleXプロパティとscaleYプロパティは、スケーリング係数を取得または設定します。詳細については、MSDNのドキュメントを参照してください。https://msdn.microsoft.com/library/windows/apps/br242940?f=255&MSPPError=-2147217396

問題はありますか？ GridViewのようなイメージを追加すると、イメージが重なり合って強調表示されます。画像は重なり合う可能性がありますが、クリックすると画像が常に上に表示されます。

タップされた画像をポップアップに入れて、再びタップしたときに元のパネルに戻すことができます。

private void Image_Tapped(object sender, TappedRoutedEventArgs e) 
{ 
    Image image = sender as Image; 

    Panel parent = image.Parent as Panel; 
    if (parent != null) 
    { 
     image.RenderTransform = new ScaleTransform() { ScaleX = 2, ScaleY = 2 }; 
     parent.Children.Remove(image); 
     parent.Children.Add(new Popup() { Child = image, IsOpen = true, Tag = parent }); 
    } 
    else 
    { 
     Popup popup = image.Parent as Popup; 
     popup.Child = null; 
     Panel panel = popup.Tag as Panel; 
     image.RenderTransform = null; 
     panel.Children.Add(image); 
    } 
} 

---

<GridView SelectionMode="None" isItemClickEnabled="True"> 
    <GridView.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Image Source="ms-appx:///Assets/pic.png" Tapped="Image_Tapped" Stretch="None" /> 
      </Grid> 
     </DataTemplate> 
    </GridView.ItemTemplate> 
</GridView>