[v1.5] Create Dynamic Crosshairs! (Updated!)

Towphy · October 1, 2022, 3:08pm

Same model as always:

Good idea, added to the to-do list!

Towphy · October 1, 2022, 3:20pm

Easing Styles Showcase

Download Place File Here!:
DynamicCrosshair_Styles.rbxl (52.5 KB)

If you run into any issues, reply to this post!

HttpsTimeout · October 2, 2022, 7:59pm

i checked the crosshair module in the place file and the one on the model

they are not the same!

i think you forgot to update it.

Towphy · October 2, 2022, 8:04pm

Sorry for the inconvenience, should be fixed now!

Towphy · November 19, 2022, 4:54pm

Update v1.2 (Hit Markers & Follow Mouse)

NEW:

Hit markers
Follow mouse function
:Update() handled by module

Information:
DynamicCrosshair now supports hitmarkers! Hitmarkers are totally customizable down to the image, size, fadetime, etc. It’s as simple as calling the DynamicCrosshair:HitMarker() function!

Example:

local ScreenUI = script.Parent
local Module = require(script.Parent:WaitForChild('Crosshair'))
local DynamicCrosshair = Module.New(ScreenUi)
DynamicCrosshair:Enable()

-- all settings: 
-- all of these settings are optional, the hitmarker will just revert to defaults
DynamicCrosshair.HitMarker.default = Color3.new(1, 1, 1) -- color3 value
DynamicCrosshair.HitMarker.headshot = Color3.new(1, 0, 0) -- color3 value

DynamicCrosshair.HitMarker.size = Udim2.fromOffset(60,60) --udim2 value
DynamicCrosshair.HitMarker.image = "rbxassetid://285779644" -- image
DynamicCrosshair.HitMarker.fadeTime = .25 -- number value
DynamicCrosshair.HitMarker.easingStyle = Enum.EasingStyle.Linear -- easing style
DynamicCrosshair.HitMarker.easingDirection = Enum.EasingDirection.InOut

-- CALL FUNCTION
-- DynamicCrosshair:HitMarker(headshot : boolean)
DynamicCrosshair:HitMarker() -- headshot false
DynamicCrosshair:HitMarker(true) -- headshot true
DynamicCrosshair:HitMarker(false) -- headshot false
--all ways will work correctly^

Along with the inclusion of hitmarkers, the function :FollowMouse has been added!

Example:

local ScreenUI = script.Parent
local Module = require(script.Parent:WaitForChild('Crosshair'))
local DynamicCrosshair = Module.New(ScreenUi)
DynamicCrosshair:Enable()

DynamicCrosshair:FollowMouse() -- crosshair will follow mouse
DynamicCrosshair:FollowMouse(true) -- crosshair will follow mouse
DynamicCrosshair:FollowMouse(false) -- crosshair will stop following mouse

Last to mention, the function :Update() is now fully handled by the module for simplifying things in general. Using the :Update function in your script might cause some unexpected bugs!

Special thanks for @HttpsTimeout for their contributions towards this update!

The documentation is currently very outdated right now, working on it!
If you want any video/image examples from this new update reply to this post

Module: DynamicCrosshair - Roblox

callejh · December 28, 2022, 10:48am

Im wondering how to make a zoomIn and zoomOut using these functions? so the cross hair gets smaller or bigger

Fizzitix · January 11, 2023, 5:56pm

When I saw this had been updated twice, I did a little happy dance in my head, especially when I noticed easing styles were added. However, when I implemented the new module, I got this error on line 197:

