teratail
回答率
85.47%
質問するログイン新規登録
トップC#に関する質問GridSplitterを使用して変更したGridのサイズを取得したい

編集履歴

回答編集履歴

11

誤記とドキュメント構成を少し変えた

2021/08/19 14:23

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -12,7 +12,505 @@
12
12
 
13
13
 
14
14
 
15
+ Layout2Panel.xaml
16
+
17
+ ```xaml
18
+
19
+ <UserControl x:Class="WpfApp4.Layout2Panel"
20
+
21
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
22
+
23
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
24
+
25
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
26
+
27
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
28
+
29
+ xmlns:local="clr-namespace:WpfApp4"
30
+
31
+ mc:Ignorable="d"
32
+
33
+ d:DesignHeight="450" d:DesignWidth="800">
34
+
35
+ <UserControl.Resources>
36
+
37
+ <local:GridLengthConverter x:Key="gridLengthConverter" />
38
+
39
+ <local:MinusConverter x:Key="minusConverter" />
40
+
41
+ </UserControl.Resources>
42
+
43
+ <Grid x:Name="LayoutRoot">
44
+
45
+ <Grid.ColumnDefinitions>
46
+
47
+ <ColumnDefinition Width="{Binding Path=Panel1Width, Mode=TwoWay, Converter={StaticResource gridLengthConverter}}"
48
+
49
+ MaxWidth="{Binding ActualWidth, ElementName=LayoutRoot, Mode=OneWay, Converter={StaticResource minusConverter}}"/>
50
+
51
+ <ColumnDefinition Width="1"/>
52
+
53
+ <ColumnDefinition Width="*"/>
54
+
55
+ </Grid.ColumnDefinitions>
56
+
57
+ <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
58
+
59
+ <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
60
+
61
+ </Grid>
62
+
63
+ <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
64
+
65
+ <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
66
+
67
+ <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
68
+
69
+ </Grid>
70
+
71
+ </Grid>
72
+
73
+ </UserControl>
74
+
75
+ ```
76
+
77
+
78
+
79
+ Layout2Panel.xaml.cs
80
+
81
+ ```xaml
82
+
83
+ using System;
84
+
85
+ using System.Collections.Generic;
86
+
87
+ using System.ComponentModel;
88
+
89
+ using System.Linq;
90
+
91
+ using System.Runtime.CompilerServices;
92
+
93
+ using System.Text;
94
+
95
+ using System.Threading.Tasks;
96
+
97
+ using System.Windows;
98
+
99
+ using System.Windows.Controls;
100
+
101
+ using System.Windows.Data;
102
+
103
+ using System.Windows.Documents;
104
+
105
+ using System.Windows.Input;
106
+
107
+ using System.Windows.Media;
108
+
109
+ using System.Windows.Media.Imaging;
110
+
111
+ using System.Windows.Navigation;
112
+
113
+ using System.Windows.Shapes;
114
+
115
+
116
+
117
+ namespace WpfApp4
118
+
119
+ {
120
+
121
+ /// <summary>
122
+
123
+ /// Panel.xaml の相互作用ロジック
124
+
125
+ /// </summary>
126
+
127
+ public partial class Layout2Panel : UserControl
128
+
129
+ {
130
+
131
+ public Layout2Panel()
132
+
133
+ {
134
+
135
+ InitializeComponent();
136
+
137
+ }
138
+
139
+
140
+
141
+ public double Panel1Width
142
+
143
+ {
144
+
145
+ get => (double)GetValue(Panel1WidthProperty);
146
+
147
+ set => SetValue(Panel1WidthProperty, value);
148
+
149
+ }
150
+
151
+ public static readonly DependencyProperty Panel1WidthProperty =
152
+
153
+ DependencyProperty.Register(
154
+
155
+ "Panel1Width",
156
+
157
+ typeof(double),
158
+
159
+ typeof(Layout2Panel),
160
+
161
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
162
+
163
+
164
+
165
+ public double Panel2Width
166
+
167
+ {
168
+
169
+ get => (double)GetValue(Panel2WidthProperty);
170
+
171
+ set => SetValue(Panel2WidthProperty, value);
172
+
173
+ }
174
+
175
+ public static readonly DependencyProperty Panel2WidthProperty =
176
+
177
+ DependencyProperty.Register(
178
+
179
+ "Panel2Width",
180
+
181
+ typeof(double),
182
+
183
+ typeof(Layout2Panel),
184
+
185
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
186
+
187
+
188
+
189
+ private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
190
+
191
+ {
192
+
193
+ Panel1Width = Panel1.ActualWidth;
194
+
195
+ Panel2Width = Panel2.ActualWidth;
196
+
197
+ }
198
+
199
+ }
200
+
201
+ }
202
+
203
+ ```
204
+
205
+ MainWindow.xaml
206
+
207
+ ```xaml
208
+
209
+ <Window x:Class="WpfApp4.MainWindow"
210
+
211
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
212
+
213
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
214
+
215
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
216
+
217
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
218
+
219
+ xmlns:local="clr-namespace:WpfApp4"
220
+
221
+ mc:Ignorable="d"
222
+
223
+ d:DataContext="{d:DesignInstance local:Model}"
224
+
225
+ Title="MainWindow" Height="450" Width="800">
226
+
227
+ <Grid>
228
+
229
+ <Grid.RowDefinitions>
230
+
231
+ <RowDefinition Height="20"/>
232
+
233
+ <RowDefinition Height="*"/>
234
+
235
+ </Grid.RowDefinitions>
236
+
237
+ <StackPanel Grid.Row="0" Orientation="Horizontal">
238
+
239
+ <TextBlock Text="{Binding Panel1Width}"/>
240
+
241
+ <TextBlock Text="{Binding Panel2Width}"/>
242
+
243
+ </StackPanel>
244
+
245
+ <local:Layout2Panel Grid.Row="1" Panel1Width="{Binding Panel1Width}" Panel2Width="{Binding Panel2Width}"/>
246
+
247
+ </Grid>
248
+
249
+ </Window>
250
+
251
+ ```
252
+
253
+
254
+
255
+ MainWindow.xaml.cs
256
+
257
+ ```
258
+
259
+ using System;
260
+
261
+ using System.Collections.Generic;
262
+
263
+ using System.ComponentModel;
264
+
265
+ using System.Linq;
266
+
267
+ using System.Runtime.CompilerServices;
268
+
269
+ using System.Text;
270
+
271
+ using System.Threading.Tasks;
272
+
273
+ using System.Windows;
274
+
275
+ using System.Windows.Controls;
276
+
277
+ using System.Windows.Data;
278
+
279
+ using System.Windows.Documents;
280
+
281
+ using System.Windows.Input;
282
+
283
+ using System.Windows.Media;
284
+
285
+ using System.Windows.Media.Imaging;
286
+
287
+ using System.Windows.Navigation;
288
+
289
+ using System.Windows.Shapes;
290
+
291
+
292
+
293
+ namespace WpfApp4
294
+
295
+ {
296
+
297
+ /// <summary>
298
+
299
+ /// MainWindow.xaml の相互作用ロジック
300
+
301
+ /// </summary>
302
+
303
+ public partial class MainWindow : Window
304
+
305
+ {
306
+
307
+ public MainWindow()
308
+
309
+ {
310
+
311
+ InitializeComponent();
312
+
313
+ DataContext = new Model() { Panel1Width = 300, Panel2Width = 500 };
314
+
315
+ }
316
+
317
+ }
318
+
319
+
320
+
321
+
322
+
323
+ public class BindableBase : INotifyPropertyChanged
324
+
325
+ {
326
+
327
+ public event PropertyChangedEventHandler PropertyChanged;
328
+
329
+
330
+
331
+ protected virtual bool SetProperty<T>(ref T field, T value,
332
+
333
+ [CallerMemberName]string propertyName = null)
334
+
335
+ {
336
+
337
+ if (Equals(field, value)) { return false; }
338
+
339
+ field = value;
340
+
341
+ PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
342
+
343
+ return true;
344
+
345
+ }
346
+
347
+ }
348
+
349
+
350
+
351
+ public class Model : BindableBase
352
+
353
+ {
354
+
355
+ private double _panel1Width;
356
+
357
+
358
+
359
+ public double Panel1Width
360
+
361
+ {
362
+
363
+ get => _panel1Width;
364
+
365
+ set => SetProperty(ref _panel1Width, value);
366
+
367
+ }
368
+
369
+
370
+
371
+ private double _panel2Width;
372
+
373
+ public double Panel2Width
374
+
375
+ {
376
+
377
+ get => _panel2Width;
378
+
379
+ set => SetProperty(ref _panel2Width, value);
380
+
381
+ }
382
+
383
+ }
384
+
385
+ }
386
+
387
+ ```
388
+
389
+
390
+
391
+ GridLengthConveter.cs
392
+
393
+ ```cs
394
+
395
+ using System;
396
+
397
+ using System.Collections.Generic;
398
+
399
+ using System.Globalization;
400
+
401
+ using System.Linq;
402
+
403
+ using System.Text;
404
+
405
+ using System.Threading.Tasks;
406
+
407
+ using System.Windows;
408
+
409
+ using System.Windows.Data;
410
+
411
+
412
+
413
+ namespace WpfApp4
414
+
415
+ {
416
+
417
+ public class GridLengthConverter : IValueConverter
418
+
419
+ {
420
+
421
+ public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
422
+
423
+ {
424
+
425
+ double val = (double)value;
426
+
427
+ GridLength gridLength = new GridLength(val);
428
+
429
+
430
+
431
+ return gridLength;
432
+
433
+ }
434
+
435
+
436
+
437
+ public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
438
+
439
+ {
440
+
441
+ GridLength val = (GridLength)value;
442
+
443
+
444
+
445
+ return val.Value;
446
+
447
+ }
448
+
449
+ }
450
+
451
+ }
452
+
453
+ ```
454
+
455
+ MinusConverter.cs
456
+
457
+ ```cs
458
+
459
+ using System;
460
+
461
+ using System.Collections.Generic;
462
+
463
+ using System.Globalization;
464
+
465
+ using System.Linq;
466
+
467
+ using System.Text;
468
+
469
+ using System.Threading.Tasks;
470
+
471
+ using System.Windows.Data;
472
+
473
+
474
+
475
+ namespace WpfApp4
476
+
477
+ {
478
+
479
+ public class MinusConverter : IValueConverter
480
+
481
+ {
482
+
483
+ public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
484
+
485
+ {
486
+
487
+ return ((double)value) - 1.0;
488
+
489
+ }
490
+
491
+
492
+
493
+ public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
494
+
495
+ {
496
+
497
+ throw new NotImplementedException();
498
+
499
+ }
500
+
501
+ }
502
+
503
+ }
504
+
505
+
506
+
507
+ ```
508
+
509
+
510
+
511
+
512
+
15
- 片方の ColumnDefinition Width にバインディングする方法を選んでいます。
513
+ 片方の ColumnDefinition Width のみバインディングしています。
16
514
 
