teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

見直しキャンペーン中

2023/07/27 15:32

投稿

TN8001
TN8001

スコア10108

answer CHANGED
@@ -1,87 +1,87 @@
1
- `RotateFlip`はWinFormsのメソッドですので、WPFでは(基本的には)使えません。
2
- [Image.RotateFlip(RotateFlipType) メソッド (System.Drawing) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.drawing.image.rotateflip)
3
-
4
- 読み込み時に適切に回したい場合は、こちらが参考になりそうです(動作確認はしていません)
5
- [C# WPF Exifの回転情報を取得して画像を表示する - Qiita](https://qiita.com/standard-software/items/6d111f73a1a8a075ed4c)
6
-
7
- ボタン操作等で自分で回したい場合は、`RotateTransform`がいいでしょう。
8
- [RotateTransform クラス (System.Windows.Media) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.media.rotatetransform)
9
-
10
- 回転以外にもいろいろできます。
11
- [変換の概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/graphics-multimedia/transforms-overview)
12
-
13
- ```xaml
14
- <Window
15
- x:Class="Questions344215.MainWindow"
16
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
17
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
18
- Width="300"
19
- Height="300">
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>
38
-
39
- <Border
40
- HorizontalAlignment="Center"
41
- VerticalAlignment="Bottom"
42
- BorderBrush="Black"
43
- BorderThickness="1">
44
- <Image
45
- Width="133"
46
- Height="95"
47
- MouseDown="kaitennnnn"
48
- RenderTransformOrigin="0.5,0.5"
49
- Source="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg"
50
- Stretch="Fill">
51
- <!-- こちらはレイアウトには影響せず見た目だけ回転 -->
52
- <Image.RenderTransform>
53
- <RotateTransform x:Name="rotateTransform2" />
54
- </Image.RenderTransform>
55
- </Image>
56
- </Border>
57
- </Grid>
58
- </Window>
59
- ```
60
-
61
- ```C#
62
- using System.Windows;
63
-
64
- namespace Questions344215
65
- {
66
- public partial class MainWindow : Window
67
- {
68
- public MainWindow() => InitializeComponent();
69
-
70
- private void kaitennn(object sender, RoutedEventArgs e)
71
- => rotateTransform1.Angle += 90;
72
-
73
- private void kaitennnnn(object sender, RoutedEventArgs e)
74
- => rotateTransform2.Angle += 90;
75
- }
76
- }
77
- ```
78
-
79
- ![アプリ画像](a80116562ab19f50d2e999972b02d170.png)
80
- 上は`LayoutTransform`での回転。レイアウトにも影響します。
81
- `Border`ごと回転しているわけではなく、`Image`の回転によって`Border`サイズが変わりました。
82
-
83
- 下は`RenderTransform`での回転。レイアウトに影響しません。
84
- `Border`は`Image`が回っていることに気付かずそのまま。`Image`もはみ出たり重なったりします。
85
-
86
- 問題がなければ`RenderTransform`のほうが軽いです。
1
+ `RotateFlip`はWinFormsのメソッドですので、WPFでは(基本的には)使えません。
2
+ [Image.RotateFlip(RotateFlipType) メソッド (System.Drawing) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.drawing.image.rotateflip)
3
+
4
+ 読み込み時に適切に回したい場合は、こちらが参考になりそうです(動作確認はしていません)
5
+ [C# WPF Exifの回転情報を取得して画像を表示する - Qiita](https://qiita.com/standard-software/items/6d111f73a1a8a075ed4c)
6
+
7
+ ボタン操作等で自分で回したい場合は、`RotateTransform`がいいでしょう。
8
+ [RotateTransform クラス (System.Windows.Media) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.media.rotatetransform)
9
+
10
+ 回転以外にもいろいろできます。
11
+ [変換の概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/graphics-multimedia/transforms-overview)
12
+
13
+ ```xml
14
+ <Window
15
+ x:Class="Questions344215.MainWindow"
16
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
17
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
18
+ Width="300"
19
+ Height="300">
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>
38
+
39
+ <Border
40
+ HorizontalAlignment="Center"
41
+ VerticalAlignment="Bottom"
42
+ BorderBrush="Black"
43
+ BorderThickness="1">
44
+ <Image
45
+ Width="133"
46
+ Height="95"
47
+ MouseDown="kaitennnnn"
48
+ RenderTransformOrigin="0.5,0.5"
49
+ Source="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg"
50
+ Stretch="Fill">
51
+ <!-- こちらはレイアウトには影響せず見た目だけ回転 -->
52
+ <Image.RenderTransform>
53
+ <RotateTransform x:Name="rotateTransform2" />
54
+ </Image.RenderTransform>
55
+ </Image>
56
+ </Border>
57
+ </Grid>
58
+ </Window>
59
+ ```
60
+
61
+ ```cs
62
+ using System.Windows;
63
+
64
+ namespace Questions344215
65
+ {
66
+ public partial class MainWindow : Window
67
+ {
68
+ public MainWindow() => InitializeComponent();
69
+
70
+ private void kaitennn(object sender, RoutedEventArgs e)
71
+ => rotateTransform1.Angle += 90;
72
+
73
+ private void kaitennnnn(object sender, RoutedEventArgs e)
74
+ => rotateTransform2.Angle += 90;
75
+ }
76
+ }
77
+ ```
78
+
79
+ ![アプリ画像](a80116562ab19f50d2e999972b02d170.png)
80
+ 上は`LayoutTransform`での回転。レイアウトにも影響します。
81
+ `Border`ごと回転しているわけではなく、`Image`の回転によって`Border`サイズが変わりました。
82
+
83
+ 下は`RenderTransform`での回転。レイアウトに影響しません。
84
+ `Border`は`Image`が回っていることに気付かずそのまま。`Image`もはみ出たり重なったりします。
85
+
86
+ 問題がなければ`RenderTransform`のほうが軽いです。
87
87
  レイアウトが崩れて困った場合は、`LayoutTransform`を使用します。