Prompts+ - Easily customize ProximityPrompts

Prompts+

Prompts+ is an easy way to customize your proximity prompts, and even take them out of the 3d space and into your UI's.

Example


The first two from the left are actually ScreenGuis, not Billboardguis! One of them is in a frame with a list layout. Here is the code that I used to setup this example:

Example Script
local Prompt = require(game:GetService("ReplicatedStorage"):WaitForChild("Prompt"));

wait(3);

local WorldPrompt = Prompt.new({

Parent = workspace:WaitForChild("Dummy");

ObjectText = "Dummy";

HoldDuration = 1;

Size = UDim2.new(1, 0, 1, 0);

Transparency = 0.5;

BackgroundColor = Color3.fromRGB(204, 204, 204);

ProgressBarColor = Color3.fromRGB(65, 214, 255);

RoundFrameTransparency = 0.1;

RoundFrameBackgroundColor = Color3.fromRGB(13, 13, 13);

TextColor = Color3.fromRGB(22, 22, 22);

ObjectTextColor = Color3.fromRGB(67, 67, 67);

InputTextColor = Color3.fromRGB(43, 174, 255);

Font = "Ubuntu";

});

-- On screen prompts!

local CenteredPrompt = Prompt.new({

Parent = game.Players.LocalPlayer.PlayerGui.Test;

Size = UDim2.new(0, 365, 0, 100);

ProgressBarColor = Color3.fromRGB(65, 214, 255);

RoundFrameTransparency = 0.5;

AnchorPoint = Vector2.new(0.5, 0.5);

Position = UDim2.new(0.5, 0, 0.5, 0);

});

CenteredPrompt.Triggered:Connect(function()

print("Works great!");

end)

-- Put it in other UIs!

local PromptInList = Prompt.new({

Parent = game.Players.LocalPlayer.PlayerGui.Test.Frame;

Size = UDim2.new(0, 165, 0, 60);

ProgressBarColor = Color3.fromRGB(65, 214, 255);

RoundFrameTransparency = 0.5;

});

wait(3);

PromptInList:InputHoldBegin();

Features

Ability to change…

  • Size
  • Transparency
  • Background color
  • Progress bar color
  • Round frame transparency
  • Round frame color
  • Input, object, and interaction text color and font
  • Position (OnScreen)
  • AnchorPoint (OnScreen)

These properties can be changed just like any other Roblox instance from a script.

OnScreen
By simply parenting your prompt, created through this module, to a UI object such as a frame, it will go out of the world and into the UI!

Documentation

Usage

View the example script to see what properties you can change!

local Prompt = require(game:GetService("ReplicatedStorage"):WaitForChild("Prompt"));
local NewPrompt = Prompt.new({Arguments});

If you want to use an already existing prompt, then in the arguments, point “PromptObject” to a ProximityPrompt.

Prompt.new({PromptObject = myprompt});

To put the prompt on your screen, simply set the parent to a UI object.

You can set properties outside of the constructor as well.

-- Example
NewPrompt.Size = UDim2.new(0.5, 0, 0.5, 0);

You can change the default prompt settings by changing the values in the PromptObject located in the Prompt module.

Sorry if this post is a mess, I suck at writing stuff like this. Please reply if you need any help or come across any problems. Yes, I know this feature is in beta, so I hope the way you customize prompts doesn’t change too drastically!

The round frame started to look a little bit weird after changing it to scale (to accommodate for larger/smaller prompts) so I put in a size constraint for it. Please let me know if this gets any weird results. I’m not great with that kind of thing!

To do

Keep in mind that I have less time available to script so releases are probably gonna be slow.
  • Text size
  • Transparency of key icon
  • Prompts inside prompts? Not sure yet

Get it here!

Totally didn’t realize I copied the name format for Topbar+. Oops!

112 Likes

It’s a system that allows for easy customisation of the Proximity Prompts lol.

That aside, this is quite nice, can’t wait for this to go public!

6 Likes

Me too. I’ve worked on prompt systems just like this in the past, and it’s great to see such a customizable system from Roblox. Games heavy on interactions are really going to benefit from this.

3 Likes

Personally this easy customisation is a huge plus for me, since I’ve transitioned all the interactions in one of my projects to this system. Can I ask if you’re planning to add any new features in the future?

1 Like

I’m considering adding pages if that’s what you can call them. Interactions that open up another menu of interactions. I may also add the ability to define custom functions that dictate if a prompt can be shown, like if you want to use raycasting (not sure if it currently uses raycasting). I’m sure I may think of other things.

3 Likes

My Custom TWEENING Prompts I made! Very happy with the result!

Image from Gyazo

6 Likes

Is this a suggestion that I add tweening?

1 Like

Hey, it wouldn’t hurt! I used a plug-in to accomplish the tweening. I highly recommend using Tween Sequence Editor. It’s very user friendly and easy to use.

2 Likes

This resource is amazing.

But the only problem I have with this is that when if you want to customize a proximity prompt you have to create a new one.

