Drag and Drop appointment on touch laptops

[Abhishek]

Hello amazing Telerik folks! 

Let me start by sharing my appreciation for your wonderful products; in case you already didn't know it, they are REALLY nice :)

Coming to the issue that I'm trying to resolve -

Summary - How to enable touch drag and drop for appointments?

Details -

We've incorporated the RadScheduler control in a solution that we're building. The solution involves a lot of dragging and dropping including moving appointments around on the scheduler.

Everything is working as we expect when we drag and drop using the mouse. 

While testing our solution on touch enabled laptops, we see that most of the functionality (clicking on an appointment, scrolling etc.) works with touch, but when we try to touch and drag and drop appointments on the scheduler (from say 8 am to 10 am) we're unable to do so, the appointment just does not move and it looks like the scheduler tries to scroll instead. Please let us know that the best practices/ways are to enable this. 

Thanks in advance!

Abhishek

 

[Dimitar]

Hello Abhishek,

I am glad to share with you that RadScheduler provides a Mobile render mode which is optimized for mobile devices. It would allow much easier touch interaction and a cleaner design, suitable for smaller screens. You should set the control's RenderMode property to Auto to enable adaptive rendering - mobile for mobile devices and Lightweight for desktop ones.

In order to get RenderMode="Auto" running properly, you need to add a reference to the Telerik.Web.Device.Detection.dll as specified in the RadDeviceDetectionFramework help article.
This framework would allow controls to detect if the respective page is viewed on a mobile device or a desktop browser and they would use the appropriate render mode accordingly.

​Mobile render mode is activated only if the respective page is opened on a mobile device browser. If you make your browser window smaller, it still remains a desktop browser, not a mobile one. You need to open your page on an iOS or Android device for example, in order to trigger mobile device recognition. Otherwise, the RadDeviceDetectionFramework still recognizes that you are using a desktop browser and triggers the RadScheduler Lightweight render mode.

And last, but not least, I would suggest you to take a look at the Mobile and Responsiveness help article which you may find useful for further references.

Regards,
Dimitar
Telerik

[Kevin]

Dear Telerik, I am also having this issue but I am using a WinForm. What reference should I add to get this option to set to Auto or allow dragging on a windows mobile device running windows 10.

[Dess | Tech Support Engineer, Principal]

Hello, Kevin, 

Note that RadScheduler from the WinForms suite has a completely different implementation compared to the respective control in the ASP.NET AJAX suite. In order to achieve drag and drop functionality on touch devices by using the pan gesture, you can refer to the following code snippet. Note that this is just a sample implementation and it may not cover all possible cases. Feel free to modify it in a way which suits your requirement best:

public class CustomScheduler : RadScheduler
{
    public override string ThemeClassName
    {
        get
        {
            return typeof(RadScheduler).FullName;
        }
    }

    protected override void OnPanGesture(Telerik.WinControls.PanGestureEventArgs args)
    {
        base.OnPanGesture(args);
        AppointmentElement a = this.SchedulerElement.ElementTree.GetElementAtPoint(args.Location) as AppointmentElement;
        if (a != null)
        {
            if (args.IsBegin)
            {
                this.Capture = true;
                this.SchedulerElement.DragDropBehavior.BeginDrag((SchedulerVisualElement)a.Parent, a);
            }
            if (this.SchedulerElement.DragDropBehavior.State == Telerik.WinControls.RadServiceState.Working)
            {
                this.SchedulerElement.DragDropBehavior.DoMouseMove(this.ElementTree.Control.PointToScreen(args.Location));
            }
            if (args.IsEnd)
            {
                this.SchedulerElement.DragDropBehavior.EndDrag();
            }
            args.Handled = true;
        }
    }
}

I hope this information helps. 

Off topic, if you have any further questions regarding the WinForms suite, I would kindly ask you to use the relevant forum: https://www.telerik.com/forums/winforms Thank you for your understanding.

Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik