回答編集履歴

1

見直しキャンペーン中

2023/07/29 06:58

投稿

TN8001
TN8001

スコア9898

test CHANGED
@@ -1,129 +1,65 @@
1
1
  `StackPanel`はアイテムを並べていくコントロールです(デフォルトでは下に並んでいきます)
2
2
 
3
-
4
-
5
3
  `Hidden`ではそれぞれの位置は変わらずに表示だけ消えます。
6
-
7
4
  `Collapsed`にするとそのアイテムがなかったように詰められます。
8
5
 
9
-
10
-
11
6
  xamlをいじらないのであれば、VBコードの`Hidden`を`Collapsed`に変えてください。
12
-
13
7
  VBコードをいじらないのであれば、xamlの`StackPanel`を`Grid`に変えてください(`VerticalAlignment`等をいじる必要があるかもしれません)
14
8
 
15
-
16
-
17
9
  `StackPanel`や`Grid`の違いや特性は、レイアウトの基本ですのでしっかり確認しておいてください。
18
-
19
10
  [パネルの概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/panels-overview)
20
11
 
21
12
 
22
-
23
-
24
-
25
- ```xaml
13
+ ```xml
26
-
27
14
  <Window
28
-
29
15
  x:Class="Questions363405.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="800"
36
-
37
19
  Height="450">
38
-
39
20
  <Window.Resources>
40
-
41
21
  <BitmapImage x:Key="image1" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg" />
42
-
43
22
  <BitmapImage x:Key="image2" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u6/61616/KsOkZfql_thumbnail.jpg" />
44
-
45
23
  </Window.Resources>
46
-
47
24
  <Grid>
48
-
49
25
  <Grid.ColumnDefinitions>
50
-
51
26
  <ColumnDefinition />
52
-
53
27
  <ColumnDefinition />
54
-
55
28
  <ColumnDefinition />
56
-
57
29
  <ColumnDefinition />
58
-
59
30
  <ColumnDefinition />
60
-
61
31
  </Grid.ColumnDefinitions>
62
32
 
63
-
64
-
65
33
  <!-- StackPanelは(デフォルトでは)縦に並んでいる -->
66
-
67
34
  <StackPanel>
68
-
69
35
  <Image Source="{StaticResource image1}" />
70
-
71
36
  <Image Source="{StaticResource image2}" />
72
-
73
37
  </StackPanel>
74
38
 
75
-
76
-
77
39
  <!-- Hiddenは隙間が空く -->
78
-
79
40
  <StackPanel Grid.Column="1">
80
-
81
41
  <Image Source="{StaticResource image1}" Visibility="Hidden" />
82
-
83
42
  <Image Source="{StaticResource image2}" />
84
-
85
43
  </StackPanel>
86
44
 
87
-
88
-
89
45
  <!-- Collapsedは詰められる -->
90
-
91
46
  <StackPanel Grid.Column="2">
92
-
93
47
  <Image Source="{StaticResource image1}" Visibility="Collapsed" />
94
-
95
48
  <Image Source="{StaticResource image2}" />
96
-
97
49
  </StackPanel>
98
50
 
99
-
100
-
101
51
  <!-- Gridは何もしなければ重なる -->
102
-
103
52
  <Grid Grid.Column="3" VerticalAlignment="Top">
104
-
105
53
  <Image Source="{StaticResource image1}" />
106
-
107
54
  <Image Source="{StaticResource image2}" />
108
-
109
55
  </Grid>
110
56
 
111
-
112
-
113
57
  <!-- 重なっているのでHiddenでもよい(サイズが違う場合はHidden・Collapsedの意味が違うことに注意) -->
114
-
115
58
  <Grid Grid.Column="4" VerticalAlignment="Top">
116
-
117
59
  <Image Source="{StaticResource image1}" />
118
-
119
60
  <Image Source="{StaticResource image2}" Visibility="Hidden" />
120
-
121
61
  </Grid>
122
-
123
62
  </Grid>
124
-
125
63
  </Window>
126
-
127
64
  ```
128
-
129
65
  ![アプリ画像](ddc0a9236a290874274e46adc8576c57.png)