Announcing DragDetectors!

[PrinceTybalt]

Hello Creators!

We are excited to announce the release of DragDetectors! DragDetectors are a new instance type designed to make interacting with objects easy for everyone. They enable easy mapping of cursor/dragging actions to intuitive motions in 3d space. They can be used for anything that requires physical manipulation, like opening doors and drawers, pushing parts around, or grabbing and tossing a bowling ball.

Making a game of Jenga has never been so easy!

DragDetectors are highly customizable. You can choose from a wide array of drag styles, set directions and limits, and define how objects respond to the motion. DragDetectors work with anchored objects (will stay where you leave them) and unanchored objects (will apply physics as you drag and when you let go) so you can create the perfect interaction for your experience.

Furthermore, you can script against DragDetectors, using the movement to create additional mechanics like a light dimmer switch or a gear shift. You can even carry things “Lumber Tycoon Style.”

How to use DragDetectors

There is an extended DragDetectors tutorial page here. And full API documentation here.

But read on to get started quickly!

To use DragDetectors, add a DragDetector under any part or model in Explorer. Hit Play and you will be able to go into the experience and start interacting with that object!

Customization of DragDetectors happens through properties. Click a topic to see documentation, or scroll down to see some examples.

1. DragStyle - choose between different kinds of translations and rotations
2. Drag Directions - choose directions and axes of motion
3. ResponseStyle - choose whether physics is in action while you drag
4. Axis/Movement Limits
5. Physics Response
6. Modifier Input
7. Replication

In addition, you can use event connections and methods to customize DragDetector behavior, build 3DUIs, and perform game logic.

Examples

Here are some examples of what you can do with DragDetectors. Each of these is available as a model in the Toolbox, so feel free to play with them and modify them in Studio!

Example #1

Hello World!

It takes 2 steps to create a draggable part and 1 more step to play with it:

1. Create a part
2. Add a DragDetector as its child
3. Click Play

Now you are in a game with your draggable part!

To find a premade version, look for “Hello DragDetector” in the Toolbox.

Example #2

Playing with Anchored and DragStyle

DragStyle changes how you translate or rotate when you click and drag.

1. Create two draggable parts, one anchored, and one unanchored

• Create two parts.
• Make one anchored, the other unanchored.
• Add a DragDetector below each part.

2. Change DragStyle of both DragDetectors to TranslateLine and click play:

• The anchored part moves up and down and stays where you leave it.
• You can lift the unanchored part and when you let go, it falls back down.

3. Try exploring other DragStyles like RotateAxis, TranslateViewPlane, and TranslatePlaneOrLine.
4. Remember to exit play mode before trying a new DragStyle. Changes to DragStyle made on the client won’t replicate to the server; so the change won’t stick.

To find a premade version, look for “Anchored and Nonanchored” in the Toolbox.

Example #3

New Script-Free Gameplay

Now you can build drawers that open and close, adjustable mechanisms, and balls that can be tossed or rolled, all without scripting.

DragDetectors using TranslateLine DragStyle and translation limits help make a working desk. To try this model, look for “Desk With Drawers” in the Toolbox.

Add a DragDetector under a default sphere and set up 10 skinny blocks. Throw some texture on it and lower the pin density, raise the ball density, and you have some rudimentary bowling action. Our version is under “Stick Bowling” in the Toolbox.

This works even better if you search the Toolbox for a real bowling set model, import it, and insert your own DragDetector under that bowling ball.

Models, Videos, and Worlds to Explore

Models

In addition to the models in the examples, the models used in the introductory video clips may all be found in the Toolbox. If you filter(the button to the right of the search box) for Creator = PrinceTybalt, you will find: Marionette, Slingshots, Slingshots WithReloadScripts, Jenga, Jenga Throwable, and Particle LineSlider. There’s also a “Lumber Tycoon” style example called “Lift and Carry: Physical” that employs some more advanced scripting.

More models will be added over time, so check back.

Videos

Also, we will be making a series of instructional videos, Here is the first “How to Build a Jenga Game in 3 Minutes With DragDetectors”, and there will be more to come:

Create a Jenga Game in minutes with Drag Detectors
How To Create A Sliding Door With DragDetectors
How To Create A DragDetector that Only One Player Can Operate

Worlds

Lastly, there are three worlds we are sharing with you. We have used the first two for prototyping and QA testing. They exercise all the features of DragDetectors, many of which are not covered here.
The worlds are published and you are free to download, inspect, alter, copy, and reuse as you like. Go to the link, click ‘…’ near the title, then Edit to open them in Roblox Studio, then File->Download to save your own copy.

DragDetectors TestWorld 1

DragDetectors TestWorld 2

This third world has some variations on “Lift and Carry” style dragging in the spirit of Lumber Tycoon. These employ scripting DragStyles, client and server scripts, and RemoteEvents to achieve a more advanced result.

Lift And Carry

What’s next?

We can’t wait for you to try DragDetectors and let us know what you think. We’ve also collected some great feedback during our beta period. Here are some features we may add (no promises!) based on this early feedback:

