Search code examples
c#wpfmvvmdependency-propertiesattached-properties

Attached property attached only on the first user control instance


Following Josh Smith example on mvvm workspaces (customers view), I have a mainwindow and a mainwindowviewmodel which contains an ObservableCollection of "ChatTabViewModel":

internal class FriendsListViewModel : ObservableObject
{
    #region bound properties
    private ICollectionView viewfriends;
    private ObservableCollection<ChatTabViewModel> _chatTab; 
    ...
    #endregion
}

I have an area dedicated to this collection in the xaml like that :

<ContentControl Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Content="{Binding Path=ChatTabs}" ContentTemplate="{StaticResource ChatTabsTemplate}" />

And in my resources dictionary:

<DataTemplate DataType="{x:Type vm:ChatTabViewModel}">
    <View:ChatTabView />
</DataTemplate>

<DataTemplate x:Key="ClosableTabItemTemplate">
    <DockPanel>
      <Button
        Command="{Binding Path=CloseCommand}"
        Content="X"
        Cursor="Hand"
        DockPanel.Dock="Right"
        Focusable="False"
        FontFamily="Courier"
        FontSize="9"
        FontWeight="Bold"
        Margin="0,1,0,0"
        Padding="0"
        VerticalContentAlignment="Bottom"
        Width="16" Height="16"
        />
      <ContentPresenter
        Content="{Binding Path=Caption, Mode=OneWay}"
        VerticalAlignment="Center">
      </ContentPresenter>
    </DockPanel>
</DataTemplate>

<DataTemplate x:Key="ChatTabsTemplate">
    <TabControl
      IsSynchronizedWithCurrentItem="True"
      ItemsSource="{Binding}"
      ItemTemplate="{StaticResource ClosableTabItemTemplate}"
      Margin="4"/>
</DataTemplate>

On user event I add a new ChattabViewModel in my collection and the view related to it appears in the main window.

But when I tried to add an attached property on a scrollbar in the ChattabView, this property will attach only on the first ChattabViewModel instance, the other tabs won't be bound to the attached property. Here's the ChattabView XAML:

 <ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Row="0">
  <ItemsControl ItemsSource="{Binding Messages}" View:ItemsControlBehavior.ScrollOnNewItem="True">
  <ItemsControl.ItemTemplate>
    <DataTemplate>
        <TextBox IsReadOnly="True" TextWrapping="Wrap" Text="{Binding Path=DataContext, RelativeSource={RelativeSource Self}}" />
    </DataTemplate>
  </ItemsControl.ItemTemplate>    
</ItemsControl>
</ScrollViewer>

and the code of the attached property:

namespace GtalkOntre.View
{
    /// <summary>
    /// Util class to scroll down when a new message is added.
    /// </summary>
    /// <remarks>attached property called ScrollOnNewItem that when set to true hooks into the INotifyCollectionChanged events of the itemscontrol items source and upon detecting a new item, scrolls the scrollbar to it.</remarks>
    public class ItemsControlBehavior
    {
        static Dictionary<ItemsControl, Capture> Associations = new Dictionary<ItemsControl, Capture>();

        public static bool GetScrollOnNewItem(DependencyObject obj)
        {
            return (bool)obj.GetValue(ScrollOnNewItemProperty);
        }

        public static void SetScrollOnNewItem(DependencyObject obj, bool value)
        {
            obj.SetValue(ScrollOnNewItemProperty, value);
        }          

        public static DependencyProperty ScrollOnNewItemProperty =
            DependencyProperty .RegisterAttached(
                "ScrollOnNewItem",
                typeof(bool),
                typeof(ItemsControlBehavior),
                new UIPropertyMetadata(false, OnScrollOnNewItemChanged));

        public static void OnScrollOnNewItemChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var mycontrol = d as ItemsControl;
            if (mycontrol == null) return;
            bool newValue = (bool)e.NewValue;
            if (newValue)
            {
                mycontrol.Loaded += MyControl_Loaded;
                mycontrol.Unloaded += MyControl_Unloaded;
            }
            else
            {
                mycontrol.Loaded -= MyControl_Loaded;
                mycontrol.Unloaded -= MyControl_Unloaded;
                if (Associations.ContainsKey(mycontrol))
                    Associations[mycontrol].Dispose();
            }
        }

        static void MyControl_Unloaded(object sender, RoutedEventArgs e)
        {
            var mycontrol = (ItemsControl)sender;
            Associations[mycontrol].Dispose();
            mycontrol.Unloaded -= MyControl_Unloaded;
        }

        static void MyControl_Loaded(object sender, RoutedEventArgs e)
        {
            var mycontrol = (ItemsControl)sender;
            var incc = mycontrol.Items as INotifyCollectionChanged;
            if (incc == null) return;
            mycontrol.Loaded -= MyControl_Loaded;
            Associations[mycontrol] = new Capture(mycontrol);
        }

        class Capture : IDisposable
        {
            public ItemsControl mycontrol { get; set; }
            public INotifyCollectionChanged incc { get; set; }

            public Capture(ItemsControl mycontrol)
            {
                this.mycontrol = mycontrol;
                incc = mycontrol.ItemsSource as INotifyCollectionChanged;
                incc.CollectionChanged +=incc_CollectionChanged;
            }

            void incc_CollectionChanged(object sender, NotifyCollectionChangedEventArgs e)
            {                
                if (e.Action == NotifyCollectionChangedAction.Add)
                {
                    ScrollViewer sv = mycontrol.Parent as ScrollViewer;
                    sv.ScrollToBottom();
                }
            }

            public void Dispose()
            {
                incc.CollectionChanged -= incc_CollectionChanged;
            }
        }
    }
}

So why is the attached property only bound once, on the first "chattabview" occurence of the chattabviewmodel collection? and therefore, working only on the first chattabviewmodel. When I close them all, the attached property will unbind itself on the last instance of chattabviewmodel, and when I add a new first chattabviewmodel, the property will bind correctly. So it triggers only on the first instance and last instance of the "chattabviewmodel" collection of mainwindowviewmodel.

After a week of searching, I'm a little desperate now...

So far my hypothesis is : the problem might be related to the way I set the view to my viewmodel in dictionary resources. The view might be shared and the first scrollbar only might react. I tried to add an x:Shared = false attribute on the DataTemplate tag but it didn't change anything.


Solution

  • Are you sure there are different instances of your ChatTabView being created?

    I believe WPF's TabControl re-uses the existing template if it's the same instead of creating a new one, and simply replaces the DataContext behind it.

    So it would only create one copy of your ChatTabView and switching tabs is replacing the DataContext behind the ChatTabView to a different item in the collection.