[UWP] [XAML设计]选择项目/更改ID？ [英] [UWP][XAML Design] Selection of items/changing ID?
本文介绍了[UWP] [XAML设计]选择项目/更改ID？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我无法根据从上面的列表框中选择的内容获取有关页面的详细信息部分的信息。例如，我的类别名称是基于光盘的媒体应该在
代码类别中显示DBM1。此外，我如何在我的列表框中在xaml中放置当前所选项目周围的红色选择区域？ 我的问题主要是xaml问题，但这里是xaml代码，这样你就可以看到我的绑定错误：
I am having a problem getting the information on the details section of a page to change according to what is selected from the list box above it. For example, my category name is disc based media which should display DBM1 in category codes. In addition, how can I put a red selection area around the currently selected item from my listbox in xaml? My problems are mostly xaml problems but here is the xaml code so you can see what I am doing wrong with my bindings:
<Page
x:Class="UIE.CategoryDetails"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UIE"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Page.Resources>
<!--<CollectionViewSource x:Name="Categories"
Source="{Binding CategoryList}"/>
<CollectionViewSource x:Key="ID" ></CollectionViewSource>-->
<CollectionViewSource x:Name="CategoryInformation" Source="{x:Bind CategoryInfo}"/>
<CollectionViewSource x:Name="CategoryCD" Source="{x:Bind CategoryCode}"/>
<!--<CollectionViewSource x:Key="CodeID"></CollectionViewSource>-->
<CollectionViewSource x:Key="CategoryID">
</CollectionViewSource>
<Style TargetType="TextBlock">
<Setter Property="FontSize" Value="15"/>
<Setter Property="FontWeight" Value="Bold"/>
</Style>
<Style TargetType="ListBox">
<Setter Property="FontSize" Value="15"/>
</Style>
<Style TargetType="ContentControl">
<Setter Property="FontSize" Value="15"/>
</Style>
<!--ItemContainerStyle with the Trigger for Selected-->
<Style x:Key="RedGlowItemContainer" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border Background="LightGray"
CornerRadius="8"
BorderThickness="3"
x:Name="IconBorder"
Margin="8,4,8,4" >
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Page.Resources>
<Page.BottomAppBar>
<CommandBar Name="Appbarbottom">
<CommandBar.SecondaryCommands>
<AppBarButton x:Name="Edit" Label="Edit" IsEnabled="True" />
</CommandBar.SecondaryCommands>
<CommandBar.Content>
<Grid/>
</CommandBar.Content>
<AppBarButton x:Name="BtnSave" Label="Save" Icon="Save" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="Auto" d:IsLocked="True"/>
<AppBarButton x:Name="BtnReturnMain" Label="Finished" Icon="Back" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="Auto" />
</CommandBar>
</Page.BottomAppBar>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<!-- Horizontal Categories view -->
<StackPanel x:Name="CTitle" Height="31" HorizontalAlignment="Stretch" VerticalAlignment="Top">
<TextBlock Name="Title" Text="Categories" Width="96.146" Height="31" HorizontalAlignment="Center" >
</TextBlock>
</StackPanel>
<!-- backup items source: ItemsSource="{Binding Source={StaticResource CategoryInformation}}"-->
<RelativePanel x:Name="CategoryList" RelativePanel.Below="CTitle" RelativePanel.AlignBottomWith="CategoryDetails" Height="161" VerticalAlignment="Top">
<ListBox x:Name="CategoryName" RelativePanel.AlignTopWithPanel="False" RelativePanel.AlignBottomWithPanel="True" RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" ItemContainerStyle="{StaticResource RedGlowItemContainer}" ScrollViewer.HorizontalScrollMode="Auto" ScrollViewer.HorizontalScrollBarVisibility="Visible" Margin="0,-139.2,0,0.2">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Width="150" Height="100">
<Image Width="65" Height="75" Source="UIE;component/Assets/u.png" /> <!-- Source="UIE;component/Assets/u.png" remove this comment and add back in order to add picture support Source="{Binding Picture}" /-->
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Bottom" Width="150" Height="20" Text="{Binding CategoryName}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</RelativePanel>
<!--Category Details view-->
<!--DataContext="{Binding Source={StaticResource CategoryCD}}"-->
<!--For CategoryNText TextBlock: DataContext="{Binding Source={Binding CategoryInformation}}"-->
<RelativePanel x:Name="CategoryDetails" DataContext="{Binding Source={StaticResource CategoryCD}}" RelativePanel.AlignTopWith="CategoryList" Margin="0,161,0,45" d:LayoutOverrides="TopPosition, BottomPosition">
<TextBlock Name="CategoryNText" TextAlignment="Center" d:DataContext="{Binding Source={d:DesignInstance Type={Binding CategoryInformation}, CreateList=True,IsDesignTimeCreatable=True}}" Text="{Binding CategoryName}" RelativePanel.AlignTopWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignLeftWithPanel="True"></TextBlock>
<!--Source="{Binding Picture, Source={StaticResource Categories}}"-->
<Image Name="PictureD" Width="100" Height="100" RelativePanel.AlignLeftWithPanel="True" Margin="10,25,-121,-136"/>
<TextBlock Name="CategoryCText" Text="Category Code:" Margin="145,25,0,0" />
<!--Margin="0,20,30,0"-->
<TextBlock x:Name="CategoryC" Text="{Binding CategoryCode}" Width="100" Margin="260,25,0,0" />
<!--Margin="225,30,0,0" -->
<TextBlock Name="Description" Text="{Binding CategoryDescription, Source={StaticResource CategoryInformation}}" RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignBottomWithPanel="True" FontSize="15" FontWeight="Bold" Margin="0,-95,0,0" />
<TextBox x:Name="TxtCategoryCode" MaxLength="4" Margin="365,20,-457,-45" TextWrapping="Wrap" Text="TextBox" Visibility="Collapsed"/>
<TextBox x:Name="TxtDescription" RelativePanel.AlignBottomWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignLeftWithPanel="True" Height="100" TextWrapping="Wrap" Text="TextBox" Visibility="Collapsed"/>
</RelativePanel>
</Grid>
</Page>
注意：CategoryCD链接到CategoryCode数据库表。我正在使用Microsoft的EntityFramework.SQLite库来读取数据库。所有类都设置正确xaml代码应该是我应用程序的这一部分唯一需要担心的事情。
Note: CategoryCD links to CategoryCode DB table. I am using EntityFramework.SQLite library from Microsoft for reading from database. Classes are all setup correctly xaml code should be about the only thing left to worry about in this section of my application.
一旦消除了不可能的事物，无论遗骸多么不可能，一定是真相。 - 夏洛克·福尔摩斯。轻声说话并带上一根大棒 - 西奥多罗斯福。恐惧导致愤怒，愤怒导致仇恨，仇恨导致痛苦 - 尤达。博客 -
http://www.computerprofessions.us
Once you eliminate the impossible, whatever remains, no matter how improbable, must be the truth. - Sherlock Holmes. speak softly and carry a big stick - theodore roosevelt. Fear leads to anger, anger leads to hate, hate leads to suffering - Yoda. Blog - http://www.computerprofessions.us
推荐答案
>>例如，我的类别名称是基于光盘的媒体，应该在类别中显示DBM1代码。
我看不出XAML中的绑定代码有什么问题。 您能否提供 " CategoryInformation" 和
" CategoryCD" 如下？ 我想知道 " CategoryInformation" 和" CategoryCD"。
ObservableCollection<CategoryCodeDB> CategoryCode;
CategoryCode = new ObservableCollection<CategoryCodeDB>
{
new CategoryCodeDB {CategoryCode="DBM1" }
};您可以尝试设置"CategoryCode"绑定模式为"TwoWay"。
You can try to set the "CategoryCode" binding mode to "TwoWay".
<TextBlock x:Name="CategoryC"
Width="100"
Margin="260,25,0,0"
Text="{Binding CategoryCode,Mode=TwoWay}" />
>>此外，我如何在列表框中的当前所选项目周围放置一个红色选择区域 xaml？
这可以通过改变"SelectedPointerOver"来改变。视觉状态。在可视状态下更改目标边框的BorderBrush属性。
更新您的"RedGlowItemContainer"样式模板如下所示，你会得到你想要的效果。
<Style x:Key="RedGlowItemContainer" TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Grid x:Name="LayoutRoot"
Background="{TemplateBinding Background}"
BorderThickness="{TemplateBinding BorderThickness}">
<Grid.Resources>
<Style x:Key="BaseContentPresenterStyle" TargetType="ContentPresenter">
<Setter Property="FontFamily" Value="XamlAutoFontFamily" />
<Setter Property="FontWeight" Value="SemiBold" />
<Setter Property="FontSize" Value="15" />
<Setter Property="TextWrapping" Value="Wrap" />
<Setter Property="LineStackingStrategy" Value="MaxHeight" />
<Setter Property="TextLineBounds" Value="Full" />
<Setter Property="OpticalMarginAlignment" Value="TrimSideBearings" />
</Style>
<Style x:Key="BodyContentPresenterStyle"
BasedOn="{StaticResource BaseContentPresenterStyle}"
TargetType="ContentPresenter">
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="FontSize" Value="15" />
</Style>
</Grid.Resources>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="PointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="Pink" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListLowBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListMediumBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Selected">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListAccentLowBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPointerOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="BorderBrush">
<DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListAccentMediumBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedPressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBackground" Storyboard.TargetProperty="Background">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightListAccentHighBrush}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="PressedBackground"
Margin="8,4,8,4"
Background="LightGray"
BorderThickness="3"
Control.IsTemplateFocusTarget="True"
CornerRadius="8" />
<ContentPresenter x:Name="ContentPresenter"
Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
ContentTransitions="{TemplateBinding ContentTransitions}"
Style="{StaticResource BodyContentPresenterStyle}"
TextWrapping="NoWrap" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
结果：
这篇关于[UWP] [XAML设计]选择项目/更改ID？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
