RADTileView control's scroll offset needed to be changed

7 posts, 0 answers
  1. Peeyush
    Peeyush avatar
    4 posts
    Member since:
    Aug 2018

    Posted 29 Aug 2018 Link to this post

    Hi,

    The scrolling in the RADTileView control is not working out nicely, the offset on a single button click or mousewheel roll makes the page scroll more than needed.So assuming a page is displaying 25 lines a screen, after scrolling minimum it would be the 30th (i.e. not the 26 line) at the top. Thus the user would miss some content and would need to scroll back.

     

    After going through the forums I have been able to fix this for the mousewheel using the code

    private void ScrollViewer_MouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
    {
        ScrollViewer scv = this.ctrlRadTileView.ChildrenOfType<ScrollViewer>().FirstOrDefault();
        scv.ScrollToVerticalOffset(scv.VerticalOffset - e.Delta);
        e.Handled = true;
    }

    However when the scrollbar buttons are clicked they still continue to have the wrong scroll effect. Is there any way to handle the scrollbar button clicked event or change the vertical offset property?

    There is the ScrollViewer.ScrollInfo.VerticalOffset property but the scroll info object is not accessible.

  2. Peeyush
    Peeyush avatar
    4 posts
    Member since:
    Aug 2018

    Posted 29 Aug 2018 in reply to Peeyush Link to this post

    Saw no way to edit so posting further here.

    I am also curious, it seems to me that the scrolling by default is being set as 376 instead of 120, where 120 is the value provided by mousewheel (e.delta in code above). Any reason for ignoring the value provided by the client?

  3. Vladimir Stoyanov
    Admin
    Vladimir Stoyanov avatar
    500 posts

    Posted 31 Aug 2018 Link to this post

    Hello Peeyush,

    Thank you for the provided code. 

    I am assuming that you are referring to the fact the default RadTileView scrolling behavior is to scroll to the next RadTileViewItem or row of RadTileViewItems. This is implemented internally by the TileViewPanel class when scrolling with the mouse or clicking the scrollbar buttons. That is why the default delta scroll value is modified and this behavior is by design. 

    That said if you want to handle the click event of the scrollbar buttons, in order to customize the RadTileView scrolling behavior, you can check out the following topic where a similar question was discussed: clicked repeatbutton of Scrollbars in ScrollViewer.

    I hope you find this helpful.

    Regards,
    Vladimir Stoyanov
    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.
  4. Peeyush
    Peeyush avatar
    4 posts
    Member since:
    Aug 2018

    Posted 03 Sep 2018 in reply to Vladimir Stoyanov Link to this post

    Hi Vladmir,

    Thanks for your reply. 

    I understand that the RADTileView should scroll o next RadTileViewItem, but in my case next item is a multiline textbox and it scrolls into the middle of the textbox (i.e. skips the starting row of the textbox.).

     

    The link you provided is able to find some buttons, but for some reason is it finding 12 buttons (LineUp, LineDown, Pageup, PageDown) * 3. Also on trying to hook these buttons to click event handler it does not work. 

     

    I am pasting the code I tried below, let me know if I am doing something wrong.

     

    // 3 dictionary as I said it is finding similar named buttons thrice (pageup/down, lineup/down)
    Dictionary<string, RepeatButton> buttons = new Dictionary<string, RepeatButton>();
    Dictionary<string, RepeatButton> buttons1 = new Dictionary<string, RepeatButton>();
    Dictionary<string, RepeatButton> buttons2 = new Dictionary<string, RepeatButton>();
     
     
    // trying to get the handle on the window loaded event
    private void RadWindow_Loaded(object sender, RoutedEventArgs e)
            {
                GetRepeatButtons(this.ctrlRadTileView.ChildrenOfType<ScrollViewer>().FirstOrDefault());
                RepeatButton btn = buttons2["PageUp"]; // test click event
                btn.Click += Btn_Click;
            }
     
     void GetRepeatButtons(DependencyObject parent)
            {
                int count = VisualTreeHelper.GetChildrenCount(parent);
                for (int i = 0; i < count; i++)
                {
                    DependencyObject child = VisualTreeHelper.GetChild(parent, i);
                    RepeatButton btn = child as RepeatButton;
                    if (btn == null)
                    {
                        GetRepeatButtons(child);
                    }
                    else
                    {
                        string name = ((RoutedCommand)btn.Command).Name;
                        if (!buttons.ContainsKey(name))
                            buttons.Add(name, btn);
                        else if (!buttons1.ContainsKey(name))
                            buttons1.Add(name, btn);
                        else if (!buttons2.ContainsKey(name))
                            buttons2.Add(name, btn);
                    }
                         
                }
            }
     
  5. Vladimir Stoyanov
    Admin
    Vladimir Stoyanov avatar
    500 posts

    Posted 05 Sep 2018 Link to this post

    Hello Peeyush,

    Thank you for the update. 

    Please, allow me to state that in general the RadTileView should always scroll to the beginning of the next item. If you can share some runnable code which we can use in order to reproduce the scrolling to the middle of the item, please do so and we will investigate it on our side. 

    As for the RepeatButtons, it is possible that you have not added the handler to the correct button. In general each scrollbar has 4 repeat buttons(one on each side and one on each side between the thumb and the other repeat buttons). You can check this out with a xaml inspection tool like Snoop. That said I am not certain why there are 3 sets of repeat buttons on your side. May I ask you to try handling the Click event of the RepeatButtons in the following way:

    scrollViewer.AddHandler(RepeatButton.ClickEvent, new RoutedEventHandler(handlerMethod));
     
    private void handlerMethod(object sender, RoutedEventArgs e)
    {
                 
    }

    This way the event handler should be called for all of the RepeatButtons. Please, give this a try and let me know how it goes.

    Regards,
    Vladimir Stoyanov
    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.
  6. Peeyush
    Peeyush avatar
    4 posts
    Member since:
    Aug 2018

    Posted 06 Sep 2018 in reply to Vladimir Stoyanov Link to this post

    Thanks Vladimir,

    I will try and see if I can quickly create a blank project which replicates the issue.

    About your suggestion to add the event handler. It works, but I am running into a couple of issues:

    1. Where to add the eventhandler, If I try to add the event handler in the code-behind constructor after the call to InitializeComponent, I get a null reference, so assuming that the scrollviewer construction is not complete somehow.

    2. Within the event handler, I am still not able to distinguish if the up or down button was clicked, to handle the scroll I will need to figure the direction.

     

    Regards,

    Peeyush

  7. Martin Ivanov
    Admin
    Martin Ivanov avatar
    2242 posts

    Posted 11 Sep 2018 Link to this post

    Hello Peeyush,

    You can attach the event handler after the scrollviewer is initialized, but when this will happen depends on your setup. If you want to attach to the built-in scrollvewer of RadTileView, you can subscribe to the tileview's Loaded event and use the visual tree helpers to get the scrollviewer and then attach the handler. Alternatively, you can use the EventManager.RegisterClassHandler() method which you can add in the MainWindow constructor for example.

    To distinguish the repeat buttons you can check their Name properties. The top button name is set to "DecreaseRepeat" and the down button is named "IncreaseRepeat". Note that this may vary across the different themes. The best way to find the names of the button would be to use a XAML spying tool as Snoop for example. Also, in some themes the buttons don't have Name set. If this is the case you will need to use different approach. For example, you can check the sibling element of the button and if its the Track control that means the button is up or down element. Then you can check if the button is defined after or before the Track in the parent's Grid Children collection.

    Regards,
    Martin Ivanov
    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