views:

36

answers:

1

I've a ListView bound to an ObservableCollection<Foo>. On selecting a ListViewItem I display the details of the SelectedItem(Foo members) in a container. It works fine.

Now all I want is to display the details just next to the SelectedItem. ie, If I select the fourth ListViewItem then the Container's Top should be the same as the ListViewItem's Top. How would I sync their position provided it should create any problem even while scrolling the List.

P.S: Scrollbars are hidden

+1  A: 

Does the detail need to be in a separate container? I may be misunderstanding your example, but I would have thought you could achieve what you wanted by adding the details section to the item template for your list items and then hiding/showing it based on the IsSelected flag:

<ListView ItemsSource="{Binding}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <DockPanel>
                    <ContentControl DockPanel.Dock="Right" Name="DetailsControl" Content="{Binding}" ContentTemplate="{StaticResource DetailsTemplate}" />
                    <TextBlock Text="{Binding}" />
                </DockPanel>
                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding (ListViewItem.IsSelected), RelativeSource={RelativeSource FindAncestor, AncestorType=ListViewItem}}" Value="False">
                        <Setter TargetName="DetailsControl" Property="Visibility" Value="Hidden" />
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Even if you aren't after exactly this behaviour, I imagine you could get close to what you want by replacing the ContentControl from the example with something else (e.g. a Popup)

Steve Greatrex
@Steve Greatrex: This will increase the height of ListViewItem also, when I select it. That is why I put the details in another container outside the ListView.
Veer
In that case, could you put the extra content in a Popup, and set the Popup.IsOpen property in the DataTrigger? That way you can position the Popup more or less wherever you want relative to the ListViewItem without affecting the height. The only downside of this is that it might obscure other content...
Steve Greatrex
@Steve Greatrex: Great Hint!!! Popup. Thanks for that.
Veer