17
515
 
18
516
 
@@ -20,507 +518,17 @@
20
518
 
21
519
 
22
520
 
23
- Layout2Panel.xaml
24
-
25
- ```xaml
26
-
27
- <UserControl x:Class="WpfApp4.Layout2Panel"
28
-
29
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
30
-
31
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
32
-
33
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
34
-
35
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
36
-
37
- xmlns:local="clr-namespace:WpfApp4"
38
-
39
- mc:Ignorable="d"
40
-
41
- d:DesignHeight="450" d:DesignWidth="800">
42
-
43
- <UserControl.Resources>
44
-
45
- <local:GridLengthConverter x:Key="gridLengthConverter" />
46
-
47
- <local:MinusConverter x:Key="minusConverter" />
48
-
49
- </UserControl.Resources>
50
-
51
- <Grid x:Name="LayoutRoot">
52
-
53
- <Grid.ColumnDefinitions>
54
-
55
- <ColumnDefinition Width="{Binding Path=Panel1Width, Mode=TwoWay, Converter={StaticResource gridLengthConverter}}"
56
-
57
- MaxWidth="{Binding ActualWidth, ElementName=LayoutRoot, Mode=OneWay, Converter={StaticResource minusConverter}}"/>
58
-
59
- <ColumnDefinition Width="1"/>
60
-
61
- <ColumnDefinition Width="*"/>
62
-
63
- </Grid.ColumnDefinitions>
64
-
65
- <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
66
-
67
- <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
68
-
69
- </Grid>
70
-
71
- <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
72
-
73
- <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
74
-
75
- <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
76
-
77
- </Grid>
78
-
79
- </Grid>
80
-
81
- </UserControl>
82
-
83
- ```
84
-
85
-
86
-
87
- Layout2Panel.xaml.cs
88
-
89
- ```xaml
90
-
91
- using System;
92
-
93
- using System.Collections.Generic;
94
-
95
- using System.ComponentModel;
96
-
97
- using System.Linq;
98
-
99
- using System.Runtime.CompilerServices;
100
-
101
- using System.Text;
102
-
103
- using System.Threading.Tasks;
104
-
105
- using System.Windows;
106
-
107
- using System.Windows.Controls;
108
-
109
- using System.Windows.Data;
110
-
111
- using System.Windows.Documents;
112
-
113
- using System.Windows.Input;
114
-
115
- using System.Windows.Media;
116
-
117
- using System.Windows.Media.Imaging;
118
-
119
- using System.Windows.Navigation;
120
-
121
- using System.Windows.Shapes;
122
-
123
-
124
-
125
- namespace WpfApp4
126
-
127
- {
128
-
129
- /// <summary>
130
-
131
- /// Panel.xaml の相互作用ロジック
132
-
133
- /// </summary>
134
-
135
- public partial class Layout2Panel : UserControl
136
-
137
- {
138
-
139
- public Layout2Panel()
140
-
141
- {
142
-
143
- InitializeComponent();
144
-
145
- }
146
-
147
-
148
-
149
- public double Panel1Width
150
-
151
- {
152
-
153
- get => (double)GetValue(Panel1WidthProperty);
154
-
155
- set => SetValue(Panel1WidthProperty, value);
156
-
157
- }
158
-
159
- public static readonly DependencyProperty Panel1WidthProperty =
160
-
161
- DependencyProperty.Register(
162
-
163
- "Panel1Width",
164
-
165
- typeof(double),
166
-
167
- typeof(Layout2Panel),
168
-
169
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
170
-
171
-
172
-
173
- public double Panel2Width
174
-
175
- {
176
-
177
- get => (double)GetValue(Panel2WidthProperty);
178
-
179
- set => SetValue(Panel2WidthProperty, value);
180
-
181
- }
182
-
183
- public static readonly DependencyProperty Panel2WidthProperty =
184
-
185
- DependencyProperty.Register(
186
-
187
- "Panel2Width",
188
-
189
- typeof(double),
190
-
191
- typeof(Layout2Panel),
192
-
193
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
194
-
195
-
196
-
197
- private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
198
-
199
- {
200
-
201
- Panel1Width = Panel1.ActualWidth;
202
-
203
- Panel2Width = Panel2.ActualWidth;
204
-
205
- }
206
-
207
- }
208
-
209
- }
210
-
211
- ```
212
-
213
- MainWindow.xaml
214
-
215
- ```xaml
216
-
217
- <Window x:Class="WpfApp4.MainWindow"
218
-
219
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
220
-
221
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
222
-
223
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
224
-
225
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
226
-
227
- xmlns:local="clr-namespace:WpfApp4"
228
-
229
- mc:Ignorable="d"
230
-
231
- d:DataContext="{d:DesignInstance local:Model}"
232
-
233
- Title="MainWindow" Height="450" Width="800">
234
-
235
- <Grid>
236
-
237
- <Grid.RowDefinitions>
238
-
239
- <RowDefinition Height="20"/>
240
-
241
- <RowDefinition Height="*"/>
242
-
243
- </Grid.RowDefinitions>
244
-
245
- <StackPanel Grid.Row="0" Orientation="Horizontal">
246
-
247
- <TextBlock Text="{Binding Panel1Width}"/>
248
-
249
- <TextBlock Text="{Binding Panel2Width}"/>
250
-
251
- </StackPanel>
252
-
253
- <local:Layout2Panel Grid.Row="1" Panel1Width="{Binding Panel1Width}" Panel2Width="{Binding Panel2Width}"/>
254
-
255
- </Grid>
256
-
257
- </Window>
258
-
259
- ```
260
-
261
-
262
-
263
- MainWindow.xaml.cs
264
-
265
- ```
266
-
267
- using System;
268
-
269
- using System.Collections.Generic;
270
-
271
- using System.ComponentModel;
272
-
273
- using System.Linq;
274
-
275
- using System.Runtime.CompilerServices;
276
-
277
- using System.Text;
278
-
279
- using System.Threading.Tasks;
280
-
281
- using System.Windows;
282
-
283
- using System.Windows.Controls;
284
-
285
- using System.Windows.Data;
286
-
287
- using System.Windows.Documents;
288
-
289
- using System.Windows.Input;
290
-
291
- using System.Windows.Media;
292
-
293
- using System.Windows.Media.Imaging;
294
-
295
- using System.Windows.Navigation;
296
-
297
- using System.Windows.Shapes;
298
-
299
-
300
-
301
- namespace WpfApp4
302
-
303
- {
304
-
305
- /// <summary>
306
-
307
- /// MainWindow.xaml の相互作用ロジック
308
-
309
- /// </summary>
310
-
311
- public partial class MainWindow : Window
312
-
313
- {
314
-
315
- public MainWindow()
316
-
317
- {
318
-
319
- InitializeComponent();
320
-
321
- DataContext = new Model() { Panel1Width = 300, Panel2Width = 500 };
322
-
323
- }
324
-
325
- }
326
-
327
-
328
-
329
-
330
-
331
- public class BindableBase : INotifyPropertyChanged
332
-
333
- {
334
-
335
- public event PropertyChangedEventHandler PropertyChanged;
336
-
337
-
338
-
339
- protected virtual bool SetProperty<T>(ref T field, T value,
340
-
341
- [CallerMemberName]string propertyName = null)
342
-
343
- {
344
-
345
- if (Equals(field, value)) { return false; }
346
-
347
- field = value;
348
-
349
- PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
350
-
351
- return true;
352
-
353
- }
354
-
355
- }
356
-
357
-
358
-
359
- public class Model : BindableBase
360
-
361
- {
362
-
363
- private double _panel1Width;
364
-
365
-
366
-
367
- public double Panel1Width
368
-
369
- {
370
-
371
- get => _panel1Width;
372
-
373
- set => SetProperty(ref _panel1Width, value);
374
-
375
- }
376
-
377
-
378
-
379
- private double _panel2Width;
380
-
381
- public double Panel2Width
382
-
383
- {
384
-
385
- get => _panel2Width;
386
-
387
- set => SetProperty(ref _panel2Width, value);
388
-
389
- }
390
-
391
- }
392
-
393
- }
394
-
395
- ```
396
-
397
-
398
-
399
- GridLengthConveter.cs
400
-
401
- ```cs
402
-
403
- using System;
404
-
405
- using System.Collections.Generic;
406
-
407
- using System.Globalization;
408
-
409
- using System.Linq;
410
-
411
- using System.Text;
412
-
413
- using System.Threading.Tasks;
414
-
415
- using System.Windows;
416
-
417
- using System.Windows.Data;
418
-
419
-
420
-
421
- namespace WpfApp4
422
-
423
- {
424
-
425
- public class GridLengthConverter : IValueConverter
426
-
427
- {
428
-
429
- public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
430
-
431
- {
432
-
433
- double val = (double)value;
434
-
435
- GridLength gridLength = new GridLength(val);
436
-
437
-
438
-
439
- return gridLength;
440
-
441
- }
442
-
443
-
444
-
445
- public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
446
-
447
- {
448
-
449
- GridLength val = (GridLength)value;
450
-
451
-
452
-
453
- return val.Value;
454
-
455
- }
456
-
457
- }
458
-
459
- }
460
-
461
- ```
462
-
463
- MinusConverter.cs
464
-
465
- ```cs
466
-
467
- using System;
468
-
469
- using System.Collections.Generic;
470
-
471
- using System.Globalization;
472
-
473
- using System.Linq;
474
-
475
- using System.Text;
476
-
477
- using System.Threading.Tasks;
478
-
479
- using System.Windows.Data;
480
-
481
-
482
-
483
- namespace WpfApp4
484
-
485
- {
486
-
487
- public class MinusConverter : IValueConverter
488
-
489
- {
490
-
491
- public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
492
-
493
- {
494
-
495
- return ((double)value) - 1.0;
496
-
497
- }
498
-
499
-
500
-
501
- public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
502
-
503
- {
504
-
505
- throw new NotImplementedException();
506
-
507
- }
508
-
509
- }
510
-
511
- }
512
-
513
-
514
-
515
- ```
516
-
517
521
 
