如何以编程方式在数据绑定的ListBox控件中选择一个项目 [英] How to programatically select an item in a data bound ListBox control

问题描述

我有一个自定义样式的ListBox:

I have a custom styled ListBox:

<phone:PhoneApplicationPage.Resources>
    <Style x:Key="LayoutsListItemStyle" TargetType="ListBoxItem">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBoxItem">
                    <Grid Height="170" Width="170" Margin="0,0,20,20">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="LayoutStates">
                                <VisualState x:Name="BeforeUnloaded"/>
                                <VisualState x:Name="BeforeLoaded"/>
                                <VisualState x:Name="AfterLoaded"/>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="SelectionStates">
                                <VisualState x:Name="Unselected"/>
                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="border">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <Thickness>4</Thickness>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedUnfocused"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border x:Name="border" Width="170" Height="170" BorderBrush="{StaticResource PhoneAccentBrush}">
                            <Grid>
                                <Image Source="{Binding ThumbnailPath}" Width="170" Height="170" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            </Grid>
                        </Border>

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</phone:PhoneApplicationPage.Resources>

和

<ListBox x:Name="LayoutsList" ItemContainerStyle="{StaticResource LayoutsListItemStyle}" ItemsSource="{Binding}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <toolkit:WrapPanel Orientation="Horizontal" MaxWidth="410" />
         </ItemsPanelTemplate>
     </ListBox.ItemsPanel>
 </ListBox>

在所选列表框项目上方显示边框(当手动选择时).我希望列表框中的项目像单选按钮一样工作，并且希望列表框中的第一项默认处于选中状态.

which displays a border over the selected listbox item (when selected manually). I would like the items in the listbox to act like radio buttons and the first item in the listbox to be selected by default.

我正在尝试像这样设置列表框的SelectedIndex:

I'm trying to set the SelectedIndex of the listbox like this:

private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
    // Loads a list of available Layouts to a ListBox

    XDocument layoutSummary = XDocument.Load("Content/LayoutSummary.xml");

    var layouts =
        from elem in layoutSummary.Descendants("ComicLayout")
        select new ComicLayout
        {
            Name = (string)elem.Attribute("Name").Value,
            FriendlyName = (string)elem.Attribute("FriendlyName").Value,
            ThumbnailPath = "Content/LayoutIcons/" + (string)elem.Attribute("Name").Value + ".png"
        };

    LayoutsList.DataContext = layouts;

    LayoutsList.SelectedIndex = 1;
}

但是它似乎没有任何作用.

but it doesn't seem to be doing anything.

如何以编程方式选择数据绑定ListBox中的第一个(或任何其他)项目?

How can I programatically select the first (or any other) item in a data bound ListBox?

编辑

事实证明，SelectedIndex实际上可以工作，我可以对其进行控制，并根据需要将数据从ListBox中拉出.

It turns out that SelectedIndex actually works and I can control it and pull the data out of the ListBox as I wish.

所以我想问题是:

如何以编程方式触发列表框项上的VisualState更改?

How to I trigger VisualState change on the listbox item programatically?

推荐答案

我设法通过挂接到ListBox控件上的LayoutUpdated事件来实现这一目标

I've managed to achieve this by hooking up to LayoutUpdated event on the ListBox control

<ListBox x:Name="LayoutsList" ItemContainerStyle="{StaticResource LayoutsListItemStyle}" ItemsSource="{Binding}" LayoutUpdated="LayoutsList_LayoutUpdated">

和LayoutsList_LayoutUpdated():

private void LayoutsList_LayoutUpdated(object sender, EventArgs e)
{
    if ((ListBoxItem)LayoutsList.ItemContainerGenerator.ContainerFromIndex(LayoutsList.SelectedIndex) != null)
    {
        ListBoxItem selectedItem = (ListBoxItem)LayoutsList.ItemContainerGenerator.ContainerFromIndex(LayoutsList.SelectedIndex);

        VisualStateManager.GoToState(selectedItem, "Selected", true);

    }
}

在我看来，这有点像蛮力，但它仍然有效，并且会一直循环播放，直到找到所需的元素为止.

Seems a little bit like a brute-force to me but it works and it will keep looping until it can find the element it needs.

希望能帮助到某人

这篇关于如何以编程方式在数据绑定的ListBox控件中选择一个项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！