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

回答編集履歴

2

見直しキャンペーン中

2023/07/28 13:31

投稿

TN8001
TN8001

スコア10111

answer CHANGED
@@ -1,102 +1,102 @@
1
- horaihoraiさんのほうではすでに解決されていますが、第三者視点ではわかりにくいところもあるのでまとめさせていただきます。
2
-
3
- ```xaml
4
- <UserControl
5
- x:Class="Questions348249.Left"
6
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
7
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
8
- <StackPanel Name="Width">
9
- <Button Command="{Binding Command}" Content="Button" />
10
- <StackPanel Width="{Binding LeftWidth}">
11
- <Rectangle Height="30" Fill="Red" />
12
- </StackPanel>
13
- </StackPanel>
14
- </UserControl>
15
- ```
16
-
17
- ```xaml
18
- <UserControl
19
- x:Class="Questions348249.Right"
20
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
21
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
22
- <StackPanel Name="Width">
23
- <Button Command="{Binding LeftRight.Command}" Content="Button" />
24
- <StackPanel Width="{Binding LeftRight.RightWidth}">
25
- <Rectangle Height="30" Fill="Blue" />
26
- </StackPanel>
27
- </StackPanel>
28
- </UserControl>
29
- ```
30
-
31
- ```xaml
32
- <Window
33
- x:Class="Questions348249.MainWindow"
34
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
35
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
36
- xmlns:userControls="clr-namespace:Questions348249"
37
- Width="800"
38
- Height="450">
39
- <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
40
-
41
- <!-- こうしてもいいし -->
42
- <userControls:Left DataContext="{Binding LeftRight}" />
43
-
44
- <!-- こうするならRightで Width="{Binding LeftRight.RightWidth}" となる -->
45
- <userControls:Right />
46
- </StackPanel>
47
- </Window>
48
- ```
49
-
50
- ```C#
51
- using CommunityToolkit.Mvvm.ComponentModel;
52
- using CommunityToolkit.Mvvm.Input;
53
- using System.Windows;
54
- using System.Windows.Input;
55
-
56
- namespace Questions348249
57
- {
58
- class LeftRightViewModel : ObservableObject
59
- {
60
- public double LeftWidth { get => leftWidth; set => SetProperty(ref leftWidth, value); }
61
- private double leftWidth;
62
- public double RightWidth { get => rightWidth; set => SetProperty(ref rightWidth, value); }
63
- private double rightWidth;
64
- public ICommand Command { get; }
65
-
66
- public LeftRightViewModel()
67
- {
68
- Command = new RelayCommand(() =>
69
- {
70
- LeftWidth += 10;
71
- RightWidth += 5;
72
- });
73
- }
74
- }
75
-
76
- class MainViewModel
77
- {
78
- public LeftRightViewModel LeftRight { get; }
79
- = new LeftRightViewModel { LeftWidth = 100, RightWidth = 100, };
80
- }
81
-
82
- public partial class MainWindow : Window
83
- {
84
- public MainWindow()
85
- {
86
- InitializeComponent();
87
-
88
- // 「AllのDataContext(ViewModel)自体」 に設定した場合
89
- //DataContext = new LeftRightViewModel();
90
-
91
- // 「そのプロパティのひとつに設定」 した場合
92
- DataContext = new MainViewModel();
93
- }
94
- }
95
- }
96
- ```
97
-
98
-
99
- `INotifyPropertyChanged`・`ICommand`実装は↓を使用。
100
- [NuGet Gallery | CommunityToolkit.Mvvm 7.0.3](https://www.nuget.org/packages/CommunityToolkit.Mvvm/)
101
-
1
+ horaihoraiさんのほうではすでに解決されていますが、第三者視点ではわかりにくいところもあるのでまとめさせていただきます。
2
+
3
+ ```xml:Left.xaml
4
+ <UserControl
5
+ x:Class="Questions348249.Left"
6
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
7
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
8
+ <StackPanel Name="Width">
9
+ <Button Command="{Binding Command}" Content="Button" />
10
+ <StackPanel Width="{Binding LeftWidth}">
11
+ <Rectangle Height="30" Fill="Red" />
12
+ </StackPanel>
13
+ </StackPanel>
14
+ </UserControl>
15
+ ```
16
+
17
+ ```xml:Right.xaml
18
+ <UserControl
19
+ x:Class="Questions348249.Right"
20
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
21
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
22
+ <StackPanel Name="Width">
23
+ <Button Command="{Binding LeftRight.Command}" Content="Button" />
24
+ <StackPanel Width="{Binding LeftRight.RightWidth}">
25
+ <Rectangle Height="30" Fill="Blue" />
26
+ </StackPanel>
27
+ </StackPanel>
28
+ </UserControl>
29
+ ```
30
+
31
+ ```xml:MainWindow.xaml
32
+ <Window
33
+ x:Class="Questions348249.MainWindow"
34
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
35
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
36
+ xmlns:userControls="clr-namespace:Questions348249"
37
+ Width="800"
38
+ Height="450">
39
+ <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
40
+
41
+ <!-- こうしてもいいし -->
42
+ <userControls:Left DataContext="{Binding LeftRight}" />
43
+
44
+ <!-- こうするならRightで Width="{Binding LeftRight.RightWidth}" となる -->
45
+ <userControls:Right />
46
+ </StackPanel>
47
+ </Window>
48
+ ```
49
+
50
+ ```cs
51
+ using CommunityToolkit.Mvvm.ComponentModel;
52
+ using CommunityToolkit.Mvvm.Input;
53
+ using System.Windows;
54
+ using System.Windows.Input;
55
+
56
+ namespace Questions348249
57
+ {
58
+ class LeftRightViewModel : ObservableObject
59
+ {
60
+ public double LeftWidth { get => leftWidth; set => SetProperty(ref leftWidth, value); }
61
+ private double leftWidth;
62
+ public double RightWidth { get => rightWidth; set => SetProperty(ref rightWidth, value); }
63
+ private double rightWidth;
64
+ public ICommand Command { get; }
65
+
66
+ public LeftRightViewModel()
67
+ {
68
+ Command = new RelayCommand(() =>
69
+ {
70
+ LeftWidth += 10;
71
+ RightWidth += 5;
72
+ });
73
+ }
74
+ }
75
+
76
+ class MainViewModel
77
+ {
78
+ public LeftRightViewModel LeftRight { get; }
79
+ = new LeftRightViewModel { LeftWidth = 100, RightWidth = 100, };
80
+ }
81
+
82
+ public partial class MainWindow : Window
83
+ {
84
+ public MainWindow()
85
+ {
86
+ InitializeComponent();
87
+
88
+ // 「AllのDataContext(ViewModel)自体」 に設定した場合
89
+ //DataContext = new LeftRightViewModel();
90
+
91
+ // 「そのプロパティのひとつに設定」 した場合
92
+ DataContext = new MainViewModel();
93
+ }
94
+ }
95
+ }
96
+ ```
97
+
98
+
99
+ `INotifyPropertyChanged`・`ICommand`実装は↓を使用。
100
+ [NuGet Gallery | CommunityToolkit.Mvvm 7.0.3](https://www.nuget.org/packages/CommunityToolkit.Mvvm/)
101
+
102
102
  [Introduction to the MVVM Toolkit - Windows Community Toolkit | Microsoft Docs](https://docs.microsoft.com/ja-jp/windows/communitytoolkit/mvvm/introduction)

1

余計なStackPanel

2021/07/08 03:41

投稿

TN8001
TN8001

スコア10111

answer CHANGED
@@ -36,16 +36,13 @@
36
36
  xmlns:userControls="clr-namespace:Questions348249"
37
37
  Width="800"
38
38
  Height="450">
39
- <StackPanel>
39
+ <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
40
40
 
41
+ <!-- こうしてもいいし -->
41
- <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
42
+ <userControls:Left DataContext="{Binding LeftRight}" />
42
43
 
43
- <!-- こうしてもいいし -->
44
- <userControls:Left DataContext="{Binding LeftRight}" />
45
-
46
- <!-- こうするならRightで Width="{Binding LeftRight.RightWidth}" となる -->
44
+ <!-- こうするならRightで Width="{Binding LeftRight.RightWidth}" となる -->
47
- <userControls:Right />
45
+ <userControls:Right />
48
- </StackPanel>
49
46
  </StackPanel>
50
47
  </Window>
51
48
  ```