518
522
 
519
523
  Panel2 の ColumnDefinition Width はサイズを固定したくないのでスターにする必要がありますが、実際のピクセル値がほしい場合は Panel2 の Grid から ActualWidth を取得してこないと難しいのではないかと思います。
520
524
 
521
525
 
522
526
 
527
+ かといって Panel2 の ColumnDefinition Width に対して
528
+
523
- かといって Panel2 の ColumnDefinition Width に対して `AcualWidth="{Binding Panel2Width, Mode=OneWayToSource}"` のようなことは出来ませんから、SizeChanged イベント経由で変更しています。
529
+ `ActualWidth="{Binding Panel2Width, Mode=OneWayToSource}"`
530
+
531
+ のようなことは出来ませんから、SizeChanged イベント経由で変更しています。
524
532
 
525
533
 
526
534
 

10

書式を少しだけ変えた

2021/08/19 14:23

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -520,7 +520,7 @@
520
520
 
521
521
 
522
522
 
523
- かといって Panel2 の ColumnDefinition Width に対して ActualWidth="{Binding Panel2Width, Mode=OneWayToSource}" のようなことは出来ませんから、SizeChanged イベント経由で変更しています。
523
+ かといって Panel2 の ColumnDefinition Width に対して `AcualWidth="{Binding Panel2Width, Mode=OneWayToSource}"` のようなことは出来ませんから、SizeChanged イベント経由で変更しています。
524
524
 
