c# - 使用 UserControl 的 Page.xaml 中的 VisualStateManager 在 UWP 应用程序中不起作用
问题描述
在我的 UWP 应用程序中,在后面的代码中
VisualStateManager.GoToState(this,"Layout2",false);
返回假;当我在使用 UserControl 的 page.xaml 中使用 VisualStateManager xaml 块时。
这就是我的意思。这是使用用户控制的 page.xaml:
<local:MainUserControl x:Name="mainControl">
<local:MainUserControl.QuestionContent>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="200"/>
<RowDefinition Height="200"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<Border x:Name="imageControl" Background="Red" Height="200" Width="200" Grid.Row="0" Grid.Column="0"/>
<Border x:Name="richTextBoxControl" Background="Yellow" Grid.Row="0" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState x:Name="Layout1"/>
<VisualState x:Name="Layout2">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="imageControl" Storyboard.TargetProperty="(Grid.Column)">
<DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="richTextBoxControl" Storyboard.TargetProperty="(Grid.Column)">
<DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</local:MainUserControl.QuestionContent>
</local:MainUserControl>
从代码中,我正在尝试更改布局状态。但不幸的是无法做到。
我也尝试发送“this.mainControl”而不是“this”但失败了。
VisualStateManager.GoToState(this.mainControl,"Layout2",false)
而且我还检查了我的命名空间两次,但无法解决这个问题。
请注意,当我删除
<local:MainUserControl x:Name="mainControl">
<local:MainUserControl.QuestionContent>
一切都按预期工作。
任何帮助将不胜感激。
谢谢。
编辑:这是我的 MainUserControl.xaml
<UserControl
x:Class="MyProject.Pages.MainUserControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MyProject.Pages"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="#ededed">
<Grid.RowDefinitions>
<RowDefinition Height="227"/>
<RowDefinition Height="625"/>
<RowDefinition Height="227"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="692"/>
<ColumnDefinition Width="1000"/>
<ColumnDefinition Width="228"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="1" Grid.Column="1" Background="White" >
<StackPanel x:Name="panelQuestion">
<ContentPresenter Content="{x:Bind QuestionContent}"/>
</StackPanel>
</StackPanel>
</Grid>
这是我的 MainUserControl.xaml.cs
namespace MyProject.Pages
{
public sealed partial class MainUserControl : UserControl
{
public StackPanel cPanelQuestion;
public MainUserControl()
{
this.InitializeComponent();
cPanelQuestion = this.panelQuestion;
}
public object QuestionContent
{
get { return (object)GetValue(QuestionContentProperty); }
set { SetValue(QuestionContentProperty, value); }
}
// Using a DependencyProperty as the backing store for Body. This enables animation, styling, binding, etc...
public static readonly DependencyProperty QuestionContentProperty =
DependencyProperty.Register("QuestionContent", typeof(object), typeof(MainUserControl), null);
}
}
解决方案
You need to put the VisualStateManager.VisualStateGroups
as the root panel Grid
's immediate child tag like the following:
<Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState x:Name="Layout1"/>
<VisualState x:Name="Layout2">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="imageControl" Storyboard.TargetProperty="(Grid.Column)">
<DiscreteObjectKeyFrame KeyTime="0" Value="1"/>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="richTextBoxControl" Storyboard.TargetProperty="(Grid.Column)">
<DiscreteObjectKeyFrame KeyTime="0" Value="0"/>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<local:MainUserControl x:Name="mainControl">
<local:MainUserControl.QuestionContent>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="200"/>
<RowDefinition Height="200"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<Border x:Name="imageControl" Background="Red" Height="200" Width="200" Grid.Row="0" Grid.Column="0"/>
<Border x:Name="richTextBoxControl" Background="Yellow" Grid.Row="0" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
</Grid>
</local:MainUserControl.QuestionContent>
</local:MainUserControl>
</Grid>
Then, in this XAML page's code-behind, you could call VisualStateManager.GoToState(this, "Layout2", false);
to change the visual state.