teratail
回答率
85.47%
質問するログイン新規登録
トップVisual Studioに関する質問WPF XAML側のみでユーザーコントロールに異なる値をバインドしたい

編集履歴

回答編集履歴

1

要件整理のうえ、修正

2017/02/05 04:27

投稿

Tak1wa
Tak1wa

スコア4791

test CHANGED
@@ -2,9 +2,9 @@
2
2
 
3
3
 
4
4
 
5
- DataContextは子要素に引き継がれるので、バインドさせる場合が簡単です。
5
+ Textに色々な役割を持たせすぎてしまいますのでこれは好ましくありません。
6
6
 
7
- その場合はUserControlのTextではなくDataContextに設定するだけで、UserControl側の修正は不要です。
7
+ UserControl自体を別で作成するか、レイアウトを切り替えるプロパティを別途用意しましょう。
8
8
 
9
9
 
10
10
 
@@ -20,37 +20,123 @@
20
20
 
21
21
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
22
22
 
23
- xmlns:local="clr-namespace:WpfApp10"
23
+ xmlns:local="clr-namespace:VisualBasic.Wpf.Samples"
24
24
 
25
25
  mc:Ignorable="d"
26
26
 
27
- Title="MainWindow" Height="350" Width="525">
27
+ Title="MainWindow" Height="300" Width="300">
28
28
 
29
- <Grid>
29
+ <StackPanel Orientation="Horizontal">
30
30
 
31
- <local:UserControl1 DataContext="Control1"/>
31
+ <local:UserControl1 Text="Control1_A" LayoutType="Control1" />
32
32
 
33
- <local:UserControl1 DataContext="Control2"/>
33
+ <local:UserControl1 Text="Control1_B" LayoutType="Control1" />
34
34
 
35
+ <local:UserControl1 Text="Control2_A" LayoutType="Control2" />
36
+
37
+ <local:UserControl1 Text="Control1_C" LayoutType="Control1" />
38
+
35
- </Grid>
39
+ </StackPanel>
36
40
 
37
41
  </Window>
38
42
 
39
43
  ```
40
44
 
45
+ ```XML
41
46
 
47
+ <UserControl x:Class="UserControl1"
42
48
 
43
- ---
49
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
44
50
 
51
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
45
52
 
53
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
46
54
 
47
- XAML上で値を指定したい場合などは依存関係プロパティをUserControlに用意して、それを子要素がバインドする方法があります。
55
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
48
56
 
57
+ mc:Ignorable="d"
49
58
 
59
+ x:Name="uc"
50
60
 
61
+ d:DesignHeight="20" d:DesignWidth="50">
51
62
 
63
+ <Grid>
52
64
 
65
+ <ContentControl VerticalAlignment="Top" Width="100" Margin="10" VerticalContentAlignment="Center">
66
+
67
+ <ContentControl.Style>
68
+
69
+ <Style TargetType="ContentControl">
70
+
71
+ <Style.Triggers>
72
+
73
+ <!--2つのコントロールを区別する方法 → LayouType依存関係プロパティで切り替える例-->
74
+
75
+ <DataTrigger Binding="{Binding LayoutType, ElementName=uc}" Value="Control1">
76
+
77
+ <Setter Property="Template">
78
+
79
+ <Setter.Value>
80
+
81
+ <ControlTemplate>
82
+
83
+ <Border Background="#FF00A0E9" Height="40">
84
+
85
+ <TextBlock VerticalAlignment="Center" TextAlignment="Center"
86
+
87
+ Text="{Binding Text, ElementName=uc}"/>
88
+
89
+ </Border>
90
+
91
+ </ControlTemplate>
92
+
93
+ </Setter.Value>
94
+
95
+ </Setter>
96
+
97
+ </DataTrigger>
98
+
99
+ <DataTrigger Binding="{Binding LayoutType, ElementName=uc}" Value="Control2">
100
+
101
+ <Setter Property="Template">
102
+
103
+ <Setter.Value>
104
+
105
+ <ControlTemplate>
106
+
107
+ <Border Background="#FFEE7642" Height="20">
108
+
109
+ <TextBlock VerticalAlignment="Center"
110
+
111
+ TextAlignment="Center"
112
+
113
+ Text="{Binding Text, ElementName=uc}"/>
114
+
115
+ </Border>
116
+
117
+ </ControlTemplate>
118
+
119
+ </Setter.Value>
120
+
121
+ </Setter>
122
+
123
+ </DataTrigger>
124
+
125
+ </Style.Triggers>
126
+
127
+ </Style>
128
+
129
+ </ContentControl.Style>
130
+
131
+ </ContentControl>
132
+
133
+ </Grid>
134
+
135
+ </UserControl>
136
+
137
+ ```
138
+
53
- ```VB.NET
139
+ ```VB
54
140
 
55
141
  Public Class UserControl1
56
142
 
@@ -74,54 +160,26 @@
74
160
 
75
161
 
76
162
 
163
+ Public Property LayoutType() As String
164
+
165
+ Get
166
+
167
+ Return CType(Me.GetValue(LayoutTypeProperty), String)
168
+
169
+ End Get
170
+
171
+ Set(ByVal value As String)
172
+
173
+ Me.SetValue(LayoutTypeProperty, value)
174
+
175
+ End Set
176
+
177
+ End Property
178
+
179
+ Public Shared ReadOnly LayoutTypeProperty As DependencyProperty = DependencyProperty.Register("LayoutType", GetType(String), GetType(UserControl1), New PropertyMetadata(String.Empty))
180
+
181
+
182
+
77
183
  End Class
78
184
 
79
185
  ```
80
-
81
-
82
-
83
- ```XML
84
-
85
- <UserControl x:Class="UserControl1"
86
-
87
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
88
-
89
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
90
-
91
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
92
-
93
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
94
-
95
- x:Name="uc"
96
-
97
- mc:Ignorable="d"
98
-
99
- d:DesignHeight="300" d:DesignWidth="300">
100
-
101
- <Grid>
102
-
103
-
104
-
105
- <!--2つのコントロールを区別する方法-->
106
-
107
- <StackPanel Orientation="Vertical">
108
-
109
- <TextBlock Height="10" TextAlignment="Center" FontSize="7" Text="{Binding Text, ElementName=uc}"/>
110
-
111
- </StackPanel>
112
-
113
-
114
-
115
- <StackPanel Orientation="Vertical">
116
-
117
- <TextBlock Height="20" TextAlignment="Center" FontSize="10" Text="{Binding Text, ElementName=uc}"/>
118
-
119
- </StackPanel>
120
-
121
-
122
-
123
- </Grid>
124
-
125
- </UserControl>
126
-
127
- ```