Amin
Amin

Reputation: 172

Horizontal Listbox item

I want to create an horizontal ListBox item like the suggestion of the keyboard enter image description here

<ScrollViewer ZoomMode="Enabled"
          HorizontalScrollBarVisibility="Visible"
          VerticalScrollBarVisibility="Visible"
          HorizontalScrollMode="Enabled"
          VerticalScrollMode="Enabled">
            <StackPanel Orientation="Horizontal">
                <ListBox  Grid.Row="1"  Name="RecognizedListBox">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <TextBlock Foreground="Black"  Text="{Binding}" />
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </StackPanel>
        </ScrollViewer>

when I click on the button, it must show the list horizontal this is the code for showing the list

private async void RecognizeAllClick(object sender, RoutedEventArgs e)
    {

        resultword = recognizerShared.RecognizeStrokesList(InkCanvas.Children.ToList(), false);
        if (resultword.Equals(null) && resultword.Equals(""))
        {
            var messageBox = new MessageDialog("Text could not be recognized.");
            messageBox.Commands.Add(new UICommand("Close"));
            await messageBox.ShowAsync();
            resultword = null;
        }
        RecognizedListBox.ItemsSource = null;
        RecognizedListBox.ItemsSource = resultword;
    }

But it shows like that enter image description here

After I add Height="30" to listbox, it shows me just one suggestion, and the other word none enter image description here

Solved

<ListBox x:Name="RecognizedListBox" >
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Vertical">
                        <TextBlock Width="30" Foreground="Black"  Text="{Binding}" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
        </ListBox>

enter image description here

Upvotes: 0

Views: 329

Answers (2)

Lars N
Lars N

Reputation: 114

Try something like this:

<ListBox>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        ...
    </ListBox.ItemTemplate>
</ListBox>

Upvotes: 2

ΩmegaMan
ΩmegaMan

Reputation: 31596

Try specifying a specific size for the control so it doesn't expand

<ListBox  Height=30 Name="RecognizedListBox"/>

Or have the grid set the row height to a non * or auto sizing such

<Grid.RowDefinitions>
        <RowDefinition Height="30" /> 

Upvotes: 1

Related Questions