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

RadDiagram keyboard modifiers

11 Answers 78 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
John Harrison
Top achievements
Rank 1
John Harrison asked on 29 Oct 2014, 08:45 AM
Hi,

If you hold down the control key, the diagram goes into pan mode.

However on OSX these modifier keys do not work.

Is there a way to either a) make the control key work on OSX in silverlight, or b) use a substitute key (for instance holding down space).

Otherwise we are going to need to add a feature for the user to change the cursor mode, which hurts productivity.

Kind Regards

11 Answers, 1 is accepted

Sort by
0
John Harrison
Top achievements
Rank 1
answered on 31 Oct 2014, 03:10 PM
Any thoughts on this?

It cripples the usability of the rad diagram control as the control key modifier is used for other operations (nudging an element).

It looks like we are at this rate going to have to disassemble the dlls to figure out how the keyboard modifier is hooked in.

Shame there is no way (as far as we can tell) to use a html bridge to forward the key presses.

Thanks
0
Pavel R. Pavlov
Telerik team
answered on 31 Oct 2014, 03:10 PM
Hello John,

It seems that the ASCII code of the Ctrl key in OSX is different from the one that we are internally watching in the RadDiagram. In order to overcome this issue you can subscribe to the KeyDown event and in its handler you can check which key is pressed. If you detect that the corresponding Ctrl key is held pressed you can activate the PanTool of the RadDiagram. Along with this activation you can set a boolean flag indicating that you have activated the pan tool.

Furthermore, on kye up you will be able to check that flag and if it is set you will be able to activate the pointer tool of the RadDiagram (the default tool).

Please give this approach a try and let us know if you need any further assistance.

Regards,
Pavel R. Pavlov
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.

 
0
John Harrison
Top achievements
Rank 1
answered on 03 Nov 2014, 08:43 AM
Hi,

Unfortunately it appears the app is not even getting the keydown event. I'm guessing it is getting intercepted at the os/browser level.

Is there a way to use some kind of html bridge a bit like with mouse wheel events to get the ctrl key presses?

Failing that we need a way to override the shortcut keys.

We did try doing if key down == space, set pan mode, if key up == space go back to default mode.
But this resulted in a bit of a weird behaviour from the users perspective with the UI jumping a bit.

Thanks

0
John Harrison
Top achievements
Rank 1
answered on 04 Nov 2014, 02:31 PM
We are doing the following.

If you hold and press Ctrl on a PC it works, if you hold and press Space, and try and pan around it seems to move a bit then just stick!

Thoughts?

public void OnKeyDownHandler(object sender, KeyEventArgs e)
{
    
    if (e.Key == Key.Ctrl)
    {
        //    DiagramCanvas.ActiveTool = MouseTool.PanTool;
        SetInPanMode(true);
    }

    if (!PanningToolActive && e.Key == Key.Space)
    {
        SetInPanMode(true);
    }
}

public void OnKeyUpHandler(object sender, KeyEventArgs e)
{
    if (e.Key == Key.Ctrl && PanningToolActive)
    {
        //    DiagramCanvas.ActiveTool = MouseTool.PointerTool;
        SetInPanMode(false);
    }

    if (PanningToolActive && e.Key == Key.Space)
    {
        PanningToolActive = false;
        SetInPanMode(false);
    }
}


public void SetInPanMode(bool inPan)
{
    PanningToolActive = inPan;
    DiagramCanvas.ActiveTool = inPan ? MouseTool.PanTool : MouseTool.PointerTool;
    DiagramCanvas.SelectionMode = inPan ? SelectionMode.None : SelectionMode.Single;

    // have to do this so when panning and click on an item it actually pans :/
    if (inPan)
    {
        DiagramCanvas.ServiceLocator.Register<IHitTestService>(new BlockSelectionHitTest());
    }
    else
    {
        DiagramCanvas.ServiceLocator.Register<IHitTestService>(new HitTestService(DiagramCanvas));
    }
}
0
John Harrison
Top achievements
Rank 1
answered on 04 Nov 2014, 02:33 PM
When pressing Ctrl on a PC pan works fine, if we hold and press Space (PC or Mac) panning works slightly then gets "stuck".

This is what we are doing:


public void OnKeyDownHandler(object sender, KeyEventArgs e)
{
    
    if (e.Key == Key.Ctrl)
    {
        SetInPanMode(true);
    }

    if (!PanningToolActive && e.Key == Key.Space)
    {
        SetInPanMode(true);
    }
}

public void OnKeyUpHandler(object sender, KeyEventArgs e)
{
    if (e.Key == Key.Ctrl && PanningToolActive)
    {
        SetInPanMode(false);
    }

    if (PanningToolActive && e.Key == Key.Space)
    {
        SetInPanMode(false);
    }
}