This is a problem if you have a server script waiting for a proximity prompt to be triggered, it will error because it doesn’t exist yet.

I wish you could instead edit a pre-existing proximity prompt.

I was able to make a fix to this by changing:

function Prompt.new(data)
	local self = setmetatable({Properties = {}, PromptObject = script.PromptObject:Clone();}, Prompt);
	self.Data = data;
	
	self.OriginalRLOS = self.PromptObject.RequiresLineOfSight;
	self.OriginalMaxDistance = self.PromptObject.MaxActivationDistance;	
	
	-- Apply properties
	for i,v in pairs(self.Data) do
		self[i] = v;
	end
	
	self.PromptObject.Enabled = true;
	return self;
end

To:

function Prompt.new(data)
	local self = setmetatable({Properties = {}, PromptObject = data.PromptObject;}, Prompt);
	self.Data = data;
	
	self.OriginalRLOS = self.PromptObject.RequiresLineOfSight;
	self.OriginalMaxDistance = self.PromptObject.MaxActivationDistance;	
	
	-- Apply properties
	for i,v in pairs(self.Data) do
		self[i] = v;
	end
	
	self.PromptObject.Enabled = true;
	return self;
end

And the example will look like:


local Prompt = require(game.ReplicatedStorage.Modules:WaitForChild("Prompt"));

wait(3);

local WorldPrompt = Prompt.new({
	PromptObject = workspace.Part.ProximityPrompt;
	ObjectText = "Dummy";
	HoldDuration = 1;
	Size = UDim2.new(1, 0, 1, 0);
	Transparency = 0;
	BackgroundColor = Color3.fromRGB(61, 61, 61);
	ProgressBarColor = Color3.fromRGB(255, 0, 4);
	RoundFrameTransparency = 0.1;
	RoundFrameBackgroundColor = Color3.fromRGB(13, 13, 13);
	TextColor = Color3.fromRGB(255, 255, 255);
	ObjectTextColor = Color3.fromRGB(67, 67, 67);
	InputTextColor = Color3.fromRGB(255, 0, 0);
	Font = "Ubuntu";
});

Something to note is that if you want to do this you will have to copy the values inside proximity prompt that is parented to the prompt module into the proximity prompt that you want to customize.

3 Likes

I would probably change this line

local self = setmetatable({Properties = {}, PromptObject = data.PromptObject;}, Prompt);

to

local self = setmetatable({Properties = {}, PromptObject = data.PromptObject or script.PromptObject:Clone();}, Prompt);

To make it optional to provide an already existing prompt.

I didn’t think about existing prompts, I think I will implement that.

3 Likes

Small Update: Using Existing Prompts

Now when you setup a prompt with this module, you can pass through a new argument "PromptObject" to use a ProximityPrompt object you already have.

Documentation has been updated!

2 Likes

this system didn’t work for me

Can you give me some more information? How do you expect me to help you if that is all you say?

no bc i already figure out how it works and thx for this great model

1 Like

how do i use this, im completely confused

I Want to turn this into a proximity prompt: image (and if you can show me how i want to make a square radial fill tho)

The example will give you all the help you need. It demonstrates how to change the UI to your liking.

1 Like

I have some things to say. 1 This is an amazing module, you don’t have to make a script and keep tweaking each value anymore. I have have a reccomendation, add the abitlity to change transparency or values of the key icon. Also there is a but that when you have no action text the transparency works but when you activate it, it just resets transparency. other than that this is a great module and i cant wait to see it grow.

1 Like

It is a great resource to quickly add custom proximity prompts. However, I’ve found a minor bug.


As you can see in the video above, even though the script changes the ObjectText each time the prompt is triggered the prompt still displays the previous ObjectText. I’ve noticed that it shows the correct text if you walk up to it (trigger PromptShown) again. This is the case with both ObjectText and ActionText.

To fix the issue above I just added this code around line 412 of the “Main” script in the ScreenGui:

triggerEndedConnection = prompt.TriggerEnded:Connect(function()
			for _, tween in ipairs(tweensForTriggerEnded) do
				tween:Play()
				if frame:FindFirstChild("ActionText") then --just update both texts when TriggerEnded fires
					frame.ActionText.Text = prompt.ActionText
				end
				if frame:FindFirstChild("ObjectText") then
					frame.ObjectText.Text = prompt.ObjectText
				end
			end
		end)

Edit: Just found out the above still causes issues if you spam really hard. Alternatively I’ve just added this inside onLoad():

if frame:FindFirstChild("ObjectText") then
			prompt:GetPropertyChangedSignal("ObjectText"):Connect(function()
				frame.ObjectText.Text = prompt.ObjectText
			end)
		end
		if frame:FindFirstChild("ActionText") then
			prompt:GetPropertyChangedSignal("ActionText"):Connect(function()
				frame.ActionText.Text = prompt.ActionText
			end)
		end
3 Likes

forgot to mention, could you also add the ability to change text size?