VB WPF お勉強 11 Image に単色背景を

写真のソフトをお使いの方はご存知と思いますが、
画像として表示する場合に、その下に背景が欲しい場合があります。
ここでは、 灰色 単色に 塗り潰した所 に 画像 を表示する事を考えます。
写真 のフレーム外が 灰色になる、　そんな感じのものを作って見ます。


Image に単色背景を持たせる方法 ... 。
きっと、　色々な 書き方がある と思いますし、
私の知らない もっと 簡単な！方法もある　とは考えているのですが、
差し当たり、　解決方法の ひとつ として、　備忘録的に　紹介して置きます。



縦横位置の混在や　カメラ機種の違いによる縦横比の違い。
そう、　一般的に、　一眼は 2：3 ですし、　コンパクトは 3：4 です。
ですから、　不特定機種に対応するには、　真四角（正方形）の範囲内に 画像を配置する 例 が非常に多いですね。
背景は、　標準反射率の基本である 反射率 18%、　つまり 50% Gray (#HTML #808080 sRGB) が多いです。
VB.net なら　Brushes.Gray　ですね。


以下の例では、
カメラの一眼を 基準に、　コンパクトの場合は 左右に背景の灰色を 覗かせる様にします。
つまり、　カメラで撮影した画像を表示する際に、
一眼を基準にし、　コンパクトは横手が短いのを認識させる方法です。　　特異な縦横比 は除外ですね。.
縦横位置表示は、この際、無視します。　　この例では　です。

　　　と言うのは、　縦横表示を組み込むには　EXIF の Orientation 情報の取得　が不可欠だから です。
　　　EXIF をハンドリング出来る方は、　以下の Code に 少しの手直し で　実現が可能です。

尚、　縦横比で 2：3 より 横長になると、調整値がマイナスを取り、表示が崩れます。
これは、表示域の縦横比が 2：3 に規定してある為です。
写真に於ける 既定の一般的な 比率 限定！　と言う事で お願いします。　　（汎用的なものではありません）


xaml

        <Border Width="300" Height="200" Margin="10,10,0,0" Background="Gray" HorizontalAlignment="Left" VerticalAlignment="Top">
            <Image x:Name="Image1" HorizontalAlignment="Left" Width="300" Height="200" VerticalAlignment="Top" />
        </Border>

VB Code

    Private Sub LoadImage(ByVal fp As String)
        'fp Is FileName (Path is Relative Or Absolute)

        Dim bi As New BitmapImage()
        bi.BeginInit()
        bi.CacheOption = BitmapCacheOption.OnLoad

        'bi.UriSource = New System.Uri(fp)
        bi.UriSource = New System.Uri(fp, UriKind.RelativeOrAbsolute)

        bi.DecodePixelHeight = CInt(Me.Image1.Height)
        RenderOptions.SetBitmapScalingMode(Me.Image1, BitmapScalingMode.NearestNeighbor)
        bi.EndInit()

        'Centerize Image (for camera .jpg)     'Height = max value of Image Control
        Dim centerizeWidth As Double = (Me.Image1.Width - CDbl(bi.PixelWidth)) / 2.0
        Dim originalTickness As Thickness = New Thickness(0.0, 0.0, 0.0, 0.0)
        Dim newTickness As Thickness = originalTickness
        newTickness.Left = originalTickness.Left + centerizeWidth
        Me.Image1.Margin = newTickness

        Me.Image1.Source = bi

    End Sub

位置ずれを操作する Thickness の基準 （ 変数 originalTickness ） は、
分かり易く、その都度、宣言する記述になっていますが、　本来は、ブロック外に追いやった方が良いでしょうね。