Disapearing Items for ListBox when ItemContainerStyle is set

7 posts, 1 answers
  1. Steffen
    Steffen avatar
    4 posts
    Member since:
    Sep 2016

    Posted 29 Sep 2016 Link to this post

    We got problem (or maybe an issue) in the RadListBox with enabled Drag&Drop. In our Project we simply want to Drag&Drop Customers from a RadListBox to a RadScheduleView. For displaying the customer business objects into the list we use a simple data-template.

    If we compile the project without the line 33 into the MainWindow.xaml the items are shown into the listbox. If we use the line, the items disappear, but the listbox could be used as drop-target from the calendar.

    The problem occurred with the telerik wpf version 2016.3.914.45.NoXaml (folder-name of the library linked to the project) and the office 2016 style. We found out, that the problem was not reproducible with an older telerik version or another theme.

    Is there any workaround or fix? Thank you for your help.


    I attached the demo-project with the problem as zip-file with a password, for making it possible for you to reproduce the problem I attached the whole telerik classes. Because this the file is password covered. If you want to unpack the file, please request the password per e-mail.



    01.<Application x:Class="TestApp1.App"
    03.             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    04.             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    05.             StartupUri="MainWindow.xaml">
    06.    <Application.Resources>
    07.        <ResourceDictionary>
    08.            <ResourceDictionary.MergedDictionaries>
    09.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/System.Windows.xaml" />
    10.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.xaml" />
    11.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Input.xaml" />
    12.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.Navigation.xaml" />
    13.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.RibbonView.xaml" />
    14.                <ResourceDictionary Source="/Telerik.Windows.Themes.Office2016;component/Themes/Telerik.Windows.Controls.ScheduleView.xaml" />
    15.            </ResourceDictionary.MergedDictionaries>
    16.        </ResourceDictionary>
    17.    </Application.Resources>




    01.<Window x:Class="TestApp1.MainWindow"
    04.        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    05.        xmlns:local="clr-namespace:TestApp1"
    06.        xmlns:drag="clr-namespace:Telerik.Windows.DragDrop.Behaviors;assembly=Telerik.Windows.Controls"
    07.        Title="MainWindow" Height="350" Width="525">
    09.    <Window.Resources>
    10.        <Style x:Key="DraggableListBoxItem" TargetType="telerik:RadListBoxItem">
    11.            <Setter Property="telerik:DragDropManager.AllowCapturedDrag" Value="True" />
    12.            <Setter Property="telerik:DragDropManager.AllowDrag" Value="True" />
    13.        </Style>
    14.        <DataTemplate x:Key="CustomerItem">
    15.            <TextBlock Foreground="Blue" Text="{Binding Name}" />
    16.        </DataTemplate>
    17.    </Window.Resources>
    19.    <Window.DataContext>
    20.        <local:ViewModel/>
    21.    </Window.DataContext>
    23.    <Grid>
    24.        <Grid.ColumnDefinitions>
    25.            <ColumnDefinition Width="5*"/>
    26.            <ColumnDefinition Width="5*"/>
    27.        </Grid.ColumnDefinitions>
    29.        <telerik:RadListBox x:Name="ListBox"
    30.                            AllowDrop="False"
    31.                            ItemsSource="{Binding CustomersSource}"
    32.                            ItemTemplate="{StaticResource CustomerItem}"
    33.                            ItemContainerStyle="{StaticResource DraggableListBoxItem}">
    34.            <telerik:RadListBox.DragVisualProvider>
    35.                <telerik:ScreenshotDragVisualProvider />
    36.            </telerik:RadListBox.DragVisualProvider>
    37.            <telerik:RadListBox.DataConverter>
    38.                <local:AppointmentToCustomerConverter />
    39.            </telerik:RadListBox.DataConverter>
    40.            <telerik:RadListBox.DragDropBehavior>
    41.                <telerik:ListBoxDragDropBehavior AllowReorder="True" telerik:DragDropManager.TouchDragTrigger="TapAndHold" />
    42.            </telerik:RadListBox.DragDropBehavior>
    43.        </telerik:RadListBox>
    45.        <telerik:RadScheduleView x:Name="scheduleView"
    46.                                 Grid.Column="1"
    47.                                 AppointmentsSource="{Binding AppointmentsSource}">
    48.            <telerik:RadScheduleView.ViewDefinitions>
    49.                <telerik:WeekViewDefinition />
    50.            </telerik:RadScheduleView.ViewDefinitions>
    51.            <telerik:RadScheduleView.DragDropBehavior>
    52.                <local:ScheduleViewDragDropBehavior />
    53.            </telerik:RadScheduleView.DragDropBehavior>
    54.        </telerik:RadScheduleView>
    55.    </Grid>




    01.using System;
    02.using System.Collections;
    03.using System.Collections.Generic;
    04.using System.Collections.ObjectModel;
    05.using System.Linq;
    06.using System.Text;
    07.using Telerik.Windows.Controls;
    08.using Telerik.Windows.Controls.ScheduleView;
    09.using Telerik.Windows.DragDrop.Behaviors;
    11.namespace TestApp1
    13.    public class Customer
    14.    {
    15.        public string Name { get; set; }
    16.    }
    18.    public class ViewModel : ViewModelBase
    19.    {
    20.        private ObservableCollection<Customer> customersSource;
    21.        private ObservableCollection<Appointment> appointmentsSource;
    23.        public ViewModel()
    24.        {
    25.            this.CustomersSource = new ObservableCollection<Customer> {
    26.                new Customer{ Name = "Customer 1" }, new Customer{ Name = "Customer 2" }, new Customer{ Name = "Customer 3" },
    27.                new Customer{ Name = "Customer 4" }, new Customer{ Name = "Customer 5" }, new Customer{ Name = "Customer 6" },
    28.                new Customer{ Name = "Customer 7" }, new Customer{ Name = "Customer 8" }, new Customer{ Name = "Customer 9" },
    29.            };
    30.            this.AppointmentsSource = new ObservableCollection<Appointment>();
    31.        }
    33.        public ObservableCollection<Customer> CustomersSource
    34.        {
    35.            get { return customersSource; }
    36.            set { customersSource = value; this.OnPropertyChanged("CustomersSource"); }
    37.        }
    39.        public ObservableCollection<Appointment> AppointmentsSource
    40.        {
    41.            get { return appointmentsSource; }
    42.            set { appointmentsSource = value; this.OnPropertyChanged("AppointmentsSource"); }
    43.        }
    44.    }
    45.    public class ScheduleViewDragDropBehavior : Telerik.Windows.Controls.ScheduleViewDragDropBehavior
    46.    {
    47.        public object customers { get; set; }
    48.        public override IEnumerable<IOccurrence> ConvertDraggedData(object data)
    49.        {
    50.            if (DataObjectHelper.GetDataPresent(data, typeof(Customer), false))
    51.            {
    52.                var customers = DataObjectHelper.GetData(data, typeof(Customer), true) as IEnumerable;
    53.                if (customers != null)
    54.                {
    55.                    var newApp = customers.OfType<Customer>().Select(c => new Appointment { Subject = c.Name });
    56.                    return newApp;
    57.                }
    58.            }
    59.            return base.ConvertDraggedData(data);
    60.        }
    61.    }
    62.    public class AppointmentToCustomerConverter : DataConverter
    63.    {
    64.        public override string[] GetConvertToFormats()
    65.        {
    66.            return new string[] { typeof(ScheduleViewDragDropPayload).FullName, typeof(Customer).FullName };
    67.        }
    68.        public override object ConvertTo(object data, string format)
    69.        {
    70.            var payload = DataObjectHelper.GetData(data, typeof(ScheduleViewDragDropPayload), false) as ScheduleViewDragDropPayload;
    71.            if (payload != null)
    72.            {
    73.                var customers = payload.DraggedAppointments;
    74.                return customers.OfType<Appointment>().Select(a => new Customer { Name = a.Subject });
    75.            }
    76.            return null;
    77.        }
    78.    }


  2. Steffen
    Steffen avatar
    4 posts
    Member since:
    Sep 2016

    Posted 29 Sep 2016 in reply to Steffen Link to this post

    I am sorry, the zip-file was probably to large as attachment. If somebody need this, I'll upload or mail it.
  3. Answer
    Geri avatar
    62 posts

    Posted 30 Sep 2016 Link to this post

    Hi Steffen,

    Thank you very much for the code you provided.
    Using it I was able to recreate the scenario you describe.

    I believe the reason the RadListBox items are not visible is that the BasedOn property is not set in the "DraggableListBoxItem" style that is targeting RadListBoxItem. In a nutshell, if you want to keep the default style of any element and change explicitly only a few things, you should use BasedOn property. Otherwise, only the defined values will be applied to the targeted element and nothing more.

    More about this property you can read here:

    That explains why removing line 33 makes the items visible again - if no style is applied, RadListBox items appear with their default style.

    Please try to add BasedOn property as shown below and let us know whether it makes any difference:

    <Style x:Key="DraggableListBoxItem" TargetType="telerik:RadListBoxItem" BasedOn="{StaticResource RadListBoxItemStyle}" />

    I tested it with older themes and observed the same behavior, so maybe something in your project has changed. It would be helpful if you could check that.

    In case the suggested approach does not help you, we would greatly appreciate the sample runnable project you mention, just to be sure we're on the same page and we'll investigate further.

    Looking forward to your reply.

    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  4. Steffen
    Steffen avatar
    4 posts
    Member since:
    Sep 2016

    Posted 30 Sep 2016 Link to this post

    Hi Geri,

    thank you! This solves the problem for me.

    But here is something interesting: I have here a project without the BasedOn-property which works pretty good, but why? If I change the item-type from string to customer or whatever it continues working. But if I remove the linked telerik dll's and use the telerik-wizard to rebind the libraries it stops working.

    Download the sample-project here.

    Tanks for your support!


  5. Geri
    Geri avatar
    62 posts

    Posted 03 Oct 2016 Link to this post

    Hello Steffen,

    I'm glad everything is ok now.

    The BasedOn property works as I described only when Implicit Styles are used, i.e. NoXAML assemblies. When XAML assemblies are referenced, all components of the style of the targeted element are automatically retrieved, and there is no need to base your style on any other style. Furthermore, all additional changes declared in the style would still be applied.

    If I understand your scenario right, in the project you sent us, XAML assemblies were used initially, but the Wizard has referenced NoXAML dlls to your project and that is the reason the RadListBox items are not visible without changing the code.

    You can check the type of the assemblies after you have used the wizard - go to the assemblies folder of your application, right click on a dll, select Properties, then go to Details tab - if the assembly is NoXAML it would be indicated with braces in the File Description.

    Hope this helps.
    Should you have any further questions or concerns, please don't hesitate to contact us.

    Telerik by Progress
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. David
    David avatar
    13 posts
    Member since:
    Feb 2012

    Posted 26 Feb Link to this post

    This fix helped me immensely. I have been looking for the solution to this problem for two weeks.

    Can someone check the documentation and please update it would have saved me a lot of time.





  7. Dinko
    Dinko avatar
    1078 posts

    Posted 02 Mar Link to this post

    Hi David,

    We appreciated the provided feedback. This behavior is described in our Styling the Controls help article. Still, you are right that we can add this to the mentioned article. That is why I have logged an item to our backlog to update the RadListBox-> Overview article to mention the case with implicit style and NoXAML scenario. 

    I have updated your Telerik Points for the provided feedback.

    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top