回答編集履歴
5
動画
answer
CHANGED
@@ -253,7 +253,7 @@
|
|
253
253
|
|
254
254
|
xamlがごちゃごちゃして難しそうですが、`Blend For Visual Studio`で作成したのでほとんどマウス操作だけで済んでいます。
|
255
255
|
|
256
|
-

|
257
257
|
|
258
258
|
---
|
259
259
|
|
4
見直しキャンペーン中
answer
CHANGED
@@ -273,9 +273,9 @@
|
|
273
273
|
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries
|
274
274
|
```
|
275
275
|
|
276
|
-
`Microsoft.Expression.Drawing.dll`
|
276
|
+
* `Microsoft.Expression.Drawing.dll`
|
277
|
-
`Microsoft.Expression.Interactions.dll`
|
277
|
+
* `Microsoft.Expression.Interactions.dll`
|
278
|
-
`System.Windows.Interactivity.dll`
|
278
|
+
* `System.Windows.Interactivity.dll`
|
279
279
|
の3つを`Ctrl`を押しながらクリック、
|
280
280
|
「追加」ボタンを押し、ファイル選択ダイアログを閉じる。
|
281
281
|
「OK」ボタンを押し、参照マネージャーを閉じる。
|
3
見直しキャンペーン中
answer
CHANGED
@@ -1,10 +1,8 @@
|
|
1
|
-
WPFで要素のドラッグ移動には、
|
1
|
+
WPFで要素のドラッグ移動には、↓こういうのがあります(ありました?)
|
2
2
|
[MouseDragElementBehavior クラス (Microsoft.Expression.Interactivity.Layout) | Microsoft Docs](https://docs.microsoft.com/ja-jp/previous-versions/visualstudio/design-tools/expression-studio-4/ff726476(v=expression.40))
|
3
|
-
こういうのがあります(ありました?)
|
4
3
|
|
5
|
-
現在
|
4
|
+
現在Microsoftは(なかったことにしたい?のか)こちらに移行させたいようなのですが、元の半分程度の実装しかありません。
|
6
5
|
[MouseDragElementBehavior · microsoft/XamlBehaviorsWpf Wiki](https://github.com/Microsoft/XamlBehaviorsWpf/wiki/MouseDragElementBehavior)
|
7
|
-
こちらに移行させたいようなのですが、元の半分程度の実装しかありません。
|
8
6
|
|
9
7
|
しかしまだ入手は可能です。
|
10
8
|
~~[Download Microsoft Expression Blend 4 Software Development Kit (SDK) for .NET 4 from Official Microsoft Download Center](https://www.microsoft.com/ja-jp/download/details.aspx?id=10801)
|
2
見直しキャンペーン中
answer
CHANGED
@@ -1,289 +1,289 @@
|
|
1
|
-
WPFで要素のドラッグ移動には、
|
2
|
-
[MouseDragElementBehavior クラス (Microsoft.Expression.Interactivity.Layout) | Microsoft Docs](https://docs.microsoft.com/ja-jp/previous-versions/visualstudio/design-tools/expression-studio-4/ff726476(v=expression.40))
|
3
|
-
こういうのがあります(ありました?)
|
4
|
-
|
5
|
-
現在`Microsoft`はなかったことにしたい?のか、
|
6
|
-
[MouseDragElementBehavior · microsoft/XamlBehaviorsWpf Wiki](https://github.com/Microsoft/XamlBehaviorsWpf/wiki/MouseDragElementBehavior)
|
7
|
-
こちらに移行させたいようなのですが、元の半分程度の実装しかありません。
|
8
|
-
|
9
|
-
しかしまだ入手は可能です。
|
10
|
-
[Download Microsoft Expression Blend 4 Software Development Kit (SDK) for .NET 4 from Official Microsoft Download Center](https://www.microsoft.com/ja-jp/download/details.aspx?id=10801)
|
11
|
-
`Blend For Visual Studio`がインストールされていれば、すでに入っているはずです(`Blend For Visual Studio`もまだインストール可能だと思うのですが、2019での入れ方がよくわかりませんでした)
|
12
|
-
|
13
|
-
|
14
|
-
```
|
15
|
-
<Window
|
16
|
-
x:Class="Questions304033.MainWindow"
|
17
|
-
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
18
|
-
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
19
|
-
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
20
|
-
xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
|
21
|
-
xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
|
22
|
-
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
|
23
|
-
xmlns:local="clr-namespace:Questions304033"
|
24
|
-
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
25
|
-
Title="MainWindow"
|
26
|
-
Width="800"
|
27
|
-
Height="450"
|
28
|
-
Loaded="Window_Loaded"
|
29
|
-
mc:Ignorable="d">
|
30
|
-
<Window.Resources>
|
31
|
-
<Storyboard x:Key="Storyboard1">
|
32
|
-
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="regularPolygon" Storyboard.TargetProperty="(UIElement.Opacity)">
|
33
|
-
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
|
34
|
-
</DoubleAnimationUsingKeyFrames>
|
35
|
-
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="regularPolygon1" Storyboard.TargetProperty="(UIElement.Opacity)">
|
36
|
-
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
|
37
|
-
</DoubleAnimationUsingKeyFrames>
|
38
|
-
<ColorAnimationUsingKeyFrames Storyboard.TargetName="rectangle" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
|
39
|
-
<EasingColorKeyFrame KeyTime="0:0:1" Value="Orange" />
|
40
|
-
</ColorAnimationUsingKeyFrames>
|
41
|
-
</Storyboard>
|
42
|
-
</Window.Resources>
|
43
|
-
<Canvas>
|
44
|
-
<Button Click="Button_Click" Content="リセット" />
|
45
|
-
<ed:Callout
|
46
|
-
x:Name="callout"
|
47
|
-
Canvas.Left="447"
|
48
|
-
Canvas.Top="15"
|
49
|
-
Width="240"
|
50
|
-
Height="100"
|
51
|
-
AnchorPoint="-0.1,1"
|
52
|
-
CalloutStyle="Oval"
|
53
|
-
Content="どこにピッタリはまるかな?"
|
54
|
-
Fill="#FFF4F4F5"
|
55
|
-
Stroke="Black"
|
56
|
-
StrokeThickness="3" />
|
57
|
-
<ed:RegularPolygon
|
58
|
-
Canvas.Left="126"
|
59
|
-
Canvas.Top="270"
|
60
|
-
Width="120"
|
61
|
-
Height="120"
|
62
|
-
Fill="#FFF4F4F5"
|
63
|
-
InnerRadius="1"
|
64
|
-
PointCount="6"
|
65
|
-
Stretch="Fill"
|
66
|
-
Stroke="Black"
|
67
|
-
StrokeThickness="3" />
|
68
|
-
<Rectangle
|
69
|
-
x:Name="rectangle"
|
70
|
-
Canvas.Left="368"
|
71
|
-
Canvas.Top="280"
|
72
|
-
Width="100"
|
73
|
-
Height="100"
|
74
|
-
Fill="#FFF4F4F5"
|
75
|
-
RenderTransformOrigin="0.5,0.5"
|
76
|
-
Stroke="Black"
|
77
|
-
StrokeThickness="3">
|
78
|
-
<Rectangle.RenderTransform>
|
79
|
-
<TransformGroup>
|
80
|
-
<ScaleTransform />
|
81
|
-
<SkewTransform AngleX="-26.666" />
|
82
|
-
<RotateTransform />
|
83
|
-
<TranslateTransform />
|
84
|
-
</TransformGroup>
|
85
|
-
</Rectangle.RenderTransform>
|
86
|
-
</Rectangle>
|
87
|
-
<ed:RegularPolygon
|
88
|
-
Canvas.Left="597"
|
89
|
-
Canvas.Top="282"
|
90
|
-
Width="120"
|
91
|
-
Height="100"
|
92
|
-
Fill="#FFF4F4F5"
|
93
|
-
InnerRadius="1"
|
94
|
-
PointCount="5"
|
95
|
-
Stretch="Fill"
|
96
|
-
Stroke="Black"
|
97
|
-
StrokeThickness="3" />
|
98
|
-
|
99
|
-
<ed:RegularPolygon
|
100
|
-
x:Name="regularPolygon"
|
101
|
-
Canvas.Left="100"
|
102
|
-
Canvas.Top="70"
|
103
|
-
Width="100"
|
104
|
-
Height="100"
|
105
|
-
Fill="Orange"
|
106
|
-
PointCount="3"
|
107
|
-
RenderTransformOrigin="0.5,0.5"
|
108
|
-
Stroke="Black"
|
109
|
-
StrokeThickness="3">
|
110
|
-
<i:Interaction.Behaviors>
|
111
|
-
<ei:MouseDragElementBehavior
|
112
|
-
x:Name="mouseDragElementBehavior"
|
113
|
-
ConstrainToParentBounds="True"
|
114
|
-
DragFinished="MouseDragElementBehavior_DragFinished" />
|
115
|
-
</i:Interaction.Behaviors>
|
116
|
-
<ed:RegularPolygon.RenderTransform>
|
117
|
-
<TransformGroup>
|
118
|
-
<ScaleTransform />
|
119
|
-
<SkewTransform />
|
120
|
-
<RotateTransform Angle="180" />
|
121
|
-
<TranslateTransform />
|
122
|
-
</TransformGroup>
|
123
|
-
</ed:RegularPolygon.RenderTransform>
|
124
|
-
</ed:RegularPolygon>
|
125
|
-
|
126
|
-
<ed:RegularPolygon
|
127
|
-
x:Name="regularPolygon1"
|
128
|
-
Canvas.Left="200"
|
129
|
-
Canvas.Top="70"
|
130
|
-
Width="100"
|
131
|
-
Height="100"
|
132
|
-
Fill="Orange"
|
133
|
-
PointCount="3"
|
134
|
-
Stroke="Black"
|
135
|
-
StrokeThickness="3">
|
136
|
-
<i:Interaction.Behaviors>
|
137
|
-
<ei:MouseDragElementBehavior
|
138
|
-
x:Name="mouseDragElementBehavior1"
|
139
|
-
ConstrainToParentBounds="True"
|
140
|
-
DragFinished="mouseDragElementBehavior1_DragFinished" />
|
141
|
-
</i:Interaction.Behaviors>
|
142
|
-
<!-- ↓消したらダメ 恐らくMouseDragElementBehaviorがバグっていて挙動が変になる -->
|
143
|
-
<ed:RegularPolygon.RenderTransform>
|
144
|
-
<TransformGroup>
|
145
|
-
<ScaleTransform />
|
146
|
-
<SkewTransform />
|
147
|
-
<RotateTransform />
|
148
|
-
<TranslateTransform />
|
149
|
-
</TransformGroup>
|
150
|
-
</ed:RegularPolygon.RenderTransform>
|
151
|
-
</ed:RegularPolygon>
|
152
|
-
</Canvas>
|
153
|
-
</Window>
|
154
|
-
```
|
155
|
-
|
156
|
-
```
|
157
|
-
using System;
|
158
|
-
using System.Windows;
|
159
|
-
using System.Windows.Input;
|
160
|
-
using System.Windows.Media;
|
161
|
-
using System.Windows.Media.Animation;
|
162
|
-
|
163
|
-
namespace Questions304033
|
164
|
-
{
|
165
|
-
public partial class MainWindow : Window
|
166
|
-
{
|
167
|
-
private Transform transform; // ▼初期位置
|
168
|
-
private Transform transform1;// ▲初期位置
|
169
|
-
|
170
|
-
public MainWindow() => InitializeComponent();
|
171
|
-
|
172
|
-
private void Window_Loaded(object sender, RoutedEventArgs e)
|
173
|
-
{
|
174
|
-
// 三角の初期位置保存
|
175
|
-
transform = regularPolygon.RenderTransform;
|
176
|
-
transform1 = regularPolygon1.RenderTransform;
|
177
|
-
}
|
178
|
-
|
179
|
-
private void Button_Click(object sender, RoutedEventArgs e)
|
180
|
-
{
|
181
|
-
// 三角とひし形のアニメーションを止めて元に戻す
|
182
|
-
var storyboard = FindResource("Storyboard1") as Storyboard;
|
183
|
-
storyboard.Stop();
|
184
|
-
|
185
|
-
// 三角の当たり判定を復活
|
186
|
-
regularPolygon.IsHitTestVisible = true;
|
187
|
-
regularPolygon1.IsHitTestVisible = true;
|
188
|
-
|
189
|
-
// 三角を初期位置に戻す
|
190
|
-
regularPolygon.RenderTransform = transform;
|
191
|
-
regularPolygon1.RenderTransform = transform1;
|
192
|
-
}
|
193
|
-
|
194
|
-
// ▼ドラッグ終了時
|
195
|
-
private void MouseDragElementBehavior_DragFinished(object sender, MouseEventArgs e)
|
196
|
-
{
|
197
|
-
var x = mouseDragElementBehavior.X;
|
198
|
-
var y = mouseDragElementBehavior.Y;
|
199
|
-
|
200
|
-
// 目標座標との差分
|
201
|
-
var dx = Math.Abs(x - 492); // 注)回転しているためWidth Height分だけ増えてる?
|
202
|
-
var dy = Math.Abs(y - 380);
|
203
|
-
|
204
|
-
// 十分近ければ。。。
|
205
|
-
if (dx < 20 && dy < 20)
|
206
|
-
{
|
207
|
-
// 三角を目標座標ピッタリに移動
|
208
|
-
mouseDragElementBehavior.X = 492;
|
209
|
-
mouseDragElementBehavior.Y = 380;
|
210
|
-
|
211
|
-
// 三角の当たり判定なくし移動できなくする
|
212
|
-
regularPolygon.IsHitTestVisible = false;
|
213
|
-
}
|
214
|
-
|
215
|
-
// もし三角が2つともはまったらアニメーション開始
|
216
|
-
if (!regularPolygon.IsHitTestVisible && !regularPolygon1.IsHitTestVisible)
|
217
|
-
{
|
218
|
-
var storyboard = FindResource("Storyboard1") as Storyboard;
|
219
|
-
storyboard.Begin();
|
220
|
-
}
|
221
|
-
}
|
222
|
-
|
223
|
-
// ▲ドラッグ終了時
|
224
|
-
private void mouseDragElementBehavior1_DragFinished(object sender, MouseEventArgs e)
|
225
|
-
{
|
226
|
-
var x = mouseDragElementBehavior1.X;
|
227
|
-
var y = mouseDragElementBehavior1.Y;
|
228
|
-
|
229
|
-
var dx = Math.Abs(x - 342);
|
230
|
-
var dy = Math.Abs(y - 282);
|
231
|
-
|
232
|
-
if (dx < 20 && dy < 20)
|
233
|
-
{
|
234
|
-
mouseDragElementBehavior1.X = 342;
|
235
|
-
mouseDragElementBehavior1.Y = 282;
|
236
|
-
|
237
|
-
regularPolygon1.IsHitTestVisible = false;
|
238
|
-
}
|
239
|
-
|
240
|
-
if (!regularPolygon.IsHitTestVisible && !regularPolygon1.IsHitTestVisible)
|
241
|
-
{
|
242
|
-
var sb = FindResource("Storyboard1") as Storyboard;
|
243
|
-
sb.Begin();
|
244
|
-
}
|
245
|
-
}
|
246
|
-
}
|
247
|
-
}
|
248
|
-
```
|
249
|
-
参照の追加で下記の追加が必要です。
|
250
|
-
```
|
251
|
-
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\Microsoft.Expression.Drawing.dll
|
252
|
-
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\Microsoft.Expression.Interactions.dll
|
253
|
-
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\System.Windows.Interactivity.dll
|
254
|
-
```
|
255
|
-
|
256
|
-
xamlがごちゃごちゃして難しそうですが、`Blend For Visual Studio`で作成したのでほとんどマウス操作だけで済んでいます。
|
257
|
-
|
258
|
-

|
259
|
-
|
260
|
-
---
|
261
|
-
|
262
|
-
追記 回答コードを試す場合の手順
|
263
|
-
|
264
|
-
新規ソリューションを`Questions304033`と名前をつけて作成(場所はどこでもOK)
|
265
|
-

|
266
|
-
|
267
|
-
「ソリューション エクスプローラー」を開き「参照」を右クリック「参照の追加(R)...」を選択
|
268
|
-

|
269
|
-
|
270
|
-
参照マネージャーが開きます。「参照(E)...」ボタンを押す。
|
271
|
-

|
272
|
-
|
273
|
-
ファイル選択ダイアログが開くので↓まで移動し
|
274
|
-
```
|
275
|
-
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries
|
276
|
-
```
|
277
|
-
|
278
|
-
`Microsoft.Expression.Drawing.dll`
|
279
|
-
`Microsoft.Expression.Interactions.dll`
|
280
|
-
`System.Windows.Interactivity.dll`
|
281
|
-
の3つを`Ctrl`を押しながらクリック、
|
282
|
-
「追加」ボタンを押し、ファイル選択ダイアログを閉じる。
|
283
|
-
「OK」ボタンを押し、参照マネージャーを閉じる。
|
284
|
-

|
285
|
-
|
286
|
-
「ソリューション エクスプローラー」の「参照」の中に、選択した3つが増えていれば成功です。
|
287
|
-

|
288
|
-
|
1
|
+
WPFで要素のドラッグ移動には、
|
2
|
+
[MouseDragElementBehavior クラス (Microsoft.Expression.Interactivity.Layout) | Microsoft Docs](https://docs.microsoft.com/ja-jp/previous-versions/visualstudio/design-tools/expression-studio-4/ff726476(v=expression.40))
|
3
|
+
こういうのがあります(ありました?)
|
4
|
+
|
5
|
+
現在`Microsoft`はなかったことにしたい?のか、
|
6
|
+
[MouseDragElementBehavior · microsoft/XamlBehaviorsWpf Wiki](https://github.com/Microsoft/XamlBehaviorsWpf/wiki/MouseDragElementBehavior)
|
7
|
+
こちらに移行させたいようなのですが、元の半分程度の実装しかありません。
|
8
|
+
|
9
|
+
しかしまだ入手は可能です。
|
10
|
+
~~[Download Microsoft Expression Blend 4 Software Development Kit (SDK) for .NET 4 from Official Microsoft Download Center](https://www.microsoft.com/ja-jp/download/details.aspx?id=10801)
|
11
|
+
`Blend For Visual Studio`がインストールされていれば、すでに入っているはずです(`Blend For Visual Studio`もまだインストール可能だと思うのですが、2019での入れ方がよくわかりませんでした)~~
|
12
|
+
[Microsoft Expression Blend SDKのダウンロードリンク - vorfee's Tech Blog](https://vorfee.hatenablog.jp/entry/2023/02/01/000929)
|
13
|
+
|
14
|
+
```xml
|
15
|
+
<Window
|
16
|
+
x:Class="Questions304033.MainWindow"
|
17
|
+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
18
|
+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
19
|
+
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
20
|
+
xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
|
21
|
+
xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
|
22
|
+
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
|
23
|
+
xmlns:local="clr-namespace:Questions304033"
|
24
|
+
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
25
|
+
Title="MainWindow"
|
26
|
+
Width="800"
|
27
|
+
Height="450"
|
28
|
+
Loaded="Window_Loaded"
|
29
|
+
mc:Ignorable="d">
|
30
|
+
<Window.Resources>
|
31
|
+
<Storyboard x:Key="Storyboard1">
|
32
|
+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="regularPolygon" Storyboard.TargetProperty="(UIElement.Opacity)">
|
33
|
+
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
|
34
|
+
</DoubleAnimationUsingKeyFrames>
|
35
|
+
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="regularPolygon1" Storyboard.TargetProperty="(UIElement.Opacity)">
|
36
|
+
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" />
|
37
|
+
</DoubleAnimationUsingKeyFrames>
|
38
|
+
<ColorAnimationUsingKeyFrames Storyboard.TargetName="rectangle" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
|
39
|
+
<EasingColorKeyFrame KeyTime="0:0:1" Value="Orange" />
|
40
|
+
</ColorAnimationUsingKeyFrames>
|
41
|
+
</Storyboard>
|
42
|
+
</Window.Resources>
|
43
|
+
<Canvas>
|
44
|
+
<Button Click="Button_Click" Content="リセット" />
|
45
|
+
<ed:Callout
|
46
|
+
x:Name="callout"
|
47
|
+
Canvas.Left="447"
|
48
|
+
Canvas.Top="15"
|
49
|
+
Width="240"
|
50
|
+
Height="100"
|
51
|
+
AnchorPoint="-0.1,1"
|
52
|
+
CalloutStyle="Oval"
|
53
|
+
Content="どこにピッタリはまるかな?"
|
54
|
+
Fill="#FFF4F4F5"
|
55
|
+
Stroke="Black"
|
56
|
+
StrokeThickness="3" />
|
57
|
+
<ed:RegularPolygon
|
58
|
+
Canvas.Left="126"
|
59
|
+
Canvas.Top="270"
|
60
|
+
Width="120"
|
61
|
+
Height="120"
|
62
|
+
Fill="#FFF4F4F5"
|
63
|
+
InnerRadius="1"
|
64
|
+
PointCount="6"
|
65
|
+
Stretch="Fill"
|
66
|
+
Stroke="Black"
|
67
|
+
StrokeThickness="3" />
|
68
|
+
<Rectangle
|
69
|
+
x:Name="rectangle"
|
70
|
+
Canvas.Left="368"
|
71
|
+
Canvas.Top="280"
|
72
|
+
Width="100"
|
73
|
+
Height="100"
|
74
|
+
Fill="#FFF4F4F5"
|
75
|
+
RenderTransformOrigin="0.5,0.5"
|
76
|
+
Stroke="Black"
|
77
|
+
StrokeThickness="3">
|
78
|
+
<Rectangle.RenderTransform>
|
79
|
+
<TransformGroup>
|
80
|
+
<ScaleTransform />
|
81
|
+
<SkewTransform AngleX="-26.666" />
|
82
|
+
<RotateTransform />
|
83
|
+
<TranslateTransform />
|
84
|
+
</TransformGroup>
|
85
|
+
</Rectangle.RenderTransform>
|
86
|
+
</Rectangle>
|
87
|
+
<ed:RegularPolygon
|
88
|
+
Canvas.Left="597"
|
89
|
+
Canvas.Top="282"
|
90
|
+
Width="120"
|
91
|
+
Height="100"
|
92
|
+
Fill="#FFF4F4F5"
|
93
|
+
InnerRadius="1"
|
94
|
+
PointCount="5"
|
95
|
+
Stretch="Fill"
|
96
|
+
Stroke="Black"
|
97
|
+
StrokeThickness="3" />
|
98
|
+
|
99
|
+
<ed:RegularPolygon
|
100
|
+
x:Name="regularPolygon"
|
101
|
+
Canvas.Left="100"
|
102
|
+
Canvas.Top="70"
|
103
|
+
Width="100"
|
104
|
+
Height="100"
|
105
|
+
Fill="Orange"
|
106
|
+
PointCount="3"
|
107
|
+
RenderTransformOrigin="0.5,0.5"
|
108
|
+
Stroke="Black"
|
109
|
+
StrokeThickness="3">
|
110
|
+
<i:Interaction.Behaviors>
|
111
|
+
<ei:MouseDragElementBehavior
|
112
|
+
x:Name="mouseDragElementBehavior"
|
113
|
+
ConstrainToParentBounds="True"
|
114
|
+
DragFinished="MouseDragElementBehavior_DragFinished" />
|
115
|
+
</i:Interaction.Behaviors>
|
116
|
+
<ed:RegularPolygon.RenderTransform>
|
117
|
+
<TransformGroup>
|
118
|
+
<ScaleTransform />
|
119
|
+
<SkewTransform />
|
120
|
+
<RotateTransform Angle="180" />
|
121
|
+
<TranslateTransform />
|
122
|
+
</TransformGroup>
|
123
|
+
</ed:RegularPolygon.RenderTransform>
|
124
|
+
</ed:RegularPolygon>
|
125
|
+
|
126
|
+
<ed:RegularPolygon
|
127
|
+
x:Name="regularPolygon1"
|
128
|
+
Canvas.Left="200"
|
129
|
+
Canvas.Top="70"
|
130
|
+
Width="100"
|
131
|
+
Height="100"
|
132
|
+
Fill="Orange"
|
133
|
+
PointCount="3"
|
134
|
+
Stroke="Black"
|
135
|
+
StrokeThickness="3">
|
136
|
+
<i:Interaction.Behaviors>
|
137
|
+
<ei:MouseDragElementBehavior
|
138
|
+
x:Name="mouseDragElementBehavior1"
|
139
|
+
ConstrainToParentBounds="True"
|
140
|
+
DragFinished="mouseDragElementBehavior1_DragFinished" />
|
141
|
+
</i:Interaction.Behaviors>
|
142
|
+
<!-- ↓消したらダメ 恐らくMouseDragElementBehaviorがバグっていて挙動が変になる -->
|
143
|
+
<ed:RegularPolygon.RenderTransform>
|
144
|
+
<TransformGroup>
|
145
|
+
<ScaleTransform />
|
146
|
+
<SkewTransform />
|
147
|
+
<RotateTransform />
|
148
|
+
<TranslateTransform />
|
149
|
+
</TransformGroup>
|
150
|
+
</ed:RegularPolygon.RenderTransform>
|
151
|
+
</ed:RegularPolygon>
|
152
|
+
</Canvas>
|
153
|
+
</Window>
|
154
|
+
```
|
155
|
+
|
156
|
+
```cs
|
157
|
+
using System;
|
158
|
+
using System.Windows;
|
159
|
+
using System.Windows.Input;
|
160
|
+
using System.Windows.Media;
|
161
|
+
using System.Windows.Media.Animation;
|
162
|
+
|
163
|
+
namespace Questions304033
|
164
|
+
{
|
165
|
+
public partial class MainWindow : Window
|
166
|
+
{
|
167
|
+
private Transform transform; // ▼初期位置
|
168
|
+
private Transform transform1;// ▲初期位置
|
169
|
+
|
170
|
+
public MainWindow() => InitializeComponent();
|
171
|
+
|
172
|
+
private void Window_Loaded(object sender, RoutedEventArgs e)
|
173
|
+
{
|
174
|
+
// 三角の初期位置保存
|
175
|
+
transform = regularPolygon.RenderTransform;
|
176
|
+
transform1 = regularPolygon1.RenderTransform;
|
177
|
+
}
|
178
|
+
|
179
|
+
private void Button_Click(object sender, RoutedEventArgs e)
|
180
|
+
{
|
181
|
+
// 三角とひし形のアニメーションを止めて元に戻す
|
182
|
+
var storyboard = FindResource("Storyboard1") as Storyboard;
|
183
|
+
storyboard.Stop();
|
184
|
+
|
185
|
+
// 三角の当たり判定を復活
|
186
|
+
regularPolygon.IsHitTestVisible = true;
|
187
|
+
regularPolygon1.IsHitTestVisible = true;
|
188
|
+
|
189
|
+
// 三角を初期位置に戻す
|
190
|
+
regularPolygon.RenderTransform = transform;
|
191
|
+
regularPolygon1.RenderTransform = transform1;
|
192
|
+
}
|
193
|
+
|
194
|
+
// ▼ドラッグ終了時
|
195
|
+
private void MouseDragElementBehavior_DragFinished(object sender, MouseEventArgs e)
|
196
|
+
{
|
197
|
+
var x = mouseDragElementBehavior.X;
|
198
|
+
var y = mouseDragElementBehavior.Y;
|
199
|
+
|
200
|
+
// 目標座標との差分
|
201
|
+
var dx = Math.Abs(x - 492); // 注)回転しているためWidth Height分だけ増えてる?
|
202
|
+
var dy = Math.Abs(y - 380);
|
203
|
+
|
204
|
+
// 十分近ければ。。。
|
205
|
+
if (dx < 20 && dy < 20)
|
206
|
+
{
|
207
|
+
// 三角を目標座標ピッタリに移動
|
208
|
+
mouseDragElementBehavior.X = 492;
|
209
|
+
mouseDragElementBehavior.Y = 380;
|
210
|
+
|
211
|
+
// 三角の当たり判定なくし移動できなくする
|
212
|
+
regularPolygon.IsHitTestVisible = false;
|
213
|
+
}
|
214
|
+
|
215
|
+
// もし三角が2つともはまったらアニメーション開始
|
216
|
+
if (!regularPolygon.IsHitTestVisible && !regularPolygon1.IsHitTestVisible)
|
217
|
+
{
|
218
|
+
var storyboard = FindResource("Storyboard1") as Storyboard;
|
219
|
+
storyboard.Begin();
|
220
|
+
}
|
221
|
+
}
|
222
|
+
|
223
|
+
// ▲ドラッグ終了時
|
224
|
+
private void mouseDragElementBehavior1_DragFinished(object sender, MouseEventArgs e)
|
225
|
+
{
|
226
|
+
var x = mouseDragElementBehavior1.X;
|
227
|
+
var y = mouseDragElementBehavior1.Y;
|
228
|
+
|
229
|
+
var dx = Math.Abs(x - 342);
|
230
|
+
var dy = Math.Abs(y - 282);
|
231
|
+
|
232
|
+
if (dx < 20 && dy < 20)
|
233
|
+
{
|
234
|
+
mouseDragElementBehavior1.X = 342;
|
235
|
+
mouseDragElementBehavior1.Y = 282;
|
236
|
+
|
237
|
+
regularPolygon1.IsHitTestVisible = false;
|
238
|
+
}
|
239
|
+
|
240
|
+
if (!regularPolygon.IsHitTestVisible && !regularPolygon1.IsHitTestVisible)
|
241
|
+
{
|
242
|
+
var sb = FindResource("Storyboard1") as Storyboard;
|
243
|
+
sb.Begin();
|
244
|
+
}
|
245
|
+
}
|
246
|
+
}
|
247
|
+
}
|
248
|
+
```
|
249
|
+
参照の追加で下記の追加が必要です。
|
250
|
+
```
|
251
|
+
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\Microsoft.Expression.Drawing.dll
|
252
|
+
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\Microsoft.Expression.Interactions.dll
|
253
|
+
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries\System.Windows.Interactivity.dll
|
254
|
+
```
|
255
|
+
|
256
|
+
xamlがごちゃごちゃして難しそうですが、`Blend For Visual Studio`で作成したのでほとんどマウス操作だけで済んでいます。
|
257
|
+
|
258
|
+

|
259
|
+
|
260
|
+
---
|
261
|
+
|
262
|
+
追記 回答コードを試す場合の手順
|
263
|
+
|
264
|
+
新規ソリューションを`Questions304033`と名前をつけて作成(場所はどこでもOK)
|
265
|
+

|
266
|
+
|
267
|
+
「ソリューション エクスプローラー」を開き「参照」を右クリック「参照の追加(R)...」を選択
|
268
|
+

|
269
|
+
|
270
|
+
参照マネージャーが開きます。「参照(E)...」ボタンを押す。
|
271
|
+

|
272
|
+
|
273
|
+
ファイル選択ダイアログが開くので↓まで移動し
|
274
|
+
```
|
275
|
+
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries
|
276
|
+
```
|
277
|
+
|
278
|
+
`Microsoft.Expression.Drawing.dll`
|
279
|
+
`Microsoft.Expression.Interactions.dll`
|
280
|
+
`System.Windows.Interactivity.dll`
|
281
|
+
の3つを`Ctrl`を押しながらクリック、
|
282
|
+
「追加」ボタンを押し、ファイル選択ダイアログを閉じる。
|
283
|
+
「OK」ボタンを押し、参照マネージャーを閉じる。
|
284
|
+

|
285
|
+
|
286
|
+
「ソリューション エクスプローラー」の「参照」の中に、選択した3つが増えていれば成功です。
|
287
|
+

|
288
|
+
|
289
289
|
`MainWindow.xaml`・`MainWindow.xaml.cs`を、まるごとコピペで書き換えれば実行できます。
|
1
参照の追加
answer
CHANGED
@@ -255,4 +255,35 @@
|
|
255
255
|
|
256
256
|
xamlがごちゃごちゃして難しそうですが、`Blend For Visual Studio`で作成したのでほとんどマウス操作だけで済んでいます。
|
257
257
|
|
258
|
-

|
258
|
+

|
259
|
+
|
260
|
+
---
|
261
|
+
|
262
|
+
追記 回答コードを試す場合の手順
|
263
|
+
|
264
|
+
新規ソリューションを`Questions304033`と名前をつけて作成(場所はどこでもOK)
|
265
|
+

|
266
|
+
|
267
|
+
「ソリューション エクスプローラー」を開き「参照」を右クリック「参照の追加(R)...」を選択
|
268
|
+

|
269
|
+
|
270
|
+
参照マネージャーが開きます。「参照(E)...」ボタンを押す。
|
271
|
+

|
272
|
+
|
273
|
+
ファイル選択ダイアログが開くので↓まで移動し
|
274
|
+
```
|
275
|
+
C:\Program Files (x86)\Microsoft SDKs\Expression\Blend.NETFramework\v4.0\Libraries
|
276
|
+
```
|
277
|
+
|
278
|
+
`Microsoft.Expression.Drawing.dll`
|
279
|
+
`Microsoft.Expression.Interactions.dll`
|
280
|
+
`System.Windows.Interactivity.dll`
|
281
|
+
の3つを`Ctrl`を押しながらクリック、
|
282
|
+
「追加」ボタンを押し、ファイル選択ダイアログを閉じる。
|
283
|
+
「OK」ボタンを押し、参照マネージャーを閉じる。
|
284
|
+

|
285
|
+
|
286
|
+
「ソリューション エクスプローラー」の「参照」の中に、選択した3つが増えていれば成功です。
|
287
|
+

|
288
|
+
|
289
|
+
`MainWindow.xaml`・`MainWindow.xaml.cs`を、まるごとコピペで書き換えれば実行できます。
|