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

回答編集履歴

1

見直しキャンペーン中

2023/07/29 06:58

投稿

TN8001
TN8001

スコア10108

answer CHANGED
@@ -1,65 +1,65 @@
1
- `StackPanel`はアイテムを並べていくコントロールです(デフォルトでは下に並んでいきます)
2
-
3
- `Hidden`ではそれぞれの位置は変わらずに表示だけ消えます。
4
- `Collapsed`にするとそのアイテムがなかったように詰められます。
5
-
6
- xamlをいじらないのであれば、VBコードの`Hidden`を`Collapsed`に変えてください。
7
- VBコードをいじらないのであれば、xamlの`StackPanel`を`Grid`に変えてください(`VerticalAlignment`等をいじる必要があるかもしれません)
8
-
9
- `StackPanel`や`Grid`の違いや特性は、レイアウトの基本ですのでしっかり確認しておいてください。
10
- [パネルの概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/panels-overview)
11
-
12
-
13
- ```xaml
14
- <Window
15
- x:Class="Questions363405.MainWindow"
16
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
17
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
18
- Width="800"
19
- Height="450">
20
- <Window.Resources>
21
- <BitmapImage x:Key="image1" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg" />
22
- <BitmapImage x:Key="image2" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u6/61616/KsOkZfql_thumbnail.jpg" />
23
- </Window.Resources>
24
- <Grid>
25
- <Grid.ColumnDefinitions>
26
- <ColumnDefinition />
27
- <ColumnDefinition />
28
- <ColumnDefinition />
29
- <ColumnDefinition />
30
- <ColumnDefinition />
31
- </Grid.ColumnDefinitions>
32
-
33
- <!-- StackPanelは(デフォルトでは)縦に並んでいる -->
34
- <StackPanel>
35
- <Image Source="{StaticResource image1}" />
36
- <Image Source="{StaticResource image2}" />
37
- </StackPanel>
38
-
39
- <!-- Hiddenは隙間が空く -->
40
- <StackPanel Grid.Column="1">
41
- <Image Source="{StaticResource image1}" Visibility="Hidden" />
42
- <Image Source="{StaticResource image2}" />
43
- </StackPanel>
44
-
45
- <!-- Collapsedは詰められる -->
46
- <StackPanel Grid.Column="2">
47
- <Image Source="{StaticResource image1}" Visibility="Collapsed" />
48
- <Image Source="{StaticResource image2}" />
49
- </StackPanel>
50
-
51
- <!-- Gridは何もしなければ重なる -->
52
- <Grid Grid.Column="3" VerticalAlignment="Top">
53
- <Image Source="{StaticResource image1}" />
54
- <Image Source="{StaticResource image2}" />
55
- </Grid>
56
-
57
- <!-- 重なっているのでHiddenでもよい(サイズが違う場合はHidden・Collapsedの意味が違うことに注意) -->
58
- <Grid Grid.Column="4" VerticalAlignment="Top">
59
- <Image Source="{StaticResource image1}" />
60
- <Image Source="{StaticResource image2}" Visibility="Hidden" />
61
- </Grid>
62
- </Grid>
63
- </Window>
64
- ```
1
+ `StackPanel`はアイテムを並べていくコントロールです(デフォルトでは下に並んでいきます)
2
+
3
+ `Hidden`ではそれぞれの位置は変わらずに表示だけ消えます。
4
+ `Collapsed`にするとそのアイテムがなかったように詰められます。
5
+
6
+ xamlをいじらないのであれば、VBコードの`Hidden`を`Collapsed`に変えてください。
7
+ VBコードをいじらないのであれば、xamlの`StackPanel`を`Grid`に変えてください(`VerticalAlignment`等をいじる必要があるかもしれません)
8
+
9
+ `StackPanel`や`Grid`の違いや特性は、レイアウトの基本ですのでしっかり確認しておいてください。
10
+ [パネルの概要 - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/panels-overview)
11
+
12
+
13
+ ```xml
14
+ <Window
15
+ x:Class="Questions363405.MainWindow"
16
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
17
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
18
+ Width="800"
19
+ Height="450">
20
+ <Window.Resources>
21
+ <BitmapImage x:Key="image1" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u13/132786/KnkDDC5A_thumbnail.jpg" />
22
+ <BitmapImage x:Key="image2" UriSource="https://teratail-v2.storage.googleapis.com/uploads/avatars/u6/61616/KsOkZfql_thumbnail.jpg" />
23
+ </Window.Resources>
24
+ <Grid>
25
+ <Grid.ColumnDefinitions>
26
+ <ColumnDefinition />
27
+ <ColumnDefinition />
28
+ <ColumnDefinition />
29
+ <ColumnDefinition />
30
+ <ColumnDefinition />
31
+ </Grid.ColumnDefinitions>
32
+
33
+ <!-- StackPanelは(デフォルトでは)縦に並んでいる -->
34
+ <StackPanel>
35
+ <Image Source="{StaticResource image1}" />
36
+ <Image Source="{StaticResource image2}" />
37
+ </StackPanel>
38
+
39
+ <!-- Hiddenは隙間が空く -->
40
+ <StackPanel Grid.Column="1">
41
+ <Image Source="{StaticResource image1}" Visibility="Hidden" />
42
+ <Image Source="{StaticResource image2}" />
43
+ </StackPanel>
44
+
45
+ <!-- Collapsedは詰められる -->
46
+ <StackPanel Grid.Column="2">
47
+ <Image Source="{StaticResource image1}" Visibility="Collapsed" />
48
+ <Image Source="{StaticResource image2}" />
49
+ </StackPanel>
50
+
51
+ <!-- Gridは何もしなければ重なる -->
52
+ <Grid Grid.Column="3" VerticalAlignment="Top">
53
+ <Image Source="{StaticResource image1}" />
54
+ <Image Source="{StaticResource image2}" />
55
+ </Grid>
56
+
57
+ <!-- 重なっているのでHiddenでもよい(サイズが違う場合はHidden・Collapsedの意味が違うことに注意) -->
58
+ <Grid Grid.Column="4" VerticalAlignment="Top">
59
+ <Image Source="{StaticResource image1}" />
60
+ <Image Source="{StaticResource image2}" Visibility="Hidden" />
61
+ </Grid>
62
+ </Grid>
63
+ </Window>
64
+ ```
65
65
  ![アプリ画像](ddc0a9236a290874274e46adc8576c57.png)