かつてターミナルとかコンソールの時代は、テキストの装飾というと色指定か色反転 (=Inverse) か点滅かのいずれかしかなかったわけですが。
HTML にしても XAML にしても、色指定は Foreground で、色反転相当は Background でなんとかなるわけですが、なぜか点滅が難易度高いんですよね… html はかつて netscape navigator とやらではイケたらしいですが…?
ともかく、WPF XAML で点滅させる方法を考えてみました。以下はそのコード。
<StackPanel>
<StackPanel.Resources>
<!-- 点滅のためのストーリーボードの作成 -->
<Storyboard x:Key="BlinkingStoryboard">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
RepeatBehavior="Forever">
<DiscreteDoubleKeyFrame KeyTime="0"
Value="0" />
<DiscreteDoubleKeyFrame KeyTime="0:0:0.5"
Value="1" />
<DiscreteDoubleKeyFrame KeyTime="0:0:2"
Value="0" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<!-- 点滅のためのスタイルの作成 -->
<Style TargetType="TextBlock"
x:Key="BlinkingStyle">
<Style.Triggers>
<Trigger Property="IsEnabled"
Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource BlinkingStoryboard}"
x:Name="BlinkingStoryboard1" />
</Trigger.EnterActions>
<Trigger.ExitActions>
<StopStoryboard BeginStoryboardName="BlinkingStoryboard1" />
</Trigger.ExitActions>
</Trigger>
</Style.Triggers>
</Style>
</StackPanel.Resources>
<!-- 点滅対象のテキスト -->
<TextBlock x:Name="Text1"
Text="点滅するテキスト"
Style="{StaticResource BlinkingStyle}"
IsEnabled="False" />
<!-- 点滅/点灯を切り替えるためのボタン -->
<StackPanel Orientation="Horizontal">
<Button Content="点滅"
Width="50"
Click="StartBlinkingClick" />
<Button Content="点灯"
Width="50"
Click="StopBlinkingClick" />
</StackPanel>
</StackPanel>
コードビハインド側はこんな感じ。
Private Sub StartBlinkingClick(sender As Object, e As RoutedEventArgs)
Me.Text1.IsEnabled = True
End Sub
Private Sub StopBlinkingClick(sender As Object, e As RoutedEventArgs)
Me.Text1.IsEnabled = False
End Sub
やっていることは以下のような感じ。
- storyborad を使って、点滅のためのシーケンスを作ります。上記では UIElement の Opacity を 0.5 秒間 0% (=消去)、1.5 秒間 100% (=表示) することで点滅を表現しています。
- その storyborad を textblock の style に適用。上記では IsEnabled の True で storyborad を開始、False で停止しています。
- 上記 2 つは resources 内に記述し、それぞれ名前をつけます。(x:Key="BlinkingStoryboard", x:Key="BlinkingStyle")
また、storyboard を停止するとき、開始した storyborad のインスタンスを指定しなくてはならないので、storyborad のインスタンスに名前をつけています。(x:Name="BlinkingStoryboard1") - その後 textblock にこの style を適用します。(Style="{StaticResource BlinkingStyle}")
- あとは、Style を適用した Textblock の IsEnabled を操作すると、点灯と点滅が切り替わります。
いや、IsEnabled に紐づけるのどうなん?という人は DataTrigger あたりを検討してみてください。
あるいは Style を適用せず直接コードビハインドで操作したい、という場合は以下のコードを適用します。
Private _text1Blinking As Storyboard
Private Sub StartBlinkingClick(sender As Object, e As RoutedEventArgs)
' Stackpanel.Resources を記述している StackPanel に x:Name="rootPanel" を追記してから以下を実行
_text1Blinking = CType(Me.rootPanel.Resources("BlinkingStoryboard"), Storyboard)
_text1Blinking.Begin(Me.Text1, True)
End Sub
Private Sub StopBlinkingClick(sender As Object, e As RoutedEventArgs)
_text1Blinking.Stop(Me.Text1)
End Sub