• Screen Gui & Viewport Frame
  • ScreenGui/SurfaceGUI: we know you miss ‘draggable’ on 2DUI elements. We want to make it so that if you put a DragDetector below ScreenGui object like a button or text label, then you can drag it, complete with all the callbacks and API; you just won’t be able to bring it out of the plane.
  • ViewportFrame/WorldModels - we hope to make it so that DragDetectors work in this context just like they do in the main view.
• Security Control: a property named PermissionPolicy with 3 values: Nobody, Everybody, or Scripted. If scripted, you may register a method dragDetector:SetScriptedPermissionCheck(function(player, part) that returns true if the player may drag the part, false otherwise.
• Better Physics Integration:
  • runLocally should automatically get network ownership for non-anchored objects they drag
  • add new Collision response style. This will collide anchored objects and allow a way to move non-anchored objects geometrically, but with collisions
  • throw non-anchored objects on release even in geometric mode

---

Finally, many people helped us launch this feature. In particular, I’d like to thank @Urukeli, @DeFactoCepti, @PolarPorcupine, @Slim_Fandango, @IgnisRBX, our amazing QA team, and all the other people throughout Roblox that helped shape this feature to work nicely with the other parts of the Roblox ecosystem.

Thank you!

[DeFactoCepti]

Hooray! Excited to see what everyone does with this

[WoahItsJeebus (Jeebus)]

A very nice addition! Can’t wait to start using these!

[C_Corpze (Cartoon_Corpze)]

Yooooo, les go. This is some pretty neat stuff!

Never thought of using drag detectors before, I typically like having the mouse locked to the screen center but perhaps this might give me some ideas for fun interaction with the world.

How’s this going to work on Xbox/Playstation controllers though?

[Kyl_Bubble (KyleBubble)]

I’ve been waiting for this! Here it comes

[x_maks441 (x_maks)]

Damn, now i can finally make dragging script without need to program it for hours and searching for countless bugs!

[ClientCooldown (wawa)]

This is awesome, the DragDetectors are way easier to implement than the classic ways of making part dragging. Although, a bit of a technical question - do they still use AlignOrientation & AlignPosition instances internally? I can recall that being done while it was a beta feature.

[PrinceTybalt]

@Cartoon_Corpze DragDetectors work with all input devices:

• Mouse & Keyboard → in the standard way
• Game Controllers → via the virtual cursor
• VR Controllers → with the laser pointer
• Touch Input → with your fingers. There’s even multitouch so you can move several objects at once.

[PrinceTybalt]

@ClientCooldown DragDetectors no longer create extra AlignPosition and AlignOrientation instances. That was a stopgap during the beta period.

Now, when you drag non-anchored objects, we still use constraints that are equivalent to those instances in behavior, but we do it behind-the-scenes so you do not see temporary edits to your data model.

[Kyl_Bubble (KyleBubble)]

I gotta say my favorite part is the bowling all, Also, I’m not sure if this is client-sided or is indeed being replicated to the server, but its overall its very neat and im in love with the feature

[dodleoy (dodle)]

things like this is what roblox should be about

[x_maks441 (x_maks)]

I wonder what will Defaultio think about this update, knowing how much he did scripting and include a lot of math things to make dragging work smoothly, and now getting roblox to add similar thing that can be made really close to his dragging script with so much less scripting and effort.

[PrinceTybalt]

@Kyl_Bubble By default, the client sends the server events containing information such as the player, viewFrame, and the cursorRay pointing into the scene. The server makes the changes and broadcasts either Pivots/CFrames (for anchored objects) or constraint information (for non-anchored objects) to other players. You don’t need to worry about network ownership because whoever owns it will get the info from the server.

If you set DragDetector.RunLocally to true, then all the work is done on the client.
If the object is anchored, the Pivot/CFrame will be changed locally.
If the client does not send RemoteEvents to the server, then it’s only local. This is how you can build individual lighting controls, for example. If the client does send RemoteEvents to the server to broadcast the changes, then others will find out too.
If the object is not anchored, then you need to request network ownership through a RemoteEvent.

There are examples of all these variations in DragDetectors TestWorld 1 and DragDetectors TestWorld 2

[PrinceTybalt]

@x_maks441 We had so many request for “Lumber Tycoon” style behavior during our beta period that I created a demo in the style of this, and it’s one of the demos you can download and steal/copy/change:
Here’s a game/sandbox with just a couple boxes and kitchen counters:
Lift and Carry - Game
And here’s a model you can also find in the toolbox:
Model: Lift And Carry - Physical

But I will tell you that it’s not as sophisticated as their version. There’s still a way to go to match all of that lovely implementation’s features.

@Defaultio, you still have the edge. It’s beautiful work.

[dodleoy (dodle)]

question: how would i make it so that the dragged object stays within a certain range of the player? if i walk away with a dragged object i would want it to moving with me

[PrinceTybalt]

@dodleoy you can set the Dragger.ReferenceInstance to be the character’s humanoid root (you may need to do this with a script) and then you can set the Dragger.MinDragTranslation and Dragger.MaxDragTranslation to define a box around the player.

[TopDev]

Another great update, so happy this is finally out of beta!

[raiar_candev (raiar)]

Amazing! This is going to make life easier for scripters who want to make some sort of script that detects if a player is trying to drag a part.

[Blafert]

A real game changer I predict. Great stuff!