WinRT コードビハインド書かずにWebViewにプログレスバーつける
WebViewがコンテンツをロード中にプログレスバーを出しておくとユーザに親切だったりします。
ただこれ作るのにコードビハインド書かなくちゃいけなくて、めんどうだなあと思ってました。
実はXAMLだけで簡単に書けるみたいです。
<Border> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="WebViewVisualStateGroup"> <VisualState x:Name="contentloading"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="progressBar" Storyboard.TargetProperty="(ProgressBar.IsIndeterminate)"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <x:Boolean>True</x:Boolean> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> <FadeInThemeAnimation TargetName="border" /> </Storyboard> </VisualState> <VisualState x:Name="contentloaded"> <Storyboard> <FadeOutThemeAnimation TargetName="border" /> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid> <Grid.RowDefinitions> <RowDefinition Height="20" /> <RowDefinition Height="1*" /> </Grid.RowDefinitions> <WebView x:Name="WebViewObj" Grid.RowSpan="2" Source="{Binding SelectFeedItem.Uri}"> <Interactivity:Interaction.Behaviors> <Core:EventTriggerBehavior EventName="NavigationCompleted"> <Core:GoToStateAction StateName="contentloaded" /> </Core:EventTriggerBehavior> <Core:EventTriggerBehavior EventName="NavigationStarting"> <Core:GoToStateAction StateName="contentloading" /> </Core:EventTriggerBehavior> <Core:EventTriggerBehavior EventName="NavigationFailed"> <Core:GoToStateAction StateName="contentloaded" /> </Core:EventTriggerBehavior> </Interactivity:Interaction.Behaviors> </WebView> <Border x:Name="border" Background="#B2F0F8FF"> <ProgressBar x:Name="progressBar" /> </Border> </Grid> </Border>
参考になるエントリ
Blend for VS2013 RCにXAMLでのBehavior復活!!(ただしWindows 8.1のみのもよう) - かずきのBlog@hatena
MVVM開発をさらに加速させる ノンコーディングUI開発 - SSSSLIDE