path.DynamicCrosshair:197: attempt to index nil with 'spread'`

It’s coming from the :SmoothSet() function in the module. I made 100% sure by removing :SmoothSet() from my code, and it didn’t return an error.

I am using this code from the v1.1 post.

Towphy:

DynamicCrosshair:Enable()

DynamicCrosshair.Min = 10
DynamicCrosshair.Max = 100

DynamicCrosshair.EasingStyle = Enum.EasingStyle.Linear
DynamicCrosshair.EasingDirection = Enum.EasingDirection.InOut

DynamicCrosshair:SmoothSet(50--[[ spread ]], 2  --[[ seconds]], true  --[[ update min]])
DynamicCrosshair:SmoothSet(50, 2, false)

How can I fix this? Am I doing something wrong?

Thanks,
Fizzitix

Towphy · January 15, 2023, 2:28am

You can try to accomplish this by possibly using DynamicCrosshair’s :Display() function? Seems like kind of a stretch so maybe a built-in function that does this exact thing can be seen in a future update.

Stay tuned for upcoming update releases!

Towphy · January 15, 2023, 2:31am

I’ll give it a look thanks for the reply.

That documentation is outdated to my knowledge, which is at the top of my to-do list to update.
Maybe create a separate website for documentation? If it’s a good idea ~

I’ll reply as soon as I can with a fix or patch for the module!

Towphy · January 15, 2023, 2:52am

Just ran the code and replicated the same error:

After looking into it I found out it was a capitalization problem
Silly error that should’ve been fixed a while ago

Module is update!
Download here: DynamicCrosshair - Roblox

Fizzitix · January 15, 2023, 2:53am

Thanks so much! This module is super, super useful. Keep it up!

Fizzitix

Towphy · January 28, 2023, 10:15pm

Update v1.3 (Documentation Update!)

Finally, FINALLY! New DynamicCrosshair documentation hosted by GitHun Pages!

Go check it out here: Documentation

If you find any issues or problems with the website shoot me a message on discord or the devforum!
Discord: Towphy#6174

Module Updates

Update v1.3 doesn’t just include new documentation, but a few new module updates!

Hitmakers

You can now customize the hitmakers default and headshot image!
Example here:

local UI : ScreenGui = script.Parent 
local DynamicCrosshair = require(script.DynamicCrosshair).New(UI)
DynamicCrosshair:Enable()

DynamicCrosshair.HitMarker.Image.default  = "rbxassetid://285779644"
DynamicCrosshair.HitMarker.Image.headshot = "rbxassetid://285779644"
DynamicCrosshair:Hitmarker(true)

If the HitMarker.Image.headshot is left nil, it will default to HitMarker.Image.default

Very minor changes to the following functions:

DynamicCrosshair:Set()
DynamicCrosshair:Lock()
DynamicCrosshair:Hitmarker()

Download The Module Here:

As always, if you run into any problems with the website or module respond to this post or reach out to me on my socials (located on the documentation website)

SageToxigen · January 30, 2023, 6:16pm

Hello, I am currently experiencing a problem related to :Raycast().

I’m not sure if it’s my coding or the module itself, but the direction it returns is inaccurate. I made sure of blacklisting character itself from the raycast, and followed the documentation well, but unfortunately, the problem still persists.

If needed, here is how my code looks like.

function FireProjectile()
	local VIEWPORT_SIZE = Camera.ViewportSize
	local CAST_LENGTH = Tool:GetAttribute("BulletMaxDist")
	
	raycastParams.FilterDescendantsInstances = {Character, IgnoreList}
	
	local _, direction = DynamicCrosshair:Raycast()
	local unitRay = Camera:ScreenPointToRay(VIEWPORT_SIZE.X / 2, VIEWPORT_SIZE.Y / 2 - game:GetService("GuiService"):GetGuiInset().Y)
	local raycastResult = workspace:Raycast(unitRay.Origin, direction * CAST_LENGTH, raycastParams)

	local TargetPosition = if raycastResult then raycastResult.Position else unitRay.Origin + direction * CAST_LENGTH
	
	if not isInSafeMode then
		MouseEvent:FireServer(TargetPosition)
	end
	
	if RoxiteSettings.Debug then
		local Line, Cone = Gizmo:DrawArrow(unitRay.Origin, TargetPosition, Color3.fromRGB(85, 186, 255))
		game:GetService("Debris"):AddItem(Line, 5)
		game:GetService("Debris"):AddItem(Cone, 5)
	end
end

If it’s just my scripting, please correct me.

Towphy · January 30, 2023, 11:18pm

Hmm, interesting, it could possibly be because of the Camera:ScreenPointToRay you use in your code, since DynamicCrosshair already does that for you, but I doubt it.
I’d say try it without it and see if anything changes.

try this

function FireProjectile()
	local CAST_LENGTH = Tool:GetAttribute("BulletMaxDist")
	
	raycastParams.FilterDescendantsInstances = {Character, IgnoreList}
	
	local origin, direction = DynamicCrosshair:Raycast()
	local raycastResult = workspace:Raycast(origin, direction * CAST_LENGTH, raycastParams)

	local TargetPosition = if raycastResult then raycastResult.Position else origin + direction * CAST_LENGTH
	
	if not isInSafeMode then
		MouseEvent:FireServer(TargetPosition)
	end
	
	if RoxiteSettings.Debug then
		local Line, Cone = Gizmo:DrawArrow(origin, TargetPosition, Color3.fromRGB(85, 186, 255))
		game:GetService("Debris"):AddItem(Line, 5)
		game:GetService("Debris"):AddItem(Cone, 5)
	end
end

If the problem persists could you send a Roblox file so I can take a look myself? My socials are all on the documentation website!

SageToxigen · January 31, 2023, 3:26am

The problem persists, nonetheless.

I can give you the file in your private message to troubleshoot the issue, whether it is my scripting or your module.

tin_nim · February 18, 2023, 2:59pm

Hmm strage it seemed that the :set function caused some enormous leak when used in consecutive order every frame

Towphy · February 20, 2023, 4:10am

Update v.1.4 (Center dot and image crosshairs!)

DynamicCrosshair has received a new update with 2 new previously suggested features, Center Dots and Image Crosshairs

Center Dots

Center dot is a image that always stays in the middle of the crosshair, pretty simple.

Example:

Example Code

local rep = game:GetService('ReplicatedStorage')
local DynamicCrosshair = require(rep:WaitForChild('DynamicCrosshair')).New(script.Parent)

local uis = game:GetService('UserInputService')
DynamicCrosshair:Enable()

DynamicCrosshair:Size(15, 3)

DynamicCrosshair:Display({
	BackgroundTransparency = 0; 
	BorderSizePixel = 0;
	Image = nil;
	ImageTransparency = 0;
	BackgroundColor3 = Color3.new(1, 1, 1);
})

DynamicCrosshair.CenterDot.enabled = true
DynamicCrosshair.CenterDot.size = UDim2.fromOffset(5,5)

Usage:

DynamicCrosshair.CenterDot.enabled = true -- default: false
DynamicCrosshair.CenterDot.size = UDim2.fromOffset(x,y) -- default: UDim2.fromOffset(7.5,7.5)
DynamicCrosshair.CenterDot.transparency = 0 -- default: 0
DynamicCrosshair.CenterDot.Image = 'rbxassetid://xxxxxxx' -- default: rbxassetid://11003529439

Image Crosshairs

Image crosshairs are pretty self-explanatory. They are single-image crosshairs that are as big as a normal crosshair would be. They work with all built-in functions.
Once the image crosshair is enabled all other crosshairs are disabled. The center dot will still exist.

Example:

Example Code

DynamicCrosshair.ImageCrosshair.enabled = true

Usage:

DynamicCrosshair.ImageCrosshair.enabled = true -- default: false
DynamicCrosshair.ImageCrosshair.Image = 'rbxassetid://xxxxxxx' -- default: rbxassetid://12550071496

Minor Updates:

The function :Size can take 1 argument instead of 2.
Example:

-- DynamicCrosshair size is (5, 1)
DynamicCrosshair:Size(10) -- size will result in (10,1)
DynamicCrosshair:Size(10,10) -- size will result in (10,10)

Statuses:

Documentation is not updated (stay tuned)

Module is updated

As always, if you run into any problems with the website or module respond to this post or reach out to me on my socials (located on the documentation website)

Towphy · February 20, 2023, 4:12am

Really? seems odd, could you send some examples?

The module isn’t very… performance well. WORK IN PROGRESS THOUGH!

pankii_kust · February 20, 2023, 4:38am

finally been waiting for this lol
are there any demonstration for this??

Towphy · February 20, 2023, 4:53am

Yup demonstrations should be available on the documentation once it’s updated. Expect it to be updated in about 1 day. I’ll @ you once it is updated!