This is a migrated thread and some comments may be shown as answers.

ListBox scrolling when item is clicked when using smooth scrolling

1 Answer 416 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Nathan
Top achievements
Rank 1
Nathan asked on 15 Oct 2014, 04:33 PM
I'm trying to use the RadListBox control because of it's drag and drop features, but am running into a problem that only shows up when smooth scrolling is enabled.  I've enabled smooth scrolling using the method posted elsewhere on the forums by setting the CanContentScroll property to False.

However, when this is enabled, and I click on an item in the list, the whole list scrolls up so that the clicked item is at the bottom of the viewable area.  The resulting effect is that over several clicks, I've scrolled to the top of the list.  This behavior doesn't happen when the ListBox scrolls by item (when CanContentScroll is not set to false).

I do not need the selection functionality of the ListBox, and I'm using it just for the built-in drag and drop features.  If there's another way to do the drag and drop without a Listbox, that's fine.

I need the ListBox to not scroll when an item is clicked, or another solution to the problem.  Without a resolution, I cannot use smooth scrolling, as this will be a deal-breaker for any user.

Here's a link to a project that will show the behavior: https://dl.dropboxusercontent.com/u/3583840/ProgrammingSolutions/TelerikDragAndDropTest2.zip

The project is for the Q1 2014 release, but I've tried the most recent one and I get the same results.

1 Answer, 1 is accepted

Sort by
0
Kalin
Telerik team
answered on 17 Oct 2014, 02:32 PM
Hello Nathan,

We are already aware of the explained issue. However what I can suggest you would to remove the ScrollViewer.CanContentScroll="False" from the ListBox definition. And instead of that to apply different ItemsPanel, named ListBoxPanel, which supports the desired functionality. So the ListBox should look as shown below:

<telerik:RadListBox
        x:Name="ActivityContainer"
        Focusable="False"
        ItemsSource="{Binding Items}">
    <telerik:RadListBox.DragVisualProvider>
        <telerik:ScreenshotDragVisualProvider />
    </telerik:RadListBox.DragVisualProvider>
    <telerik:RadListBox.DragDropBehavior>
        <telerik:ListBoxDragDropBehavior />
    </telerik:RadListBox.DragDropBehavior>
 
    <telerik:RadListBox.ItemTemplate>
        <DataTemplate DataType="{x:Type local:Item}">
            <StackPanel Background="WhiteSmoke" Height="120">
                <TextBlock Text="{Binding Name}"/>
            </StackPanel>
        </DataTemplate>
    </telerik:RadListBox.ItemTemplate>
 
    <telerik:RadListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <telerik:ListBoxPanel />
        </ItemsPanelTemplate>
    </telerik:RadListBox.ItemsPanel>
</telerik:RadListBox>

Hope this helps.

Regards,
Kalin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
ListBox
Asked by
Nathan
Top achievements
Rank 1
Answers by
Kalin
Telerik team
Share this question
or