WPF - adding item of different template in listview

Question

When item on my ListView is clicked I want to make another one of different template to appear below it. I have defined templates in Window.Resources and I thought about changing ItemTemplate when item is clicked, adding new item and changing it to default template, but i am using list with my ListView as ItemsSource it showed only one template and only because (for now) both of them are the same in bindings. What should i do?

Code:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        List<TransactionItem> item = new List<TransactionItem>();
        item.Add(new TransactionItem() { category="Deska", index="2", name="Topielec"});
        List<object> transactions = new List<object>();
        transactions.Add(new Transaction() { name = "Maciek", surname = "Chludzinski", begin = "Dzisiaj 20:14", end = "Dzisiaj 21:14", price = "240 zł", remain = "42 minuty", items = item });
        obMainListBinding.ItemTemplate = (DataTemplate)this.FindResource("LessClientTemplate");
        MessageBox.Show(obMainListBinding.ItemTemplate.DataTemplateKey.ToString());
        transactions.Insert(1, new Transaction() { name = "jhadf", surname = "Chludzhadfi", begin = "Dhad:14", end = "Dzisiajah", price = "240 zł", remain = "42 minuty"});
        obMainListBinding.ItemTemplate = (DataTemplate)this.FindResource("BasicTransactionTemplate");
        obMainListBinding.ItemsSource = transactions;

    }

    public class Transaction
    {
        public string name { get; set; }
        public string surname { get; set; }
        public string begin { get; set; }
        public string end { get; set; }
        public string remain { get; set; }
        public string price { get; set; }
        public List<TransactionItem> items { get; set; }
    }

    public class TransactionItem
    {
        public string category { get; set; }
        public string index { get; set; }
        public string name { get;set; }
    }

    public class LessTransaction
    {
        public string name { get; set; }
        public string surname { get; set; }
        public string begin { get; set; }
        public string end { get; set; }
        public string remain { get; set; }
        public string price { get; set; }
    }

}

XAML:

<Window
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" mc:Ignorable="d" x:Class="SurfManager.MainWindow"
Title="MainWindow" Height="524.5" Width="1078">
<Window.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded"/>
</Window.Triggers>
<Window.Resources>
    <DataTemplate x:Key="BasicTransactionTemplate">
        <Grid MaxHeight="50">
            <Grid.RowDefinitions>
                <RowDefinition Height="41*"/>
                <RowDefinition Height="42*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0*"/>
                <ColumnDefinition Width="192*"/>
                <ColumnDefinition Width="234*"/>
                <ColumnDefinition Width="189*"/>
                <ColumnDefinition Width="443*"/>
            </Grid.ColumnDefinitions>
            <Label Name="Name" Content="{Binding name}" Grid.RowSpan="1" Grid.Column="1" Grid.ColumnSpan="1" />
            <Label Name="Surname" Content="{Binding surname}"  Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="1"/>
            <Label Name="Begin" Content="{Binding begin}" Grid.Column="2"/>
            <Label Name="End" Content="{Binding end}" Grid.Row="1" Grid.Column="2"/>
            <Label Name="Remain" Content="{Binding remain}" Grid.Column="3"/>
            <Label Name="Price" Content="{Binding price}" Grid.Row="1" Grid.Column="3"/>
            <ListView Name="lvItems" ItemsSource="{Binding items}" Grid.Column="4" Grid.RowSpan="2">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding category}" />
                            <TextBlock Text=", Nr" />
                            <TextBlock Text="{Binding index}" />
                            <TextBlock Text="{Binding name}" />
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="LessClientTemplate">
        <Grid MaxHeight="50">
            <Grid.RowDefinitions>
                <RowDefinition Height="41*"/>
                <RowDefinition Height="42*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0*"/>
                <ColumnDefinition Width="192*"/>
                <ColumnDefinition Width="234*"/>
                <ColumnDefinition Width="189*"/>
                <ColumnDefinition Width="443*"/>
            </Grid.ColumnDefinitions>
            <Label Name="Name" Content="{Binding name}" Grid.RowSpan="1" Grid.Column="1" Grid.ColumnSpan="1" />
            <Label Name="Surname" Content="{Binding surname}"  Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="1"/>
            <Label Name="Begin" Content="{Binding begin}" Grid.Column="2"/>
            <Button Name="End" Content="{Binding end}" Grid.Row="1" Grid.Column="2"/>
        </Grid>
    </DataTemplate>
