Question

我正在做一些Windows 10 UWP应用程序开发，我遇到了问题，谢谢大家的帮助，吹了我的代码：

在MainPage.xaml

中

<Grid  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Pivot Style="{StaticResource fuckpivot}" SelectionChanged="Pivot_SelectionChanged">
        <PivotItem>
            <PivotItem.Header>
                <local:test Label="item 3" Glyph="&#xE723;" />
            </PivotItem.Header>
            <Rectangle 
                      x:Name="MyAnimatedRectangle"
                      Width="100" Height="100" Fill="Blue" />
        </PivotItem>
        <PivotItem>
            <PivotItem.Header>
                <local:test Label="item 2" Glyph="&#xE723;" HighLight="Transparent"/>
            </PivotItem.Header>
            <!--<Rectangle x:Name="MyTest" Width="100" Height="100" Fill="red"/>-->
        </PivotItem>
    </Pivot>

</Grid>

和我的＆＃34; testControl＆＃34;：

   <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="10"/>
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0">
        <FontIcon
                        HorizontalAlignment="Center"
                        Margin="0,12,0,0"
                        Glyph="{Binding Glyph}"
                        FontSize="16" />
        <TextBlock
                        FontFamily="Segoe UI"
                        Text="{Binding Label}"
                        Style="{StaticResource CaptionTextBlockStyle}"
                        LineStackingStrategy="BlockLineHeight"
                        LineHeight="14"
                        MaxLines="2"
                        IsTextScaleFactorEnabled="False"
                        TextAlignment="Center"
                        HorizontalAlignment="Center"
                        Margin="2,5,2,7" />
    </StackPanel>
    <Grid Grid.Row="1">
        <Border BorderThickness="0,0,0,2" VerticalAlignment="Bottom" BorderBrush="Red"/>
    </Grid>
</Grid>

所以，我的问题是：如何更改名为＆＃34; test＆＃34;？（当枢轴更改为当前索引时，如何编写可视状态？）的子UserControl中的高亮颜色。

Answer 1

我已经在WP8.1 RunTime上对它进行了测试，但在这种情况下，我认为它没有那么多改变。下面的示例使用 VisualStateManager 将Label.Foreground更改为绿色。代码主要在XAML中，如下所示：

的MainPage：

<Grid  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Pivot SelectionChanged="Pivot_SelectionChanged">
        <PivotItem>
            <PivotItem.Header>
                <local:testControl Label="item 3" Glyph="&#xE723;" />
            </PivotItem.Header>
            <Rectangle 
                  x:Name="MyAnimatedRectangle"
                  Width="100" Height="100" Fill="Blue" />
        </PivotItem>
        <PivotItem>
            <PivotItem.Header>
                <local:testControl Label="item 2" Glyph="&#xE723;"/>
            </PivotItem.Header>
        </PivotItem>
    </Pivot>
</Grid>

系统testControl：

<Grid>        
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="SelectionStates">
            <VisualState x:Name="Unselected"/>
            <VisualState x:Name="Selected">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Foreground" Storyboard.TargetName="MyLabel">
                        <DiscreteObjectKeyFrame KeyTime="0" Value="Green"/>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="10"/>
    </Grid.RowDefinitions>
    <StackPanel Grid.Row="0">
        <FontIcon   HorizontalAlignment="Center" Margin="0,12,0,0" Glyph="{Binding Glyph}" FontSize="16" />
        <TextBlock x:Name="MyLabel" FontFamily="Segoe UI" Text="{Binding Label}" LineStackingStrategy="BlockLineHeight" LineHeight="14"
                   TextAlignment="Center" HorizontalAlignment="Center" Margin="2,5,2,7" />
    </StackPanel>
    <Grid Grid.Row="1">
        <Border BorderThickness="0,0,0,2" VerticalAlignment="Bottom" BorderBrush="Red"/>
    </Grid>
</Grid>

为了完成这项工作，您只需在透视图选择更改时更改 VisualStates - 这将在MainPage的代码后面进行：

private void Pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (e.RemovedItems.Count > 0)
        VisualStateManager.GoToState((e.RemovedItems.First() as PivotItem).Header as testControl, "Unselected", true);
    if (e.AddedItems.Count > 0)
        VisualStateManager.GoToState((e.AddedItems.First() as PivotItem).Header as testControl, "Selected", true);
}

您还应该在一些博客和文章中找到更多帮助at MSDN，甚至更多。

如何使用＆＃34; visualstate＆＃34;在xaml中修改子usercontrol的状态？

1 个答案: