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

回答編集履歴

3

見直しキャンペーン中

2023/07/26 13:37

投稿

TN8001
TN8001

スコア10108

answer CHANGED
@@ -1,118 +1,118 @@
1
- `VisualStateManager`か`Trigger`かで変えることになります。
2
-
3
- 既定のテンプレートを見ると参考になります。
4
- 通常の`Calendar`を置いてデザイナで右クリックし、「追加テンプレートの編集」-「CalendarDayButtonStyle の編集」-「コピーして編集」で既定のテンプレートが見れます。
5
- もしくは、[カレンダーのスタイルとテンプレート - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/calendar-styles-and-templates?view=netframeworkdesktop-4.8)
6
-
7
-
8
- `VisualStateManager`はかなり冗長なので、アニメーションが不要な時は`Trigger`が手軽です。
9
- その際は使える依存関係プロパティがないかを確認します。
10
-
11
- [CalendarDayButton.IsSelectedProperty フィールド (System.Windows.Controls.Primitives) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.controls.primitives.calendardaybutton.isselectedproperty?view=netframework-4.7.2)
12
-
13
-
14
- 提示コードだけでは動かせないので、`ItemsControl`は省略させていただきました。
15
-
16
- ```xaml
17
- <Window
18
- x:Class="Questions319493.MainWindow"
19
- xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
20
- xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
21
- Width="1200"
22
- Height="600">
23
- <StackPanel Orientation="Horizontal">
24
-
25
- <!-- VisualStateManager -->
26
- <Calendar SelectedDate="{Binding SelectedDate}" SelectionMode="MultipleRange">
27
- <Calendar.Background>White</Calendar.Background>
28
- <Calendar.CalendarDayButtonStyle>
29
- <Style TargetType="{x:Type CalendarDayButton}">
30
- <Setter Property="Template">
31
- <Setter.Value>
32
- <ControlTemplate TargetType="{x:Type CalendarDayButton}">
33
- <Grid Background="White">
34
-
35
- <!-- 色を付けるのはなんでもいいですが、既定の作りに合わせました -->
36
- <Rectangle
37
- x:Name="SelectedBackground"
38
- Fill="#FFBADDE9"
39
- Opacity="0"
40
- RadiusX="1"
41
- RadiusY="1" />
42
-
43
- <Border BorderBrush="Turquoise" BorderThickness="1">
44
- <StackPanel MinWidth="80" MinHeight="80">
45
- <TextBlock
46
- Margin="2"
47
- FontSize="16"
48
- Text="{Binding StringFormat={}{0:dd}}" />
49
- </StackPanel>
50
- </Border>
51
-
52
- <!-- 本来はもっとステートがありますが選択についてだけ -->
53
- <VisualStateManager.VisualStateGroups>
54
- <VisualStateGroup x:Name="SelectionStates">
55
- <VisualStateGroup.Transitions>
56
- <VisualTransition GeneratedDuration="0" />
57
- </VisualStateGroup.Transitions>
58
- <VisualState x:Name="Unselected" />
59
- <VisualState x:Name="Selected">
60
- <Storyboard>
61
- <DoubleAnimation
62
- Storyboard.TargetName="SelectedBackground"
63
- Storyboard.TargetProperty="Opacity"
64
- To=".75"
65
- Duration="0" />
66
- </Storyboard>
67
- </VisualState>
68
- </VisualStateGroup>
69
- </VisualStateManager.VisualStateGroups>
70
- </Grid>
71
- </ControlTemplate>
72
- </Setter.Value>
73
- </Setter>
74
- </Style>
75
- </Calendar.CalendarDayButtonStyle>
76
- </Calendar>
77
-
78
- <!-- Trigger -->
79
- <Calendar SelectedDate="{Binding SelectedDate}">
80
- <Calendar.Background>White</Calendar.Background>
81
- <Calendar.CalendarDayButtonStyle>
82
- <Style TargetType="{x:Type CalendarDayButton}">
83
- <Setter Property="Template">
84
- <Setter.Value>
85
- <ControlTemplate TargetType="{x:Type CalendarDayButton}">
86
- <Grid Background="White">
87
-
88
- <Rectangle
89
- x:Name="SelectedBackground"
90
- Fill="#FFBADDE9"
91
- Opacity="0"
92
- RadiusX="1"
93
- RadiusY="1" />
94
-
95
- <Border BorderBrush="Turquoise" BorderThickness="1">
96
- <StackPanel MinWidth="80" MinHeight="80">
97
- <TextBlock
98
- Margin="2"
99
- FontSize="16"
100
- Text="{Binding StringFormat={}{0:dd}}" />
101
- </StackPanel>
102
- </Border>
103
- </Grid>
104
-
105
- <ControlTemplate.Triggers>
106
- <Trigger Property="IsSelected" Value="True">
107
- <Setter TargetName="SelectedBackground" Property="Opacity" Value=".75" />
108
- </Trigger>
109
- </ControlTemplate.Triggers>
110
- </ControlTemplate>
111
- </Setter.Value>
112
- </Setter>
113
- </Style>
114
- </Calendar.CalendarDayButtonStyle>
115
- </Calendar>
116
- </StackPanel>
117
- </Window>
1
+ `VisualStateManager`か`Trigger`かで変えることになります。
2
+
3
+ 既定のテンプレートを見ると参考になります。
4
+ 通常の`Calendar`を置いてデザイナで右クリックし、「追加テンプレートの編集」-「CalendarDayButtonStyle の編集」-「コピーして編集」で既定のテンプレートが見れます。
5
+ もしくは、[カレンダーのスタイルとテンプレート - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/calendar-styles-and-templates?view=netframeworkdesktop-4.8)
6
+
7
+
8
+ `VisualStateManager`はかなり冗長なので、アニメーションが不要な時は`Trigger`が手軽です。
9
+ その際は使える依存関係プロパティがないかを確認します。
10
+
11
+ [CalendarDayButton.IsSelectedProperty フィールド (System.Windows.Controls.Primitives) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.controls.primitives.calendardaybutton.isselectedproperty?view=netframework-4.7.2)
12
+
13
+
14
+ 提示コードだけでは動かせないので、`ItemsControl`は省略させていただきました。
15
+
16
+ ```xml
17
+ <Window
18
+ x:Class="Questions319493.MainWindow"
19
+ xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
20
+ xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
21
+ Width="1200"
22
+ Height="600">
23
+ <StackPanel Orientation="Horizontal">
24
+
25
+ <!-- VisualStateManager -->
26
+ <Calendar SelectedDate="{Binding SelectedDate}" SelectionMode="MultipleRange">
27
+ <Calendar.Background>White</Calendar.Background>
28
+ <Calendar.CalendarDayButtonStyle>
29
+ <Style TargetType="{x:Type CalendarDayButton}">
30
+ <Setter Property="Template">
31
+ <Setter.Value>
32
+ <ControlTemplate TargetType="{x:Type CalendarDayButton}">
33
+ <Grid Background="White">
34
+
35
+ <!-- 色を付けるのはなんでもいいですが、既定の作りに合わせました -->
36
+ <Rectangle
37
+ x:Name="SelectedBackground"
38
+ Fill="#FFBADDE9"
39
+ Opacity="0"
40
+ RadiusX="1"
41
+ RadiusY="1" />
42
+
43
+ <Border BorderBrush="Turquoise" BorderThickness="1">
44
+ <StackPanel MinWidth="80" MinHeight="80">
45
+ <TextBlock
46
+ Margin="2"
47
+ FontSize="16"
48
+ Text="{Binding StringFormat={}{0:dd}}" />
49
+ </StackPanel>
50
+ </Border>
51
+
52
+ <!-- 本来はもっとステートがありますが選択についてだけ -->
53
+ <VisualStateManager.VisualStateGroups>
54
+ <VisualStateGroup x:Name="SelectionStates">
55
+ <VisualStateGroup.Transitions>
56
+ <VisualTransition GeneratedDuration="0" />
57
+ </VisualStateGroup.Transitions>
58
+ <VisualState x:Name="Unselected" />
59
+ <VisualState x:Name="Selected">
60
+ <Storyboard>
61
+ <DoubleAnimation
62
+ Storyboard.TargetName="SelectedBackground"
63
+ Storyboard.TargetProperty="Opacity"
64
+ To=".75"
65
+ Duration="0" />
66
+ </Storyboard>
67
+ </VisualState>
68
+ </VisualStateGroup>
69
+ </VisualStateManager.VisualStateGroups>
70
+ </Grid>
71
+ </ControlTemplate>
72
+ </Setter.Value>
73
+ </Setter>
74
+ </Style>
75
+ </Calendar.CalendarDayButtonStyle>
76
+ </Calendar>
77
+
78
+ <!-- Trigger -->
79
+ <Calendar SelectedDate="{Binding SelectedDate}">
80
+ <Calendar.Background>White</Calendar.Background>
81
+ <Calendar.CalendarDayButtonStyle>
82
+ <Style TargetType="{x:Type CalendarDayButton}">
83
+ <Setter Property="Template">
84
+ <Setter.Value>
85
+ <ControlTemplate TargetType="{x:Type CalendarDayButton}">
86
+ <Grid Background="White">
87
+
88
+ <Rectangle
89
+ x:Name="SelectedBackground"
90
+ Fill="#FFBADDE9"
91
+ Opacity="0"
92
+ RadiusX="1"
93
+ RadiusY="1" />
94
+
95
+ <Border BorderBrush="Turquoise" BorderThickness="1">
96
+ <StackPanel MinWidth="80" MinHeight="80">
97
+ <TextBlock
98
+ Margin="2"
99
+ FontSize="16"
100
+ Text="{Binding StringFormat={}{0:dd}}" />
101
+ </StackPanel>
102
+ </Border>
103
+ </Grid>
104
+
105
+ <ControlTemplate.Triggers>
106
+ <Trigger Property="IsSelected" Value="True">
107
+ <Setter TargetName="SelectedBackground" Property="Opacity" Value=".75" />
108
+ </Trigger>
109
+ </ControlTemplate.Triggers>
110
+ </ControlTemplate>
111
+ </Setter.Value>
112
+ </Setter>
113
+ </Style>
114
+ </Calendar.CalendarDayButtonStyle>
115
+ </Calendar>
116
+ </StackPanel>
117
+ </Window>
118
118
  ```

2

無駄改行

2021/01/30 11:54

投稿

TN8001
TN8001

スコア10108

answer CHANGED
@@ -2,8 +2,7 @@
2
2
 
3
3
  既定のテンプレートを見ると参考になります。
4
4
  通常の`Calendar`を置いてデザイナで右クリックし、「追加テンプレートの編集」-「CalendarDayButtonStyle の編集」-「コピーして編集」で既定のテンプレートが見れます。
5
- もしくは
6
- [カレンダーのスタイルとテンプレート - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/calendar-styles-and-templates?view=netframeworkdesktop-4.8)
5
+ もしくは、[カレンダーのスタイルとテンプレート - WPF .NET Framework | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/desktop/wpf/controls/calendar-styles-and-templates?view=netframeworkdesktop-4.8)
7
6
 
8
7
 
9
8
  `VisualStateManager`はかなり冗長なので、アニメーションが不要な時は`Trigger`が手軽です。

1

無駄スペース

2021/01/30 11:54

投稿

TN8001
TN8001

スコア10108

answer CHANGED
@@ -12,7 +12,7 @@
12
12
  [CalendarDayButton.IsSelectedProperty フィールド (System.Windows.Controls.Primitives) | Microsoft Docs](https://docs.microsoft.com/ja-jp/dotnet/api/system.windows.controls.primitives.calendardaybutton.isselectedproperty?view=netframework-4.7.2)
13
13
 
14
14
 
15
- 提示コードだけでは動かせないので、`ItemsControl `は省略させていただきました。
15
+ 提示コードだけでは動かせないので、`ItemsControl`は省略させていただきました。
16
16
 
17
17
  ```xaml
18
18
  <Window