525
525
 
526
526
 

9

文章の修正

2021/08/19 14:21

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -1,18 +1,22 @@
1
- ~~Grid にバインディングするのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存関係プロパティに値をセットしてあげればよいと思います。~~
2
-
3
-
4
-
5
1
  TN8001 さんから頂いたコメントで復元について考慮されていないことに気づいたので改めて手を加えました。
6
2
 
7
- （以前のソースコードについては本文から削除しています。必要があれば変更履歴で追って頂ければと思います）
3
+ （以前のソースコードについては本文から削除しています。そこまで大きな変更がある訳ではありませんが、必要があれば変更履歴で追って頂ければと思います）
4
+
5
+
6
+
8
-
7
+ ---
8
+
9
+
10
+
9
-
11
+ Grid にバインディングするのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存関係プロパティに値をセットしてあげればよいと思います。
10
-
12
+
13
+
14
+
11
- tuyudaku さんのコメントと同じように ColumnDefinition Width にバインディングしています。
15
+ 片方の ColumnDefinition Width にバインディングする方法を選んでいます。
12
-
16
+
17
+
18
+
13
- Panel1Width と Panel2Width は両方とも実際のピクセル値がほしい認識なので、double で持ちバインディングする際は GridLength に変換するコンバータを挟んでいます。
19
+ Panel1Width と Panel2Width は両方とも実際のピクセル値がほしい認識なので、double に統一しています。なので Panel1Width をバインディングする際は GridLength に変換するコンバータを挟んでいます。もちろん要件次第では GridLength をそのまま Binding しても問題ないかと思います。
14
-
15
- もちろん GridLength をそのまま Binding しても問題ないかと思います。
16
20
 
17
21
 
18
22
 
@@ -516,7 +520,11 @@
516
520
 
517
521
 
518
522
 
523
+ かといって Panel2 の ColumnDefinition Width に対して ActualWidth="{Binding Panel2Width, Mode=OneWayToSource}" のようなことは出来ませんから、SizeChanged イベント経由で変更しています。
524
+
525
+
526
+
519
- また GridSplitter は右側にはみ出すことができるため、Panel1 の ColumnDefinition には MaxWidth の設定が必要です。
527
+ また、GridSplitter は対策なしだと右側にはみ出せるため、Panel1 の ColumnDefinition には MaxWidth の設定が必要です。
520
528
 
521
529
  Panel1 の ColumnDefinition Width から GridSplitter の Width を引くために適当な Converter を作っています。
522
530
 
@@ -528,4 +536,4 @@
528
536
 
529
537
 
530
538
 
531
- ファイルIOに関しては本題ではない認識なので実装を割愛しています。実際は設計にもよると思いますが、MVVM で製作しているならば Model で保存、読み込みの処理を行い、掲示した自分のコードの場合は Model.Panel1Width に初期値として渡してあげれば良いかと思います。
539
+ ファイルIO周りに関しては本題ではない認識なので実装を割愛しています。実際は設計にもよると思いますが、MVVM で製作しているならば Model で保存、読み込みの処理を行い、掲示した自分のコードのようなケースであれば Model.Panel1Width に初期値を渡してあげれば良いかと思います。

8

文章の修正

2021/08/19 14:20

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -12,6 +12,8 @@
12
12
 
13
13
  Panel1Width と Panel2Width は両方とも実際のピクセル値がほしい認識なので、double で持ちバインディングする際は GridLength に変換するコンバータを挟んでいます。
14
14
 
15
+ もちろん GridLength をそのまま Binding しても問題ないかと思います。
16
+
15
17
 
16
18
 
17
19
  Layout2Panel.xaml

7

文章の修正

2021/08/19 13:53

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -10,6 +10,8 @@
10
10
 
11
11
  tuyudaku さんのコメントと同じように ColumnDefinition Width にバインディングしています。
12
12
 
13
+ Panel1Width と Panel2Width は両方とも実際のピクセル値がほしい認識なので、double で持ちバインディングする際は GridLength に変換するコンバータを挟んでいます。
14
+
13
15
 
14
16
 
15
17
  Layout2Panel.xaml

6

画像追加

2021/08/19 13:51

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -520,4 +520,8 @@
520
520
 
521
521
 
522
522
 
523
+ ![イメージ](3cbe37e5f4761b0082a22cc0acb10698.gif)
524
+
525
+
526
+
523
527
  ファイルIOに関しては本題ではない認識なので実装を割愛しています。実際は設計にもよると思いますが、MVVM で製作しているならば Model で保存、読み込みの処理を行い、掲示した自分のコードの場合は Model.Panel1Width に初期値として渡してあげれば良いかと思います。

5

コメントの反映＆コード修正＆追記

2021/08/19 13:47

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -1,4 +1,14 @@
1
- Grid に Binding するのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存関係プロパティに値をセットしてあげればよいと思います。
1
+ ~~Grid にバインディングするのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存関係プロパティに値をセットしてあげればよいと思います。~~
2
+
3
+
4
+
5
+ TN8001 さんから頂いたコメントで復元について考慮されていないことに気づいたので改めて手を加えました。
6
+
7
+ （以前のソースコードについては本文から削除しています。必要があれば変更履歴で追って頂ければと思います）
8
+
9
+
10
+
11
+ tuyudaku さんのコメントと同じように ColumnDefinition Width にバインディングしています。
2
12
 
3
13
 
4
14
 
@@ -22,43 +32,363 @@
22
32
 
23
33
  d:DesignHeight="450" d:DesignWidth="800">
24
34
 
