Using Thumb to drag elements, how? RRS feed

  • Question

  • Hi,

    I spent some time playing with a Thumb control to implement dragging for some of my UI elements. I am still not satisfied with the results, though.

    As far as I can say, you have 4 ways:

    - Use a Thumb object, and set the Thumb's "ControlTemplate" to my own UserControl. Using this technique, the Thumb looks like my control, I can drag it, but I don't see a way to access my Control's properties and methods.

    - Use my Control, and set the "ControlTemplate" to "Thumb". But then, the item looks like a Thumb, so should I now set the Thumb's own ControlTemplate to my Control again? This seems a bit cumbersome...

    - Derive from Thumb instead of UserControl but then I cannot add any content, because Thumb may not have content.

    - Add a Thumb somewhere in my Control and use that small area only for dragging, not very satisfying, especially if you use Scaling.

    So, how do you Thumb your controls?


    Sunday, March 4, 2007 7:09 PM



    Adorners can be used to implement dragging functionality for your your controls. Please take a look at the sdk sample Resizing Adorners and the Adorners Overview in the sdk. This sample uses the Thumb control for resizing controls. You can also take a look at the InkCanvas class. It has built in support for resizing and dragging of the controls added to it.

    Another method could be to implement a custom panel that allows elements added to it to be dragged and resized. For an example of this approach see the code project article by Josh Smith.

    Another sdk sample of interest is the Geometry designer. It lets you drag and resize elements such as ellipses and rectangles that you add to the drawing surface.

    I hope this helps.


    Ahmed Chaudhary
    Graduate Student Department of Computer Science
    Texas A & M University, College Station Texas


    Monday, March 5, 2007 10:52 PM