public void SetInPanMode(bool inPan)
{
    PanningToolActive = inPan;
    DiagramCanvas.ActiveTool = inPan ? MouseTool.PanTool : MouseTool.PointerTool;
    DiagramCanvas.SelectionMode = inPan ? SelectionMode.None : SelectionMode.Single;

    // have to do this so when panning and click on an item it actually pans :/
    if (inPan)
    {
        DiagramCanvas.ServiceLocator.Register<IHitTestService>(new BlockSelectionHitTest());
    }
    else
    {
        DiagramCanvas.ServiceLocator.Register<IHitTestService>(new HitTestService(DiagramCanvas));
    }
}
0
John Harrison
Top achievements
Rank 1
answered on 04 Nov 2014, 02:34 PM
And for some reason the forums blow up with an ops error, so posted again, got another ops error. But both posts where posted!

Thanks
0
John Harrison
Top achievements
Rank 1
answered on 04 Nov 2014, 03:40 PM
It looks like something in the ToolService class (IsControlDown) is where the hook is.

How do we implement/override the current implementation. A quick google brings up pretty much no info on this!

Thanks
0
John Harrison
Top achievements
Rank 1
answered on 04 Nov 2014, 04:53 PM
For those trying to resolve this, this is how we have done it.

ToolService.cs has a hard coded internal method:


    internal static bool IsControlKeyDown()
    {
      return (Keyboard.Modifiers & ModifierKeys.Control) == ModifierKeys.Control;
    }

Which gets called by tools which makes it not very easy to set it to something other than space.

Implement a class that overrides the default tool service:

    public class SpaceIsTheBestToolService : ToolService, IToolService, IKeyboardListener
    {
        protected bool IsSpaceDown;
        protected bool IsCtrlDown;

        public SpaceIsTheBestToolService(IGraphInternal graph, IGraphServiceLocator serviceLocator)
            : base(graph, serviceLocator)
        {
        }

        public new bool KeyDown(KeyArgs key)
        {
            IsSpaceDown = (key.Key == Key.Space);
            IsCtrlDown = (key.Key == Key.Ctrl);
            return base.KeyDown(key);
        }

        public new bool KeyUp(KeyArgs key)
        {
            if (key.Key == Key.Space)
            {
                IsSpaceDown = false;
            }

            if (key.Key == Key.Ctrl)
            {
                IsCtrlDown = false;
            }

            return base.KeyUp(key);
        }

        public new bool IsControlDown
        {
            get { return IsCtrlDown || IsSpaceDown; }
            set { ; }
        }
    }

Then override the default service on your diagram:

DiagramCanvas.ServiceLocator.RegisterDefaultServices();
DiagramCanvas.ServiceLocator.Register<IToolService>((IToolService)new SpaceIsTheBestToolService(DiagramCanvas, (IGraphServiceLocator)DiagramCanvas.ServiceLocator));

This now works on OSX in that you can use space!

Now if only we could get some assistance on all the other shortcuts/mousewheel stuff.

Our business consists of mostly macs (hundreds of users), we are a bit disappointed that telerik do not support Mac out of the box, or have some way of configuring it so it does.

Thanks
0
Pavel R. Pavlov
Telerik team
answered on 05 Nov 2014, 03:19 PM
Hello,

Could you please provide us with a list of the shortcuts that are not working as expected and a description of how each of them should work? When you give us the full list we will be able to evaluate all possible approaches and suggest the best one for you.

Regards,
Pavel R. Pavlov
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.

 
0
John Harrison
Top achievements
Rank 1
answered on 05 Nov 2014, 03:34 PM
Hi,

Sure, anything that uses the Control Key on Mac OSX does not work.

This is because it appears Ctrl on a mac actually simulates a right mouse click.

Therefore all the hold Ctrl to Pan, Ctrl Arrows to move etc do not work on a mac.

Thanks
0
Zarko
Telerik team
answered on 10 Nov 2014, 02:11 PM
Hello John,
There are a couple of ways to do this and I think that the easies one is with a two event handles and a custom ToolService:
private void diagram_KeyDown(object sender, KeyEventArgs e)
{
    if (e.Key == Key.Shift)
    {
        this.myTool.IsMyKeyDown = true;
    }
}
private void diagram_KeyUp(object sender, KeyEventArgs e)
{
    if (e.Key == Key.Shift)
    {
        this.myTool.IsMyKeyDown = false;
    }
}
and
public bool IsMyKeyDown { get; set; }
 
bool IToolService.IsControlDown
{
    get
    {
        return this.IsMyKeyDown;
    }
    set
    {
        //Do nothing.
    }
}
This will cover the scenarios that use the IsControlDown property. As for the commands - you just replace the input bindings using your own:
// Those are the diagram commands and you can change the key gestures as you like.
var inputBindings = new List<InputBinding>
{
     new KeyBinding(DiagramCommands.Cut, new KeyGesture(Key.X, ModifierKeys.Control)),
...
};
 
var commandBindings = new InputBindingCollection();
inputBindings.ForEach(b => commandBindings.Add(b));
CommandManager.SetInputBindings(this.diagram, commandBindings);
I've attached a sample project demonstrating this so could you please examine it and tell us if it works for you ?

Regards,
Zarko
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
Diagram
Asked by
John Harrison
Top achievements
Rank 1
Answers by
John Harrison
Top achievements
Rank 1
Pavel R. Pavlov
Telerik team
Zarko
Telerik team
Share this question
or