为什么我的 XAML 交互行为在用户控件中不起作用
Why won't my XAML interactivity behaviors work in a user control
我正在开发一个 UWP 应用程序，该应用程序将交互行为用于 open/close UI 元素。
作为一个小背景故事，我的应用程序之前使用 copy/pasted XAML 进行客户选择 blade 视图，并在所有相关视图中使用 blades。
其中 XAML 是交互性 behaviors/triggers，可以关闭一个 blade 并在单击按钮时打开另一个，效果很好。
由于复制粘贴相同 XAML 到处都是乱七八糟的东西，我清理了那个 UI 部分并将其移到了它自己的用户控件中，我刚刚设法开始工作我需要它与绑定和所有的方式。唯一的问题是我的交互性 behaviors/triggers 现在不再有效，因为它们是用户控件的一部分。
这是与按钮内的 behviors/triggers 相关的具体 XAML：
<Button x:Name="CreatNewCustomer"
HorizontalAlignment="Stretch"
Content="New Customer"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="NewCustomerBlade"
PropertyName="IsOpen"
Value="True" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
这是我的整个用户控件：
<UserControl x:Class="myapp.Views.CustomerDatabaseControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:retailemployeetoolset.Views"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:models="using:myapp.Models"
mc:Ignorable="d"
d:DesignHeight="840"
d:DesignWidth="1320">
<Grid x:Name="AddCustomerBlades">
<controls:BladeView x:Name="CustomerSearchBladeview"
IsEnabled="True"
BladeMode="Fullscreen">
<controls:BladeItem x:Name="SearchCustomerBlade"
Width="1325"
Background="#FF1E1E1E"
Height="712"
TitleBarVisibility="Collapsed"
IsOpen="True"
BorderThickness="5"
BorderBrush="#FF707070">
<StackPanel>
<StackPanel Orientation="Horizontal"
Height="65">
<TextBlock Text="Customers"
FontSize="38"
Margin="10"
Foreground="#FFCDCDCD"
Width="825" />
<StackPanel Orientation="Horizontal"
Width="465">
<TextBlock Text="Search: "
FontSize="28"
Margin="5"
Foreground="#FFCDCDCD"
Width="90"
VerticalAlignment="Center" />
<TextBox x:Name="CustomerSearch"
TextWrapping="Wrap"
Height="46"
Width="350"
Margin="5" />
</StackPanel>
</StackPanel>
<StackPanel Orientation="Horizontal"
Margin="5"
HorizontalAlignment="Right">
<Button x:Name="CreatNewCustomer"
HorizontalAlignment="Stretch"
Content="New Customer"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="NewCustomerBlade"
PropertyName="IsOpen"
Value="True" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
<Button x:Name="CloseCustomerWindow"
HorizontalAlignment="Stretch"
Content="Close Window"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5" />
</StackPanel>
<StackPanel Margin="0,5"
Orientation="Horizontal">
<StackPanel Width="1307">
<GridView Name="CustomerList"
ItemsSource="{Binding CustomerDatabase}"
SelectedItem="{Binding SelectedCustomer, Mode=TwoWay}"
Width="auto"
Height="685"
Background="#FF2E2B2B"
BorderThickness="3"
BorderBrush="#FF707070"
Margin="10,0,8,0">
<GridView.Header>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="8" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Grid.Column="0"
Text="First Name"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="1"
Text="Last Name"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="2"
Text="Enail"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="3"
Text="Phone Number"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="4"
Text="Organization"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
</Grid>
</GridView.Header>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="Margin"
Value="7,0,0,1" />
<Setter Property="HorizontalAlignment"
Value="Center" />
</Style>
</GridView.ItemContainerStyle>
<GridView.ItemTemplate>
<DataTemplate x:DataType="models:Customer">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="45" />
</Grid.RowDefinitions>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="0">
<TextBlock Text="{x:Bind CustomerFirstName}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,8,0,-2"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="1">
<TextBlock Text="{x:Bind CustomerLastName}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,10,0,0"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="2">
<TextBlock Text="{x:Bind CustomerEmail}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,8,0,0"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="3">
<TextBlock Text="{x:Bind CustomerPhoneNumber}"
Foreground="#FFCDCDCD"
Width="auto"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="4">
<TextBlock Text="{x:Bind OrganizationName}"
Foreground="#FFCDCDCD"
Width="auto"
TextAlignment="Center" />
</Border>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</StackPanel>
</StackPanel>
</StackPanel>
</controls:BladeItem>
<controls:BladeItem x:Name="CustomerAddBlade"
Width="1320"
Background="#FF1E1E1E"
Height="835"
TitleBarVisibility="Collapsed"
IsOpen="False"
BorderThickness="5"
BorderBrush="#FF707070">
<StackPanel>
<TextBlock Text="Add Customer"
FontSize="48"
Foreground="#FFCDCDCD"
Height="56"
Margin="15"
HorizontalAlignment="Left" />
<StackPanel HorizontalAlignment="Center"
Width="409">
<StackPanel Margin="10,0">
<TextBlock Text="Email Address:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="EmailBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="First Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="FirstNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="Last Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="LastNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="Phone Number:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="PhoneBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<CheckBox x:Name="BusinessCustomerCheckbox"
Content="Business Customer"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Height="21"
Margin="10"
Foreground="#FFCDCDCD" />
<StackPanel x:Name="OrgNamePanel"
Visibility="Visible"
Margin="10,0">
<TextBlock Text="Organization Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="BusinessNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<Button x:Name="AddNewCustomerButton"
HorizontalAlignment="Stretch"
Content="Add Customer"
VerticalAlignment="Stretch"
Height="60"
Background="#FF007ACC"
Foreground="#FFCDCDCD"
Margin="20">
</Button>
</StackPanel>
</StackPanel>
</controls:BladeItem>
</controls:BladeView>
</Grid>
在用户控件中使用行为时，是否需要做一些不同的事情？或者它们不能在用户控件中使用？
我可以在后面的代码中为用户控件创建属性来处理打开和关闭我的 blades 但感觉它会更草率并且需要比 8 行更多的代码使用行为所需的代码。
编辑：
添加我收到的异常以防其他人搜索类似错误。
"Cannot find a property named Windows.UI.Xaml.PropertyPath on type String."
听起来您的事件处理程序没有得到正确解析。如果您在与控件不同的 class 中指定点击处理程序，则可以使用 x:bind.
将其连接起来
查看以下摘自 MSDN
的代码
<ComboBox x:Name="ColorComboBox"
ItemsSource="{x:Bind SettingsVM.Colors}"
SelectionChanged="{x:Bind SettingsVM.ColorDefinitionChanged(SelectedItem)}" />
void ColorDefinitionChanged(ColorDefinition def)
{
...
}
我认为 TargetObject="NewCustomerBlade" 行不通。你能试试TargetObject="{Binding ElementName=NewCustomerBlade}"吗？
您还需要将此行为置于用户控件之外，NewCustomerBlade 控件所在的位置。确保按钮和控件在同一页面上。
我正在开发一个 UWP 应用程序，该应用程序将交互行为用于 open/close UI 元素。
作为一个小背景故事，我的应用程序之前使用 copy/pasted XAML 进行客户选择 blade 视图，并在所有相关视图中使用 blades。
其中 XAML 是交互性 behaviors/triggers，可以关闭一个 blade 并在单击按钮时打开另一个，效果很好。
由于复制粘贴相同 XAML 到处都是乱七八糟的东西，我清理了那个 UI 部分并将其移到了它自己的用户控件中，我刚刚设法开始工作我需要它与绑定和所有的方式。唯一的问题是我的交互性 behaviors/triggers 现在不再有效，因为它们是用户控件的一部分。
这是与按钮内的 behviors/triggers 相关的具体 XAML：
<Button x:Name="CreatNewCustomer"
HorizontalAlignment="Stretch"
Content="New Customer"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="NewCustomerBlade"
PropertyName="IsOpen"
Value="True" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
这是我的整个用户控件：
<UserControl x:Class="myapp.Views.CustomerDatabaseControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:retailemployeetoolset.Views"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"
xmlns:models="using:myapp.Models"
mc:Ignorable="d"
d:DesignHeight="840"
d:DesignWidth="1320">
<Grid x:Name="AddCustomerBlades">
<controls:BladeView x:Name="CustomerSearchBladeview"
IsEnabled="True"
BladeMode="Fullscreen">
<controls:BladeItem x:Name="SearchCustomerBlade"
Width="1325"
Background="#FF1E1E1E"
Height="712"
TitleBarVisibility="Collapsed"
IsOpen="True"
BorderThickness="5"
BorderBrush="#FF707070">
<StackPanel>
<StackPanel Orientation="Horizontal"
Height="65">
<TextBlock Text="Customers"
FontSize="38"
Margin="10"
Foreground="#FFCDCDCD"
Width="825" />
<StackPanel Orientation="Horizontal"
Width="465">
<TextBlock Text="Search: "
FontSize="28"
Margin="5"
Foreground="#FFCDCDCD"
Width="90"
VerticalAlignment="Center" />
<TextBox x:Name="CustomerSearch"
TextWrapping="Wrap"
Height="46"
Width="350"
Margin="5" />
</StackPanel>
</StackPanel>
<StackPanel Orientation="Horizontal"
Margin="5"
HorizontalAlignment="Right">
<Button x:Name="CreatNewCustomer"
HorizontalAlignment="Stretch"
Content="New Customer"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5">
<interactivity:Interaction.Behaviors>
<core:EventTriggerBehavior EventName="Click">
<core:ChangePropertyAction TargetObject="NewCustomerBlade"
PropertyName="IsOpen"
Value="True" />
</core:EventTriggerBehavior>
</interactivity:Interaction.Behaviors>
</Button>
<Button x:Name="CloseCustomerWindow"
HorizontalAlignment="Stretch"
Content="Close Window"
VerticalAlignment="Stretch"
Height="45"
Background="#FF007ACC"
Width="auto"
Foreground="#FFCDCDCD"
Margin="5" />
</StackPanel>
<StackPanel Margin="0,5"
Orientation="Horizontal">
<StackPanel Width="1307">
<GridView Name="CustomerList"
ItemsSource="{Binding CustomerDatabase}"
SelectedItem="{Binding SelectedCustomer, Mode=TwoWay}"
Width="auto"
Height="685"
Background="#FF2E2B2B"
BorderThickness="3"
BorderBrush="#FF707070"
Margin="10,0,8,0">
<GridView.Header>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="8" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0"
Grid.Column="0"
Text="First Name"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="1"
Text="Last Name"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="2"
Text="Enail"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="3"
Text="Phone Number"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
<TextBlock Grid.Row="0"
Grid.Column="4"
Text="Organization"
TextAlignment="Center"
FontWeight="Bold"
FontSize="16"
Margin="7,0,0,1"
Foreground="#FFCDCDCD" />
</Grid>
</GridView.Header>
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="Margin"
Value="7,0,0,1" />
<Setter Property="HorizontalAlignment"
Value="Center" />
</Style>
</GridView.ItemContainerStyle>
<GridView.ItemTemplate>
<DataTemplate x:DataType="models:Customer">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
<ColumnDefinition Width="254" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="45" />
</Grid.RowDefinitions>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="0">
<TextBlock Text="{x:Bind CustomerFirstName}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,8,0,-2"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="1">
<TextBlock Text="{x:Bind CustomerLastName}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,10,0,0"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="2">
<TextBlock Text="{x:Bind CustomerEmail}"
Foreground="#FFCDCDCD"
Width="auto"
Margin="0,8,0,0"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="3">
<TextBlock Text="{x:Bind CustomerPhoneNumber}"
Foreground="#FFCDCDCD"
Width="auto"
TextAlignment="Center" />
</Border>
<Border BorderThickness="2"
BorderBrush="#FF575454"
Grid.Column="4">
<TextBlock Text="{x:Bind OrganizationName}"
Foreground="#FFCDCDCD"
Width="auto"
TextAlignment="Center" />
</Border>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</StackPanel>
</StackPanel>
</StackPanel>
</controls:BladeItem>
<controls:BladeItem x:Name="CustomerAddBlade"
Width="1320"
Background="#FF1E1E1E"
Height="835"
TitleBarVisibility="Collapsed"
IsOpen="False"
BorderThickness="5"
BorderBrush="#FF707070">
<StackPanel>
<TextBlock Text="Add Customer"
FontSize="48"
Foreground="#FFCDCDCD"
Height="56"
Margin="15"
HorizontalAlignment="Left" />
<StackPanel HorizontalAlignment="Center"
Width="409">
<StackPanel Margin="10,0">
<TextBlock Text="Email Address:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="EmailBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="First Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="FirstNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="Last Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="LastNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<StackPanel Margin="10,0">
<TextBlock Text="Phone Number:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="PhoneBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<CheckBox x:Name="BusinessCustomerCheckbox"
Content="Business Customer"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Height="21"
Margin="10"
Foreground="#FFCDCDCD" />
<StackPanel x:Name="OrgNamePanel"
Visibility="Visible"
Margin="10,0">
<TextBlock Text="Organization Name:"
FontSize="22"
Foreground="#FFCDCDCD"
Height="36"
Margin="3" />
<TextBox x:Name="BusinessNameBox"
TextWrapping="Wrap"
Height="50"
Margin="3" />
</StackPanel>
<Button x:Name="AddNewCustomerButton"
HorizontalAlignment="Stretch"
Content="Add Customer"
VerticalAlignment="Stretch"
Height="60"
Background="#FF007ACC"
Foreground="#FFCDCDCD"
Margin="20">
</Button>
</StackPanel>
</StackPanel>
</controls:BladeItem>
</controls:BladeView>
</Grid>
在用户控件中使用行为时，是否需要做一些不同的事情？或者它们不能在用户控件中使用？
我可以在后面的代码中为用户控件创建属性来处理打开和关闭我的 blades 但感觉它会更草率并且需要比 8 行更多的代码使用行为所需的代码。
编辑： 添加我收到的异常以防其他人搜索类似错误。
"Cannot find a property named Windows.UI.Xaml.PropertyPath on type String."
听起来您的事件处理程序没有得到正确解析。如果您在与控件不同的 class 中指定点击处理程序，则可以使用 x:bind.
将其连接起来查看以下摘自 MSDN
的代码<ComboBox x:Name="ColorComboBox" ItemsSource="{x:Bind SettingsVM.Colors}" SelectionChanged="{x:Bind SettingsVM.ColorDefinitionChanged(SelectedItem)}" /> void ColorDefinitionChanged(ColorDefinition def) { ... }
我认为 TargetObject="NewCustomerBlade" 行不通。你能试试TargetObject="{Binding ElementName=NewCustomerBlade}"吗？
您还需要将此行为置于用户控件之外，NewCustomerBlade 控件所在的位置。确保按钮和控件在同一页面上。