</Window.Resources>
<Grid>
<TabControl>
    <TabItem Header="Obecne Wypożyczenia" Background="#FFF40AFF" Foreground="Black" BorderBrush="#FF8C8E94" OpacityMask="White">
        <Grid Background="#FFE5E5E5">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition/>
            </Grid.RowDefinitions>
            <ListView Name="obMainListBinding" BorderThickness="0" ItemTemplate="{StaticResource BasicTransactionTemplate}">
                    <ListView.Resources>
                        <Style TargetType="ListViewItem">
                            <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="ListViewItem">
                                        <Border Background="{TemplateBinding Background}">
                                            <ContentPresenter />
                                        </Border>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </ListView.Resources>
             </ListView>
        </Grid>
    </TabItem>
    <TabItem Header="Baza Klientow">
        <Grid Background="#FFE5E5E5">
                <ListView BorderThickness="0" >

                    <ListViewItem Height="66" Background="Red">
                        <Grid Background="Black" >
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="0*"/>
                                <ColumnDefinition Width="0*"/>
                                <ColumnDefinition Width="0*"/>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="0*"/>
                                <RowDefinition Height="0*"/>
                                <RowDefinition Height="0*"/>
                            </Grid.RowDefinitions>
                        </Grid>
                    </ListViewItem>
                </ListView>
            </Grid>
    </TabItem>
    <TabItem Header="TabItem" HorizontalAlignment="Left" Height="35.293" VerticalAlignment="Top" Width="57.32" Margin="-2,-2,0,-13.333">
            <Button Content="Button"  Height="100" Margin="430,174,430,173"/>
        </TabItem>
</TabControl>

We won't know how to make the changes to your existing code base without seeing your original code. Please post [a minimal example of what needs to change](http://stackoverflow.com/help/mcve), and fully explain what needs to be modifed. — gunr2171, Jun 26 '14 at 16:31
Does it have to be another item with a different template? Can you not encapsulate what you need in a UserControl that changes it's appearance based on if the item is the selected item or not, and host that in the original item template? — JimBobBennett, Jun 26 '14 at 16:37
@JimBobBennett I dont think it would work as application would use quite a lot of ram in real use and I want it to use the least possible amount. — user2980291, Jun 26 '14 at 16:45

score 1 · Accepted Answer · edited May 23 '17 at 11:49

1

You could try to use the ItemTemplateSelector property:

How do I use a ItemTemplateSelector together with a HeaderTemplate in a WPF ListView?

and(or) triggers that change Template:

How to change control template from Style.Triggers

EDIT

To use TemplateSelector you could add some dummy property on your items(or wrap them) that will allow you to discern new item from old.

...
public Int32 Generation
{
    get ...
}

public class GenerationTypeSelector : DataTemplateSelector
  {
    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        var transaction = (TransactionItem)item;
        if (transaction .Generation == 0)
            return Gen0Template;
        else
            return Gen1Template;
    }
  }

edited May 23 '17 at 11:49

Community

1
1

answered Jun 26 '14 at 16:39

Eugene Podskal

10,270
5
31
53

Well i read about ItemTemplateSelector when i looked for answer but i think the main problem here is the fact i am using ItemsSource to populate ItemView so I cant change template when different (this new one) object appears. – user2980291 Jun 26 '14 at 16:48
The main problem is that you make all your manipulation in the code-behind file, and not in XAML. MVVM is not a dogma or universal solution, but you should give it a try. – Eugene Podskal Jun 26 '14 at 16:55
Worked with some edits, thanks. I am trying to do it while making this app for friend but I used Win Forms for some time and old habits die hard ^^. Also I still have problems understanding many concepts so most of time I am utterly confused. – user2980291 Jun 26 '14 at 17:28
I had and to some extent have the same difficulties now. Any really new platform or technology demand an overhaul in thinking. It is just the way things are - everything cannot be the same. It may be daunting, but at least it is never boring. – Eugene Podskal Jun 26 '14 at 17:32
WPF and MVVM have steep learning curve, but at least when you get hooked on them the WinForms will start to look unwieldly and cumbersome. – Eugene Podskal Jun 26 '14 at 17:35
They already look like relics but for now WPF looks like quantum physics. – user2980291 Jun 26 '14 at 17:56
WPF has difficult to grasp concepts - event bubbling, templates, dependency properties, but its object model is more or less solid and direct(omitting few moments). It just requires a bit different form of thinking than the WinForms, and anything that stirs our brains and improves quality of our work is definitely useful. – Eugene Podskal Jun 26 '14 at 18:48

WPF - adding item of different template in listview

1 Answers1