Drag and drop autoscroll

[Erik]

Is it possible to automatically scroll a RadListBox when dragging an item over the top or bottom of the ListBox?

[George]

Hello,

Yes, this functionality is supported out of the box with the RadListBox control. Please, download our latest internal build and let me know if this suits your needs.

All the best,
George
the Telerik team

[Erik]

In the code below I'm using a RadListBox, but it's doesn't autoscroll when dragging to the edges of the window. Am I missing something?

<Window
    x:Class="ListBoxTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    Title="MainWindow" Height="500" Width="525">
    <telerik:RadListBox
        ItemsSource="{Binding MyCollection}">
        <telerik:RadListBox.ItemTemplate>
            <DataTemplate>
                <TextBlock
                    Height="50"
                    Width="100"
                    Background="LightBlue"
                    telerik:DragDropManager.AllowCapturedDrag="True"
                    Text="{Binding .}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Center"/>
            </DataTemplate>
        </telerik:RadListBox.ItemTemplate>
        <telerik:RadListBox.DragDropBehavior>
            <telerik:ListBoxDragDropBehavior/>
        </telerik:RadListBox.DragDropBehavior>
    </telerik:RadListBox>
</Window>

using System.Collections.ObjectModel;

namespace ListBoxTest
{
    public partial class MainWindow
    {
        public MainWindow()
        {
            InitializeComponent();

            DataContext = this;

            MyCollection = new ObservableCollection<string>
            {
                "test text 1",
                "test text 2",
                "test text 3",
                "test text 4",
                "test text 5",
                "test text 6",
                "test text 7",
                "test text 8",
                "test text 9",
                "test text 10",
                "test text 11",
                "test text 12",
                "test text 13",
                "test text 14",
                "test text 15",
                "test text 16",
                "test text 17",
                "test text 18",
                "test text 19",
                "test text 20",
            };
        }

        public ObservableCollection<string> MyCollection { get; private set; }
    }
}

[George]

Hello Erik,

 
The autoscrolling feature is introduced with our internal build from 6.08 (August 6). If you use older binaries, it won't work. Please, note that using the given xaml, you need to click on the text in the ListBoxItems in order to drag the item. I prepared a sample with the binaries from 6.08 and add some code. You can find the project attached. Please, note that you can uncomment the Window resources in order to allow mouse capturing over the ListBox item, not only over the text.

Hope this helps.

All the best,
George
the Telerik team

[Erik]

Thanks autoscroll works with that build :)

[Shaun]

Hi George,

I have taken a look at your sample above as I am having issues with auto scrolling on a RadListBox using the latest 2016 Q2 release.

The WPF_Listbox.exe within the zip debug folder works as stated above however if I rebuild the project with the latest release it doesn't work any more.

Could the example project above be updated to work the latest release so I can see how to implement if in my own project.

Regards,

Shaun

[Yana]

Hello Shaun,

Actually, there is a known issue regarding drag and scroll functionality of RadListBox - scrolling down does not work as expected when the items have height more than 22px.  So, in the concrete case, you will have to change the ItemTemplate and remove the height property of the Textbox:

<DataTemplate>
    <TextBlock
        Width="100"
        Background="LightBlue"
        telerik:DragDropManager.AllowCapturedDrag="True"
        Text="{Binding .}"
        VerticalAlignment="Center"
        HorizontalAlignment="Center"/>
</DataTemplate>

Please try it and let us know whether it is ok now.

Regards,
Yana
Telerik

[Shaun]

Hi Yana,

I have tried with the example project and this works as expected now. However where I need to implement this in my project the list box items are always taller than 22px. Is there any work around or any ETA for a proper fix?

Regards,

Shaun

[Yana]

Hi Shaun,

I am afraid that at the moment we cannot commit to any timeframe for fixing this issue, however, I have logged it in our public Feedback Portal, where you could track its progress, here is the link:
http://feedback.telerik.com/Project/143/Feedback/Details/191916-scrolling-down-while-dragging-does-not-work-for-radlistboxitems-with-height-more

If you follow the item, you will receive a notification as soon as we start working on it.

Regards,
Yana
Telerik