回答編集履歴

1

見直しキャンペーン中

2023/07/27 15:32

投稿

TN8001
TN8001

スコア9801

test CHANGED
@@ -1,173 +1,87 @@
1
1
  `RotateFlip`はWinFormsのメソッドですので、WPFでは(基本的には)使えません。
2
-
3
2
  [Image.RotateFlip(RotateFlipType) メソッド (System.Drawing) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.drawing.image.rotateflip)
4
3
 
5
-
6
-
7
4
  読み込み時に適切に回したい場合は、こちらが参考になりそうです(動作確認はしていません)
8
-
9
5
  [C# WPF Exifの回転情報を取得して画像を表示する - Qiita](https://qiita.com/standard-software/items/6d111f73a1a8a075ed4c)
10
6
 
11
-
12
-
13
7
  ボタン操作等で自分で回したい場合は、`RotateTransform`がいいでしょう。
14
-
15
8
  [RotateTransform クラス (System.Windows.Media) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.media.rotatetransform)
16
9
 
17
-
18
-
19
10
  回転以外にもいろいろできます。
20
-
21
11
  [変換の概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/graphics-multimedia/transforms-overview)
22
12
 
23
-
24
-
25
- ```xaml
13
+ ```xml
26
-
27
14
  <Window
28
-
29
15
  x:Class="Questions344215.MainWindow"
30
-
31
16
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
32
-
33
17
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
34
-
35
18
  Width="300"
36
-
37
19
  Height="300">
38
-
39
20
  <Grid>
21
+ <Border
22
+ HorizontalAlignment="Center"
23
+ VerticalAlignment="Top"
24
+ BorderBrush="Black"
25
+ BorderThickness="1">
26
+ <Image
27
+ Width="133"
28
+ Height="95"
29
+ MouseDown="kaitennn"
30
+ Source="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg"
31
+ Stretch="Fill">
32
+ <!-- レイアウトに影響してボーダーもサイズが変わる -->
33
+ <Image.LayoutTransform>
34
+ <RotateTransform x:Name="rotateTransform1" />
35
+ </Image.LayoutTransform>
36
+ </Image>
37
+ </Border>
40
38
 
41
39
  <Border
42
-
43
40
  HorizontalAlignment="Center"
44
-
45
- VerticalAlignment="Top"
41
+ VerticalAlignment="Bottom"
46
-
47
42
  BorderBrush="Black"
48
-
49
43
  BorderThickness="1">
50
-
51
44
  <Image
52
-
53
45
  Width="133"
54
-
55
46
  Height="95"
56
-
57
- MouseDown="kaitennn"
47
+ MouseDown="kaitennnnn"
58
-
48
+ RenderTransformOrigin="0.5,0.5"
59
49
  Source="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg"
60
-
61
50
  Stretch="Fill">
62
-
63
- <!-- レイアウトに影響してボーダーもサイズが変わる -->
51
+ <!-- こちらはレイアウトに影響せず見た目だけ回転 -->
64
-
65
- <Image.LayoutTransform>
52
+ <Image.RenderTransform>
66
-
67
- <RotateTransform x:Name="rotateTransform1" />
53
+ <RotateTransform x:Name="rotateTransform2" />
68
-
69
- </Image.LayoutTransform>
54
+ </Image.RenderTransform>
70
-
71
55
  </Image>
72
-
73
56
  </Border>
74
-
75
-
76
-
77
- <Border
78
-
79
- HorizontalAlignment="Center"
80
-
81
- VerticalAlignment="Bottom"
82
-
83
- BorderBrush="Black"
84
-
85
- BorderThickness="1">
86
-
87
- <Image
88
-
89
- Width="133"
90
-
91
- Height="95"
92
-
93
- MouseDown="kaitennnnn"
94
-
95
- RenderTransformOrigin="0.5,0.5"
96
-
97
- Source="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg"
98
-
99
- Stretch="Fill">
100
-
101
- <!-- こちらはレイアウトには影響せず見た目だけ回転 -->
102
-
103
- <Image.RenderTransform>
104
-
105
- <RotateTransform x:Name="rotateTransform2" />
106
-
107
- </Image.RenderTransform>
108
-
109
- </Image>
110
-
111
- </Border>
112
-
113
57
  </Grid>
114
-
115
58
  </Window>
116
-
117
59
  ```
118
60
 
119
-
120
-
121
- ```C#
61
+ ```cs
122
-
123
62
  using System.Windows;
124
63
 
125
-
126
-
127
64
  namespace Questions344215
128
-
129
65
  {
130
-
131
66
  public partial class MainWindow : Window
132
-
133
67
  {
134
-
135
68
  public MainWindow() => InitializeComponent();
136
69
 
137
-
138
-
139
70
  private void kaitennn(object sender, RoutedEventArgs e)
140
-
141
71
  => rotateTransform1.Angle += 90;
142
72
 
143
-
144
-
145
73
  private void kaitennnnn(object sender, RoutedEventArgs e)
146
-
147
74
  => rotateTransform2.Angle += 90;
148
-
149
75
  }
150
-
151
76
  }
152
-
153
77
  ```
154
78
 
155
-
156
-
157
79
  ![アプリ画像](a80116562ab19f50d2e999972b02d170.png)
158
-
159
80
  上は`LayoutTransform`での回転。レイアウトにも影響します。
160
-
161
81
  `Border`ごと回転しているわけではなく、`Image`の回転によって`Border`サイズが変わりました。
162
82
 
163
-
164
-
165
83
  下は`RenderTransform`での回転。レイアウトに影響しません。
166
-
167
84
  `Border`は`Image`が回っていることに気付かずそのまま。`Image`もはみ出たり重なったりします。
168
85
 
169
-
170
-
171
86
  問題がなければ`RenderTransform`のほうが軽いです。
172
-
173
87
  レイアウトが崩れて困った場合は、`LayoutTransform`を使用します。