Pixtack紫陽花2ndの画像の表示は
Imageコン
トロールを入れたControlTemplateをThumbコン
トロールに指定しておいて
- Thumb作成
- Window.ResourcesからControlTemplateを取得
- ThumbにControlTemplateを指定
- ControlTemplateの中のImage取得
- 画像ファイルからBitmapImage作成
- ImageのSourceにBitmapImageを指定
- ThumbをCanvasに追加して表示
この流れで表示している
問題は4番のところでたまにImageを取得できないことがあった
今回これを解決できたっぽいので方法
4番の前、つまり中のImageを取得する前にApplyTemplateを実行する
Thumb.ApplyTemplate
これで解決できたっぽい
でも、どうやらこれを実行するとControlTemplateが再構築されるみたいなので取得に失敗することが無くなった
今回で必要なところは48から97行目まで
それ以外はこういうのができたらいいなあのデモ用
Imports System.Windows.Controls.Canvas
Imports System.Windows.Controls.Primitives
Class MainWindow
Private Sub tmb_DragDelta(sender As Object, e As DragDeltaEventArgs)
Dim t As Thumb = DirectCast(sender, Thumb)
Dim x As Double = e.HorizontalChange
Dim y As Double = e.VerticalChange
Dim tx As Double = GetLeft(t)
Dim ty As Double = GetTop(t)
x += tx
y += ty
SetTop(t, y)
SetLeft(t, x)
End Sub
Private Sub AddImage(cc As Canvas, path As List(Of String), p As List(Of Point))
For i As Integer = 0 To p.Count - 1
Dim b As New BitmapImage(New Uri(path(i)))
Dim img As New Image With {
.Source = b,
.Stretch = Stretch.None,
.Width = b.PixelWidth,
.Height = b.PixelHeight}
SetLeft(img, p(i).X) : SetTop(img, p(i).Y)
cc.Children.Add(img)
Next
End Sub
Private Function AddThumb(p As Point) As Canvas
Dim t As New Thumb
Dim tmp As ControlTemplate = Me.Resources.Item("ct")
t.Template = tmp
SetLeft(t, p.X) : SetTop(t, p.Y)
canvas1.Children.Add(t)
AddHandler t.DragDelta, AddressOf tmb_DragDelta
t.ApplyTemplate()
Dim cc As Canvas = t.Template.FindName("cCanvas", t)
Return cc
End Function
Private Sub bt1_Click(sender As Object, e As RoutedEventArgs) Handles bt1.Click
Dim t As New Thumb
t.Name = "ControlTemplateを適用したThumbです"
Dim tmp As ControlTemplate = Me.Resources.Item("ct")
t.Template = tmp
Dim emp As Canvas = t.Template.FindName("cCanvas", t)
t.ApplyTemplate()
Dim cc As Canvas = t.Template.FindName("cCanvas", t)
Dim cb As Button = t.Template.FindName("cButton", t)
Dim cl As ListBox = t.Template.FindName("cListbox", t)
Dim cctp As Thumb = DirectCast(cc.TemplatedParent, Thumb)
Dim cbtp As Thumb = DirectCast(cb.TemplatedParent, Thumb)
Dim cltp As Thumb = DirectCast(cl.TemplatedParent, Thumb)
Dim cctpn As String = cctp.Name
End Sub
Private Sub bt2_Click(sender As Object, e As RoutedEventArgs) Handles bt2.Click
Dim t As New Thumb
SetLeft(t, 0) : SetTop(t, 0)
canvas1.Children.Add(t)
t.Template = Resources.Item("ct")
t.ApplyTemplate()
AddHandler t.DragDelta, AddressOf tmb_DragDelta
Dim cc As Canvas = t.Template.FindName("cCanvas", t)
Dim path As New List(Of String)({"D:\ブログ用\テスト用画像\collection_1.png",
"D:\ブログ用\テスト用画像\collection_2.png",
"D:\ブログ用\テスト用画像\collection_3.png"})
Dim p As New List(Of Point)({New Point(10, 10),
New Point(50, 60),
New Point(80, 20)})
Call AddImage(cc, path, p)
End Sub
Private Sub bt3_Click(sender As Object, e As RoutedEventArgs) Handles bt3.Click
Dim t As New Thumb
SetLeft(t, 0) : SetTop(t, 0)
canvas1.Children.Add(t)
t.Template = Resources.Item("ct")
t.ApplyTemplate()
AddHandler t.DragDelta, AddressOf tmb_DragDelta
Dim cc As Canvas = t.Template.FindName("cCanvas", t)
Dim path As New List(Of String)({"D:\ブログ用\テスト用画像\hueRectT210.png",
"D:\ブログ用\テスト用画像\hueRectT255.png",
"D:\ブログ用\テスト用画像\hueRectT300.png"})
Dim p As New List(Of Point)({New Point(10, 10),
New Point(30, 30),
New Point(80, 20)})
Call AddImage(cc, path, p)
End Sub
End Class
ControlTemplateの中には
CanvasとButtonとListBoxの3つ入れてみた
それぞれ名前を付けておく、この名前を使って取得することになる
アプリを起動して中のControlを取得して確認してみる
ボタン1が確認ボタン
押すとコードの方に一時停止が指定してあるので
赤の中身が青
85行目でApplyTemplateを実行しているので、その前の82行目では中のControlを取得できていないのでNothingになっている
87行目からの3行ではそれぞれ3つのControlが取得できている(cc, cb, cl)
91行目からの3行では取得したControlのTemplateParentを取得していて、すべてThumbになっているのがわかる(cctp, cbtp, cltp)
これで作成したThumbに適用したControlTemplateの中のControlが取得できていることがわかった
ボタン2とボタン3は押すと3つの画像を一つにまとめた画像を表示する
Thumbの中の
CanvasにImageを3つ追加したものを表示
こういう画像や表示場所の決め打ちならできたけど、実際にはグループ化解除や画像の選択方法、その編集状態の保存とか入ってくるから難しいし、その前に今のPixtack紫陽花2ndはThumbの中に直接Imageを入れているから複数画像を入れられないから、Imageを
Canvasに変更してそこにImageを追加する方法に書き直さないとできない
グループ化も無印の時にはできなかったからなんとかしたいんだよねえ
今回のコード