user1189352
user1189352

Reputation: 3875

Adding other items to Custom ListBox/ListView and how can user add their own items

Trying to learn WPF and it's driving me nuts. So I'm trying to do something like the picture that I posted here. But I can only get the combobox, text, checkbox on top of each other and not side by side... How can I do this?

Also I figured out how to add "text" to the listbox if the user pushes a button, but I need it so that when they add text from a textbox. The combobox, checkbox, and button get added with it. But I have no idea how to do that.

I'm assuming I have to make a class for those things. But how do I do that if I'm coding it in XAML? This WPF is confusing for me.

<ListBox HorizontalAlignment="Left" Height="195" Margin="25,345,0,0" VerticalAlignment="Top" Width="650">
                <ListBoxItem>
                        <StackPanel Orientation="Horizontal" Height="45"> <!--Stacks Items Horizontally-->
                            <ComboBox Width="100" Height="30">
                                <ComboBoxItem IsSelected="True">DirecTV</ComboBoxItem>
                                <ComboBoxItem>Hyundai</ComboBoxItem>
                                <ComboBoxItem>None</ComboBoxItem>
                            </ComboBox>
                            <TextBox Width="445" Height="30" Text="Follow RedZone on Twitter" VerticalContentAlignment="Center"/>
                            <CheckBox IsChecked="True" VerticalAlignment="Center">
                                <CheckBox.LayoutTransform>
                                    <ScaleTransform ScaleX="1.5" ScaleY="1.5"></ScaleTransform>
                                </CheckBox.LayoutTransform>
                            </CheckBox>
                        <Button Content="Delete"  Height="Auto" Width="Auto" HorizontalAlignment="Right" VerticalAlignment="Top" VerticalContentAlignment="Top"/>
                    </StackPanel>
                </ListBoxItem>
            </ListBox>

Upvotes: 0

Views: 1195

Answers (1)

jimSampica
jimSampica

Reputation: 12410

Define a class to hold the items

public class myListBoxRow
{
    public string comboBoxSelection {get;set;}
    public string textBlockText {get;set;}
    public bool checkBoxChecked {get;set;}
}

Now define a ObservableCollection or List somewhere (typically in a ViewModel)

public ObservableCollection myListBoxRows<myListBoxRow> {get;set}

Then bind the ListBox's ItemsSource to your collection

<ListBox ItemsSource="{Binding myListBoxRows}" .../>

To get the controls you want, define an ItemTemplate for your ListBox

<ListBox ItemsSource="{Binding myListBoxRows}" ...>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <ComboBox ItemsSource="{Binding cboItems}" Width="50" SelectedItem="{Binding comboBoxSelection}" />
                <TextBlock Text="{Binding textBlockText}"></TextBlock>
                <CheckBox IsChecked="{Binding checkBoxChecked}" />
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Research MVVM in WPF as there are tons of examples of this everywhere. The key part that will tie that together for you is the datatemplate for your listbox/listview

Upvotes: 3

Related Questions