WPF XAML Listbox to display 1 Item from static Resource

Question

I need the XAML code in Blend for WPF Listbox that only displays 1 Item from a static resource list.

I tried the following code but it displayed "Cinetique_GUI,Mode: instead of the Names from the Resource. What am I doing wrong? How do I get it to display one of the names?

<Window x:Class="Cinetique_GUI.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Cinetique_GUI"
        mc:Ignorable="d"
        Title="Cinetique  GUI" Height="1080" Width="1920" WindowState="Maximized" >
    <Window.Resources>
        <x:Array x:Key="modes" Type="{x:Type local:Mode}">
            <local:Mode Name="Tom"/>
            <local:Mode Name="Ken"/>
            <local:Mode Name="Jen"/>
        </x:Array>
    </Window.Resources>
    <DockPanel LastChildFill="False">
        <StackPanel DockPanel.Dock="Top">
            <Image Source="/Images/Logo-White-Crop.png" Stretch="Fill" Margin="5" Width="300" Height="100" HorizontalAlignment="Left"  />
            <StackPanel Orientation="Horizontal">
                <Label Content="System Status:" Margin="10,10,10,10" FontSize="30" FontWeight="Bold"/>
                <Label Name="statusLBL" Content="Ready" Margin="10,10,10,10" FontSize="30" FontWeight="Bold" Foreground="Red"/>
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Label Content="Mode:" Margin="10,10,10,10" FontSize="30" FontWeight="Bold"/>
                <ListBox SelectionMode="Single" MaxHeight="30"
                    ItemsSource="{Binding}" DataContext="{StaticResource modes}"
                    ScrollViewer.VerticalScrollBarVisibility="Visible">
                </ListBox>
            </StackPanel>
        </StackPanel>
        <StackPanel DockPanel.Dock="Bottom" Orientation="Horizontal" HorizontalAlignment="Center" Margin="20,20,20,20">
            <Button Content="Stop" Margin="20,10,40,10" FontSize="36" FontWeight="Bold" Width="120"/>
            <Button Content="Quit" Margin="40,10,20,10" FontSize="36" FontWeight="Bold" Width="120"/>
        </StackPanel>
    </DockPanel>
</Window>

Answer 1

Hi,@Don Baechtel. Welcome Microsoft Q&A.

Not sure what your Mode class is. I'm using the following code that shows the name.

Method 1:

Xaml:

<StackPanel Orientation="Horizontal">
                <Label Content="Mode:" Margin="10,10,10,10" FontSize="30" FontWeight="Bold"/>
                <ListBox SelectionMode="Single" MaxHeight="130"  ItemsSource="{Binding}" DataContext="{StaticResource modes}"
                    ScrollViewer.VerticalScrollBarVisibility="Visible">
                   
                </ListBox>
            </StackPanel>

Code:

  public class Mode
    {
        public string Name { get; set; }
        public Mode() { }
        public override string ToString()
        {
            return Name;
        }
    }

The result:

Update:

Method 2: As Limitless Technology said, you could use templates and it works fine.

 <StackPanel Orientation="Horizontal">
                <Label Content="Mode:" Margin="10,10,10,10" FontSize="30" FontWeight="Bold"/>
                <ListBox SelectionMode="Single" MaxHeight="130"  ItemsSource="{Binding}" DataContext="{StaticResource modes}"
                    ScrollViewer.VerticalScrollBarVisibility="Visible">
                    
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding Name}" />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </StackPanel>

Mode:

  public class Mode
    {
        public string Name { get; set; }
        public Mode() { }
       
    }

The result:

-

If the response is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 2

Hi. Thank you for your question and reaching out. I’d be more than happy to help you with your query

To display only one of the names from the resource list, you need to set the ListBox's ItemTemplate property. The ItemTemplate property tells the ListBox which property of each item in the list should be used for display. In your case, you want it to display the Name property of the Mode class, so you can use the following XAML code to set the ItemTemplate:

<ListBox SelectionMode="Single" MaxHeight="30" ItemsSource="{Binding}" DataContext="{StaticResource modes}" ScrollViewer.VerticalScrollBarVisibility="Visible"> <ListBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding Name}" /> </DataTemplate> </ListBox.ItemTemplate> </ListBox>

If the reply was helpful, please don’t forget to upvote or accept as answer, thank you.