Silverlight中的VisualState(可視狀態)是一個非常重要的概念，使用VisualState，可以將界面的各個狀態進行有效的區隔開，并進行單獨的設計，并且可以在狀態切換時實現動畫效果，一般來說，可以通過blend2(微軟提供的可視化編程工具）進行設計，但是如果需要動態讀取數值并進行設置的話，就需要使用本地的C++代碼來編寫各個VisualState,下面通過示例展示如何通過編寫C++代碼來實現與xaml代碼同樣的功能。

?

如下所示，xaml文件創建了一個狀態，并在該狀態下，將矩形旋轉了75度。

<UserControl
?xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
?xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
?x:Class="SilverlightApplication30.Page"
?Width="640" Height="480" xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows" x:Name="Root">

?<Grid x:Name="LayoutRoot" Background="White">
? <vsm:VisualStateManager.VisualStateGroups>
?? <vsm:VisualStateGroup x:Name="VisualStateGroup">
??? <vsm:VisualStateGroup.Transitions>
???? <vsm:VisualTransition GeneratedDuration="00:00:01"/>
??? </vsm:VisualStateGroup.Transitions>
??? <vsm:VisualState x:Name="State1">
???? <Storyboard>
????? <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000"

Storyboard.TargetName="rectangle" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">
?????? <SplineDoubleKeyFrame KeyTime="00:00:00" Value="75"/>
????? </DoubleAnimationUsingKeyFrames>
???? </Storyboard>
??? </vsm:VisualState>
?? </vsm:VisualStateGroup>
? </vsm:VisualStateManager.VisualStateGroups>
? <Rectangle Margin="168,168,208,192" x:Name="rectangle" RenderTransformOrigin="0.5,0.5" Fill="#FF8E1919" Stroke="#FF000000">
?? <Rectangle.RenderTransform>
??? <TransformGroup>
???? <ScaleTransform/>
???? <SkewTransform/>
???? <RotateTransform/>
???? <TranslateTransform/>
??? </TransformGroup>
?? </Rectangle.RenderTransform>
? </Rectangle>
?</Grid>
</UserControl>

?

下面，一層層分析，使用本地代碼來實現等效的功能：

?

首先，創建一個IXRVisualStateGroupCollection(即狀態組的集合)，并與Grid進行綁定

?

IXRVisualStateGroupCollection* pVisualStateGroups;
app->CreateObject(IID_IXRVisualStateGroupCollection, &pVisualStateGroups);
LayoutRoot->SetAttachedProperty(L"VisualStateManager.VisualStateGroups", pVisualStateGroups);

?

創建一個狀態組，并將其添加到狀態組集合中

?

IXRVisualStateGroupPtr pGroup;
app->CreateObject(IID_IXRVisualStateGroup,&pGroup);
pGroup->SetName(L"VisualStateGroup");
pVisualStateGroups->Add(pGroup,NULL);

?

通過狀態組下的IXRVisualTransitionCollection來設置通用的切換時間，現在暫定為1秒

?

IXRVisualTransitionCollectionPtr transitions;
app->CreateObject(IID_IXRVisualTransitionCollection,&transitions);
pGroup->SetTransitions(transitions);
IXRVisualTransitionPtr transtion;
app->CreateObject(IID_IXRVisualTransition,&transtion);
XRDuration duration;
duration.DurationType = duration.DurationType_TimeSpan;
duration.TimeSpan.Ticks = duration.TimeSpan.TicksPerSecond;
transtion->SetGeneratedDuration(&duration);
transitions->Add(transtion,NULL);

?

創建狀態集合，并將新建的狀態添加進去

?

IXRVisualStateCollectionPtr StateCollection;
pGroup->GetStates(&StateCollection);
IXRVisualStatePtr state;
app->CreateObject(IID_IXRVisualState,&state);
state->SetName(L"State1");
StateCollection->Add(state,NULL);

?

創建一個新的故事板，并將其設置到剛創建的狀態中

?

IXRStoryboardPtr Storyboard;
app->CreateObject(IID_IXRStoryboard,&Storyboard);
state->SetStoryboard(Storyboard);

?

創建一個IXRDoubleAnimationUsingKeyFrames對象，將它添加到故事板中，
[注:IXRDoubleAnimationUsingKeyFrames派生自IXRTimeline，通過在不同幀時對同一屬性設置不同的數值來實現動畫效果]

?

IXRTimelineCollectionPtr children;
Storyboard->GetChildren(&children);
IXRDoubleAnimationUsingKeyFramesPtr animation;
app->CreateObject(IID_IXRDoubleAnimationUsingKeyFrames,&animation);
children->Add(animation,NULL);

?

設置animation對象的通用屬性

?

XRTimeSpan span;
memset(&span,0,sizeof(XRTimeSpan));
animation->SetBeginTime(&span);
animation->SetBeginTime(&span);
animation->SetDuration(&duration);
animation->SetAttachedProperty(L"Storyboard.TargetName",L"rectangle");
animation->SetAttachedProperty(L"Storyboard.TargetProperty",L"(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)");

?

創建新的一幀，并將其添加到animation的幀集合中

?

IXRDoubleKeyFrameCollectionPtr frameCollection;
animation->GetKeyFrames(&frameCollection);
IXRSplineDoubleKeyFramePtr keyFrame;
app->CreateObject(IID_IXRSplineDoubleKeyFrame,&keyFrame);
XRKeyTime time;
time.Ticks = time.TicksPerSecond;
keyFrame->SetKeyTime(&time);
keyFrame->SetValue(75);
frameCollection->Add(keyFrame,NULL);

?

OK，大功告成，轉換狀態，看到了矩形的變化過程

?

Root->GoToVisualState(L"State1",true);

關注技術文章飛秋：http://www.freeeim.com/，24小時專業轉載。

總結

以上是生活随笔為你收集整理的【飞秋】使用C++语言创建Silverlight中的VisualState的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。