35
+ <UserControl.Resources>
36
+
37
+ <local:GridLengthConverter x:Key="gridLengthConverter" />
38
+
39
+ <local:MinusConverter x:Key="minusConverter" />
40
+
41
+ </UserControl.Resources>
42
+
43
+ <Grid x:Name="LayoutRoot">
44
+
45
+ <Grid.ColumnDefinitions>
46
+
47
+ <ColumnDefinition Width="{Binding Path=Panel1Width, Mode=TwoWay, Converter={StaticResource gridLengthConverter}}"
48
+
49
+ MaxWidth="{Binding ActualWidth, ElementName=LayoutRoot, Mode=OneWay, Converter={StaticResource minusConverter}}"/>
50
+
51
+ <ColumnDefinition Width="1"/>
52
+
53
+ <ColumnDefinition Width="*"/>
54
+
55
+ </Grid.ColumnDefinitions>
56
+
57
+ <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
58
+
59
+ <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
60
+
61
+ </Grid>
62
+
63
+ <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
64
+
65
+ <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
66
+
67
+ <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
68
+
69
+ </Grid>
70
+
71
+ </Grid>
72
+
73
+ </UserControl>
74
+
75
+ ```
76
+
77
+
78
+
79
+ Layout2Panel.xaml.cs
80
+
81
+ ```xaml
82
+
83
+ using System;
84
+
85
+ using System.Collections.Generic;
86
+
87
+ using System.ComponentModel;
88
+
89
+ using System.Linq;
90
+
91
+ using System.Runtime.CompilerServices;
92
+
93
+ using System.Text;
94
+
95
+ using System.Threading.Tasks;
96
+
97
+ using System.Windows;
98
+
99
+ using System.Windows.Controls;
100
+
101
+ using System.Windows.Data;
102
+
103
+ using System.Windows.Documents;
104
+
105
+ using System.Windows.Input;
106
+
107
+ using System.Windows.Media;
108
+
109
+ using System.Windows.Media.Imaging;
110
+
111
+ using System.Windows.Navigation;
112
+
113
+ using System.Windows.Shapes;
114
+
115
+
116
+
117
+ namespace WpfApp4
118
+
119
+ {
120
+
121
+ /// <summary>
122
+
123
+ /// Panel.xaml の相互作用ロジック
124
+
125
+ /// </summary>
126
+
127
+ public partial class Layout2Panel : UserControl
128
+
129
+ {
130
+
131
+ public Layout2Panel()
132
+
133
+ {
134
+
135
+ InitializeComponent();
136
+
137
+ }
138
+
139
+
140
+
141
+ public double Panel1Width
142
+
143
+ {
144
+
145
+ get => (double)GetValue(Panel1WidthProperty);
146
+
147
+ set => SetValue(Panel1WidthProperty, value);
148
+
149
+ }
150
+
151
+ public static readonly DependencyProperty Panel1WidthProperty =
152
+
153
+ DependencyProperty.Register(
154
+
155
+ "Panel1Width",
156
+
157
+ typeof(double),
158
+
159
+ typeof(Layout2Panel),
160
+
161
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
162
+
163
+
164
+
165
+ public double Panel2Width
166
+
167
+ {
168
+
169
+ get => (double)GetValue(Panel2WidthProperty);
170
+
171
+ set => SetValue(Panel2WidthProperty, value);
172
+
173
+ }
174
+
175
+ public static readonly DependencyProperty Panel2WidthProperty =
176
+
177
+ DependencyProperty.Register(
178
+
179
+ "Panel2Width",
180
+
181
+ typeof(double),
182
+
183
+ typeof(Layout2Panel),
184
+
185
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
186
+
187
+
188
+
189
+ private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
190
+
191
+ {
192
+
193
+ Panel1Width = Panel1.ActualWidth;
194
+
195
+ Panel2Width = Panel2.ActualWidth;
196
+
197
+ }
198
+
199
+ }
200
+
201
+ }
202
+
203
+ ```
204
+
205
+ MainWindow.xaml
206
+
207
+ ```xaml
208
+
209
+ <Window x:Class="WpfApp4.MainWindow"
210
+
211
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
212
+
213
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
214
+
215
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
216
+
217
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
218
+
219
+ xmlns:local="clr-namespace:WpfApp4"
220
+
221
+ mc:Ignorable="d"
222
+
223
+ d:DataContext="{d:DesignInstance local:Model}"
224
+
225
+ Title="MainWindow" Height="450" Width="800">
226
+
25
227
  <Grid>
26
228
 
27
- <Grid.ColumnDefinitions>
229
+ <Grid.RowDefinitions>
230
+
28
-
231
+ <RowDefinition Height="20"/>
232
+
29
- <ColumnDefinition Width="*"/>
233
+ <RowDefinition Height="*"/>
30
-
31
- <ColumnDefinition Width="1"/>
234
+
32
-
33
- <ColumnDefinition Width="*"/>
34
-
35
- </Grid.ColumnDefinitions>
235
+ </Grid.RowDefinitions>
36
-
236
+
37
- <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
237
+ <StackPanel Grid.Row="0" Orientation="Horizontal">
38
-
238
+
39
- <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
239
+ <TextBlock Text="{Binding Panel1Width}"/>
240
+
40
-
241
+ <TextBlock Text="{Binding Panel2Width}"/>
242
+
41
- </Grid>
243
+ </StackPanel>
42
-
244
+
43
- <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
245
+ <local:Layout2Panel Grid.Row="1" Panel1Width="{Binding Panel1Width}" Panel2Width="{Binding Panel2Width}"/>
44
-
45
- <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
46
-
47
- <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
48
-
49
- </Grid>
50
246
 
51
247
  </Grid>
52
248
 
53
- </UserControl>
249
+ </Window>
54
-
55
-
56
-
250
+
57
- ```
251
+ ```
58
-
59
-
60
-
252
+
253
+
254
+
61
- Layout2Panel.xaml.cs
255
+ MainWindow.xaml.cs
256
+
257
+ ```
258
+
259
+ using System;
260
+
261
+ using System.Collections.Generic;
262
+
263
+ using System.ComponentModel;
264
+
265
+ using System.Linq;
266
+
267
+ using System.Runtime.CompilerServices;
268
+
269
+ using System.Text;
270
+
271
+ using System.Threading.Tasks;
272
+
273
+ using System.Windows;
274
+
275
+ using System.Windows.Controls;
276
+
277
+ using System.Windows.Data;
278
+
279
+ using System.Windows.Documents;
280
+
281
+ using System.Windows.Input;
282
+
283
+ using System.Windows.Media;
284
+
285
+ using System.Windows.Media.Imaging;
286
+
287
+ using System.Windows.Navigation;
288
+
289
+ using System.Windows.Shapes;
290
+
291
+
292
+
293
+ namespace WpfApp4
294
+
295
+ {
296
+
297
+ /// <summary>
298
+
299
+ /// MainWindow.xaml の相互作用ロジック
300
+
301
+ /// </summary>
302
+
303
+ public partial class MainWindow : Window
304
+
305
+ {
306
+
307
+ public MainWindow()
308
+
309
+ {
310
+
311
+ InitializeComponent();
312
+
313
+ DataContext = new Model() { Panel1Width = 300, Panel2Width = 500 };
314
+
315
+ }
316
+
317
+ }
318
+
319
+
320
+
321
+
322
+
323
+ public class BindableBase : INotifyPropertyChanged
324
+
325
+ {
326
+
327
+ public event PropertyChangedEventHandler PropertyChanged;
328
+
329
+
330
+
331
+ protected virtual bool SetProperty<T>(ref T field, T value,
332
+
333
+ [CallerMemberName]string propertyName = null)
334
+
335
+ {
336
+
337
+ if (Equals(field, value)) { return false; }
338
+
339
+ field = value;
340
+
341
+ PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
342
+
343
+ return true;
344
+
345
+ }
346
+
347
+ }
348
+
349
+
350
+
351
+ public class Model : BindableBase
352
+
353
+ {
354
+
355
+ private double _panel1Width;
356
+
357
+
358
+
359
+ public double Panel1Width
360
+
361
+ {
362
+
363
+ get => _panel1Width;
364
+
365
+ set => SetProperty(ref _panel1Width, value);
366
+
367
+ }
368
+
369
+
370
+
371
+ private double _panel2Width;
372
+
373
+ public double Panel2Width
374
+
375
+ {
376
+
377
+ get => _panel2Width;
378
+
379
+ set => SetProperty(ref _panel2Width, value);
380
+
381
+ }
382
+
383
+ }
384
+
385
+ }
386
+
387
+ ```
388
+
389
+
390
+
391
+ GridLengthConveter.cs
62
392
 
63
393
  ```cs
64
394
 
@@ -66,115 +396,53 @@
66
396
 
67
397
  using System.Collections.Generic;
68
398
 
69
- using System.ComponentModel;
399
+ using System.Globalization;
70
400
 
71
401
  using System.Linq;
72
402
 
73
- using System.Runtime.CompilerServices;
74
-
75
403
  using System.Text;
76
404
 
77
405
  using System.Threading.Tasks;
78
406
 
79
407
  using System.Windows;
80
408
 
81
- using System.Windows.Controls;
82
-
83
409
  using System.Windows.Data;
84
410
 
85
- using System.Windows.Documents;
86
-
87
- using System.Windows.Input;
88
-
89
- using System.Windows.Media;
90
-
91
- using System.Windows.Media.Imaging;
92
-
93
- using System.Windows.Navigation;
94
-
95
- using System.Windows.Shapes;
96
-
97
411
 
98
412
 
99
413
  namespace WpfApp4
100
414
 
101
415
  {
102
416
 
103
- /// <summary>
104
-
105
- /// Panel.xaml の相互作用ロジック
106
-
107
- /// </summary>
108
-
109
- public partial class Layout2Panel : UserControl
417
+ public class GridLengthConverter : IValueConverter
110
418
 
111
419
  {
112
420
 
113
- public Layout2Panel()
421
+ public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
114
-
422
+
115
- {
423
+ {
424
+
116
-
425
+ double val = (double)value;
426
+
427
+ GridLength gridLength = new GridLength(val);
428
+
429
+
430
+
117
- InitializeComponent();
431
+ return gridLength;
118
-
432
+
119
- }
433
+ }
120
-
121
-
122
-
434
+
435
+
436
+
123
- public double Panel1Width
437
+ public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
124
-
438
+
125
- {
439
+ {
126
-
127
- get => (double)GetValue(Panel1WidthProperty);
440
+
128
-
129
- set => SetValue(Panel1WidthProperty, value);
441
+ GridLength val = (GridLength)value;
130
-
131
- }
442
+
132
-
133
- public static readonly DependencyProperty Panel1WidthProperty =
443
+
134
-
135
- DependencyProperty.Register(
444
+
136
-
137
- "Panel1Width",
138
-
139
- typeof(double),
445
+ return val.Value;
140
-
141
- typeof(Layout2Panel),
142
-
143
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
144
-
145
-
146
-
147
- public double Panel2Width
148
-
149
- {
150
-
151
- get => (double)GetValue(Panel2WidthProperty);
152
-
153
- set => SetValue(Panel2WidthProperty, value);
154
-
155
- }
156
-
157
- public static readonly DependencyProperty Panel2WidthProperty =
158
-
159
- DependencyProperty.Register(
160
-
161
- "Panel2Width",
162
-
163
- typeof(double),
164
-
165
- typeof(Layout2Panel),
166
-
167
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
168
-
169
-
170
-
171
- private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
172
-
173
- {
174
-
175
- Panel1Width = Panel1.ActualWidth;
176
-
177
- Panel2Width = Panel2.ActualWidth;
178
446
 
179
447
  }
180
448
 
@@ -184,59 +452,7 @@
184
452
 
185
453
  ```
186
454
 
187
-
188
-
189
- MainWindow.xaml
190
-
191
- ```xaml
192
-
193
- <Window x:Class="WpfApp4.MainWindow"
194
-
195
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
196
-
197
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
198
-
199
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
200
-
201
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
202
-
203
- xmlns:local="clr-namespace:WpfApp4"
204
-
205
- mc:Ignorable="d"
206
-
207
- d:DataContext="{d:DesignInstance local:ViewModel}"
208
-
209
- Title="MainWindow" Height="450" Width="800">
210
-
211
- <Grid>
212
-
213
- <Grid.RowDefinitions>
214
-
215
- <RowDefinition Height="20"/>
216
-
217
- <RowDefinition Height="*"/>
218
-
219
- </Grid.RowDefinitions>
220
-
221
- <StackPanel Grid.Row="0" Orientation="Horizontal">
222
-
223
- <TextBlock Text="{Binding Panel1Width}"/>
224
-
225
- <TextBlock Text="{Binding Panel2Width}"/>
226
-
227
- </StackPanel>
228
-
229
- <local:Layout2Panel Grid.Row="1" Panel1Width="{Binding Panel1Width}" Panel2Width="{Binding Panel2Width}"/>
230
-
231
- </Grid>
232
-
233
- </Window>
234
-
235
- ```
236
-
237
-
238
-
239
- MainWindow.xaml.cs
455
+ MinusConverter.cs
240
456
 
241
457
  ```cs
242
458
 
@@ -244,128 +460,46 @@
244
460
 
245
461
  using System.Collections.Generic;
246
462
 
247
- using System.ComponentModel;
463
+ using System.Globalization;
248
464
 
249
465
  using System.Linq;
250
466
 
251
- using System.Runtime.CompilerServices;
252
-
253
467
  using System.Text;
254
468
 
255
469
  using System.Threading.Tasks;
256
470
 
257
- using System.Windows;
258
-
259
- using System.Windows.Controls;
260
-
261
471
  using System.Windows.Data;
262
472
 
263
- using System.Windows.Documents;
264
-
265
- using System.Windows.Input;
266
-
267
- using System.Windows.Media;
268
-
269
- using System.Windows.Media.Imaging;
270
-
271
- using System.Windows.Navigation;
272
-
273
- using System.Windows.Shapes;
274
-
275
473
 
276
474
 
277
475
  namespace WpfApp4
278
476
 
279
477
  {
280
478
 
281
- /// <summary>
282
-
283
- /// MainWindow.xaml の相互作用ロジック
284
-
285
- /// </summary>
286
-
287
- public partial class MainWindow : Window
479
+ public class MinusConverter : IValueConverter
288
480
 
289
481
  {
290
482
 
291
- public MainWindow()
483
+ public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
292
-
484
+
293
- {
485
+ {
294
-
486
+
295
- InitializeComponent();
487
+ return ((double)value) - 1.0;
488
+
296
-
489
+ }
490
+
491
+
492
+
493
+ public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
494
+
495
+ {
496
+
297
- DataContext = new ViewModel();
497
+ throw new NotImplementedException();
298
498
 
299
499
  }
300
500
 
301
501
  }
302
502
 
303
-
304
-
305
-
306
-
307
- public class BindableBase : INotifyPropertyChanged
308
-
309
- {
310
-
311
- public event PropertyChangedEventHandler PropertyChanged;
312
-
313
-
314
-
315
- protected virtual bool SetProperty<T>(ref T field, T value,
316
-
317
- [CallerMemberName]string propertyName = null)
318
-
319
- {
320
-
321
- if (Equals(field, value)) { return false; }
322
-
323
- field = value;
324
-
325
- PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
326
-
327
- return true;
328
-
329
- }
330
-
331
- }
332
-
333
-
334
-
335
- public class ViewModel : BindableBase
336
-
337
- {
338
-
339
- private double _panel1Width;
340
-
341
-
342
-
343
- public double Panel1Width
344
-
345
- {
346
-
347
- get => _panel1Width;
348
-
349
- set => SetProperty(ref _panel1Width, value);
350
-
351
- }
352
-
353
-
354
-
355
- private double _panel2Width;
356
-
357
- public double Panel2Width
358
-
359
- {
360
-
361
- get => _panel2Width;
362
-
363
- set => SetProperty(ref _panel2Width, value);
364
-
365
- }
366
-
367
- }
368
-
369
503
  }
370
504
 
371
505
 
@@ -374,4 +508,16 @@
374
508
 
375
509
 
376
510
 
511
+ Panel2 の ColumnDefinition Width はサイズを固定したくないのでスターにする必要がありますが、実際のピクセル値がほしい場合は Panel2 の Grid から ActualWidth を取得してこないと難しいのではないかと思います。
512
+
513
+
514
+
515
+ また GridSplitter は右側にはみ出すことができるため、Panel1 の ColumnDefinition には MaxWidth の設定が必要です。
516
+
377
- Layout2Panel の Panel1Width, Panel2Width がイベントにより書き換わることで、データソースが反映されていく様子を MainWindow の UI 上から確認することができます。
517
+ Panel1 の ColumnDefinition Width から GridSplitter の Width を引くために適当な Converter を作っています。
518
+
519
+ [WPFのGridSplitterでピクセル指定の時に画面外までサイズ変更できなくする](https://blog.okazuki.jp/entry/2016/01/08/205031)
520
+
521
+
522
+
523
+ ファイルIOに関しては本題ではない認識なので実装を割愛しています。実際は設計にもよると思いますが、MVVM で製作しているならば Model で保存、読み込みの処理を行い、掲示した自分のコードの場合は Model.Panel1Width に初期値として渡してあげれば良いかと思います。

4

文章の修正

2021/08/19 13:41

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -374,4 +374,4 @@
374
374
 
375
375
 
376
376
 
377
- Layout2Panel の Panel1Width, Panel2Width がイベントにより書き換わることで、MainWindow から データソースへ反映されていく様子を確認することができます。
377
+ Layout2Panel の Panel1Width, Panel2Width がイベントにより書き換わることで、データソースが反映されていく様子を MainWindow の UI 上から確認することができます。

3

ポイントとなるソースが上にくるようにした

2021/08/19 10:02

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -2,6 +2,190 @@
2
2
 
3
3
 
4
4
 
5
+ Layout2Panel.xaml
6
+
7
+ ```xaml
8
+
9
+ <UserControl x:Class="WpfApp4.Layout2Panel"
10
+
11
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
12
+
13
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
14
+
15
+ xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
16
+
17
+ xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
18
+
19
+ xmlns:local="clr-namespace:WpfApp4"
20
+
21
+ mc:Ignorable="d"
22
+
23
+ d:DesignHeight="450" d:DesignWidth="800">
24
+
25
+ <Grid>
26
+
27
+ <Grid.ColumnDefinitions>
28
+
29
+ <ColumnDefinition Width="*"/>
30
+
31
+ <ColumnDefinition Width="1"/>
32
+
33
+ <ColumnDefinition Width="*"/>
34
+
35
+ </Grid.ColumnDefinitions>
36
+
37
+ <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
38
+
39
+ <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
40
+
41
+ </Grid>
42
+
43
+ <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
44
+
45
+ <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
46
+
47
+ <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
48
+
49
+ </Grid>
50
+
51
+ </Grid>
52
+
53
+ </UserControl>
54
+
55
+
56
+
57
+ ```
58
+
59
+
60
+
61
+ Layout2Panel.xaml.cs
62
+
63
+ ```cs
64
+
65
+ using System;
66
+
67
+ using System.Collections.Generic;
68
+
69
+ using System.ComponentModel;
70
+
71
+ using System.Linq;
72
+
73
+ using System.Runtime.CompilerServices;
74
+
75
+ using System.Text;
76
+
77
+ using System.Threading.Tasks;
78
+
79
+ using System.Windows;
80
+
81
+ using System.Windows.Controls;
82
+
83
+ using System.Windows.Data;
84
+
85
+ using System.Windows.Documents;
86
+
87
+ using System.Windows.Input;
88
+
89
+ using System.Windows.Media;
90
+
91
+ using System.Windows.Media.Imaging;
92
+
93
+ using System.Windows.Navigation;
94
+
95
+ using System.Windows.Shapes;
96
+
97
+
98
+
99
+ namespace WpfApp4
100
+
101
+ {
102
+
103
+ /// <summary>
104
+
105
+ /// Panel.xaml の相互作用ロジック
106
+
107
+ /// </summary>
108
+
109
+ public partial class Layout2Panel : UserControl
110
+
111
+ {
112
+
113
+ public Layout2Panel()
114
+
115
+ {
116
+
117
+ InitializeComponent();
118
+
119
+ }
120
+
121
+
122
+
123
+ public double Panel1Width
124
+
125
+ {
126
+
127
+ get => (double)GetValue(Panel1WidthProperty);
128
+
129
+ set => SetValue(Panel1WidthProperty, value);
130
+
131
+ }
132
+
133
+ public static readonly DependencyProperty Panel1WidthProperty =
134
+
135
+ DependencyProperty.Register(
136
+
137
+ "Panel1Width",
138
+
139
+ typeof(double),
140
+
141
+ typeof(Layout2Panel),
142
+
143
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
144
+
145
+
146
+
147
+ public double Panel2Width
148
+
149
+ {
150
+
151
+ get => (double)GetValue(Panel2WidthProperty);
152
+
153
+ set => SetValue(Panel2WidthProperty, value);
154
+
155
+ }
156
+
157
+ public static readonly DependencyProperty Panel2WidthProperty =
158
+
159
+ DependencyProperty.Register(
160
+
161
+ "Panel2Width",
162
+
163
+ typeof(double),
164
+
165
+ typeof(Layout2Panel),
166
+
167
+ new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
168
+
169
+
170
+
171
+ private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
172
+
173
+ {
174
+
175
+ Panel1Width = Panel1.ActualWidth;
176
+
177
+ Panel2Width = Panel2.ActualWidth;
178
+
179
+ }
180
+
181
+ }
182
+
183
+ }
184
+
185
+ ```
186
+
187
+
188
+
5
189
  MainWindow.xaml
6
190
 
7
191
  ```xaml
@@ -190,188 +374,4 @@
190
374
 
191
375
 
192
376
 
193
- Layout2Panel.xaml
194
-
195
- ```xaml
196
-
197
- <UserControl x:Class="WpfApp4.Layout2Panel"
198
-
199
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
200
-
201
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
202
-
203
- xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
204
-
205
- xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
206
-
207
- xmlns:local="clr-namespace:WpfApp4"
208
-
209
- mc:Ignorable="d"
210
-
211
- d:DesignHeight="450" d:DesignWidth="800">
212
-
213
- <Grid>
214
-
215
- <Grid.ColumnDefinitions>
216
-
217
- <ColumnDefinition Width="*"/>
218
-
219
- <ColumnDefinition Width="1"/>
220
-
221
- <ColumnDefinition Width="*"/>
222
-
223
- </Grid.ColumnDefinitions>
224
-
225
- <Grid x:Name="Panel1" Grid.Column="0" Background="Red" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged" >
226
-
227
- <TextBlock Text="①" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
228
-
229
- </Grid>
230
-
231
- <GridSplitter Grid.Column="1" ResizeDirection="Columns" HorizontalAlignment="Stretch"/>
232
-
233
- <Grid x:Name="Panel2" Grid.Column="2" Background="Blue" HorizontalAlignment="Stretch" SizeChanged="PanelSizeChanged">
234
-
235
- <TextBlock Text="②" TextAlignment="Center" VerticalAlignment="Center" FontSize="30" FontWeight="UltraBold"/>
236
-
237
- </Grid>
238
-
239
- </Grid>
240
-
241
- </UserControl>
242
-
243
-
244
-
245
- ```
246
-
247
-
248
-
249
- Layout2Panel.xaml.cs
250
-
251
- ```cs
252
-
253
- using System;
254
-
255
- using System.Collections.Generic;
256
-
257
- using System.ComponentModel;
258
-
259
- using System.Linq;
260
-
261
- using System.Runtime.CompilerServices;
262
-
263
- using System.Text;
264
-
265
- using System.Threading.Tasks;
266
-
267
- using System.Windows;
268
-
269
- using System.Windows.Controls;
270
-
271
- using System.Windows.Data;
272
-
273
- using System.Windows.Documents;
274
-
275
- using System.Windows.Input;
276
-
277
- using System.Windows.Media;
278
-
279
- using System.Windows.Media.Imaging;
280
-
281
- using System.Windows.Navigation;
282
-
283
- using System.Windows.Shapes;
284
-
285
-
286
-
287
- namespace WpfApp4
288
-
289
- {
290
-
291
- /// <summary>
292
-
293
- /// Panel.xaml の相互作用ロジック
294
-
295
- /// </summary>
296
-
297
- public partial class Layout2Panel : UserControl
298
-
299
- {
300
-
301
- public Layout2Panel()
302
-
303
- {
304
-
305
- InitializeComponent();
306
-
307
- }
308
-
309
-
310
-
311
- public double Panel1Width
312
-
313
- {
314
-
315
- get => (double)GetValue(Panel1WidthProperty);
316
-
317
- set => SetValue(Panel1WidthProperty, value);
318
-
319
- }
320
-
321
- public static readonly DependencyProperty Panel1WidthProperty =
322
-
323
- DependencyProperty.Register(
324
-
325
- "Panel1Width",
326
-
327
- typeof(double),
328
-
329
- typeof(Layout2Panel),
330
-
331
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
332
-
333
-
334
-
335
- public double Panel2Width
336
-
337
- {
338
-
339
- get => (double)GetValue(Panel2WidthProperty);
340
-
341
- set => SetValue(Panel2WidthProperty, value);
342
-
343
- }
344
-
345
- public static readonly DependencyProperty Panel2WidthProperty =
346
-
347
- DependencyProperty.Register(
348
-
349
- "Panel2Width",
350
-
351
- typeof(double),
352
-
353
- typeof(Layout2Panel),
354
-
355
- new FrameworkPropertyMetadata(0.0, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));
356
-
357
-
358
-
359
- private void PanelSizeChanged(object sender, SizeChangedEventArgs e)
360
-
361
- {
362
-
363
- Panel1Width = Panel1.ActualWidth;
364
-
365
- Panel2Width = Panel2.ActualWidth;
366
-
367
- }
368
-
369
- }
370
-
371
- }
372
-
373
- ```
374
-
375
-
376
-
377
- Layout2Panel の Panel1Width, Panel2Width が書き換わり、データソースへ反映されていく様子を確認することができます。
377
+ Layout2Panel の Panel1Width, Panel2Width がイベントにより書き換わることで、MainWindow から データソースへ反映されていく様子を確認することができます。

2

文章の修正

2021/08/19 10:00

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -1,4 +1,4 @@
1
- Grid に Binding するのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存プロパティに値をセットしてあげればよいと思います。
1
+ Grid に Binding するのではなく、下記のように SizeChanged のイベントを拾ってコードビハインドで依存関係プロパティに値をセットしてあげればよいと思います。
2
2
 
3
3
 
4
4
 

1

コード修正

2021/08/19 09:57

投稿

BluOxy
BluOxy

スコア2663

test CHANGED
@@ -20,7 +20,7 @@
20
20
 
21
21
  mc:Ignorable="d"
22
22
 
23
- d:DataContext="{d:DesignInstance local:MainWindow}"
23
+ d:DataContext="{d:DesignInstance local:ViewModel}"
24
24
 
25
25
  Title="MainWindow" Height="450" Width="800">
26
26
 
@@ -36,9 +36,9 @@
36
36
 
37
37
  <StackPanel Grid.Row="0" Orientation="Horizontal">
38
38
 
39
- <TextBlock Text="{Binding Panel1Width, UpdateSourceTrigger=PropertyChanged}"/>
39
+ <TextBlock Text="{Binding Panel1Width}"/>
40
-
40
+
41
- <TextBlock Text="{Binding Panel2Width, UpdateSourceTrigger=PropertyChanged}"/>
41
+ <TextBlock Text="{Binding Panel2Width}"/>
42
42
 
43
43
  </StackPanel>
44
44
 
@@ -48,8 +48,6 @@
48
48
 
49
49
  </Window>
50
50
 
51
-
52
-
53
51
  ```
54
52
 
55
53
 
@@ -150,8 +148,6 @@
150
148
 
151
149
 
152
150
 
153
-
154
-
155
151
  public class ViewModel : BindableBase
156
152
 
157
153
  {