Showing grid using Shader in Unity - Grid Placement System P2
In this Unity tutorial we will add a Grid on top of our map by creating a custom grid shader. At the end of this tutorial you will have a grid placement system that you can use in your own project.
House building system in unity project template:
courses.sunnyvalleystudio.com...
Starter Project:
/ 80441380
Scripts on github:
github.com/SunnyValleyStudio/...
Assets used:
kenney.nl/
𝗛𝗮𝘃𝗲 𝗮𝗻𝘆 𝗾𝘂𝗲𝘀𝘁𝗶𝗼𝗻𝘀? 𝗝𝗼𝗶𝗻 𝘁𝗵𝗲 𝗱𝗶𝘀𝗰𝗼𝗿𝗱!
/ discord
𝗣𝗟𝗘𝗔𝗦𝗘 support the channel:
/ sunnyvalleystudio
00:00 Importing shader graph samples
01:15 Creating Grid Shader
04:18 Using Object scale in a grid shader
08:36 Controlling grid thickness
09:11 Applying color to grid
09:59 Changing grid size
10:55 Showing grid on the map
#unity3d #gamedevelopment #indiegamedev #sunnyvalleystudio
Пікірлер: 65
Love your videos, man! Concise, but clear. Keep it up!
@SunnyValleyStudio
10 ай бұрын
Thanks a lot!
I really like your tutorial, Peter! Thank you very much, and I also bought your tutorial!
@SunnyValleyStudio
Жыл бұрын
Thank you 🙂
Thank you for the great video. I've been following your content on Udemy and you have a talent for really well put together training material! Great Stuff!
@SunnyValleyStudio
Жыл бұрын
You are very kind 🙂 Thank you for your support 👍
looking good! Thanks
@SunnyValleyStudio
Жыл бұрын
Thanks! 🙂
Excellent Tutorial. Really helpful.. Another part done.. Thanks..
@SunnyValleyStudio
2 ай бұрын
Thanks 🙂
Well explained....Waiting for next video.
@SunnyValleyStudio
Жыл бұрын
Thanks! Next part should appear today 🙂
Wow! your vids are so easy to follow along to! Can you plz make a tutorial on the alteruna multiplayer packgage?
@SunnyValleyStudio
Жыл бұрын
I will try tackling the multiplayer soon 🙂
Will you cover also stacking objects like 'Unpacking game' in this series? Nice content, thank you for sharing!!
@SunnyValleyStudio
Жыл бұрын
I will cover how to place floor and on it furniture (or rather how to place both) and how to detect when deleting the furniture first and next the floor. Stacking would be done similarly - detect IF there is a floor and only then allow to place furniture. You should have really easy time figuring it out when I release the "Removing objects" part of the tutorial 🙂
Hey! Thanks for the video! I have a question about the grid cells. Wouldn't it be possible to connect the shader tiling attribute to the grid's cell size? That way, changing the shader should automatically make the grid cell size match, right? (I mainly use Maya so I am not very familiarized with Unity). Thanks again! :D
@SunnyValleyStudio
Жыл бұрын
Hey! Yes you can do it. I show how in my House Building Template courses.sunnyvalleystudio.com/p/house-building-system-in-unity to encourage people to support my work 🙂 It isn't hard to figure out. It just takes a custom script.
I'm having a problem with the grid lines jittering when the camera moves. the only thing that works is setting render scale in URP settings to 2 and turning anti-aliasing off. however, this isn't ideal and I'm wondering if there's something else, I can adjust withing the shader.
@SunnyValleyStudio
9 ай бұрын
It sounds like anti-aliasing issue. You can try making your grid thicker but I'm note entirely sure what do you mean by jittering. Feel free to share screenshot on discord.
If you are missing the Grid. You need to go into Window > Package Manager > Select the Shader Graph package > Select the Samples tab > Import he Procedural Patterns
Could you maybe show how you would implement this on an uneven surface / terrain?
@SunnyValleyStudio
Жыл бұрын
Unless you need a continuous placement you could still have a flat 2D grid since even if you are selecting a mountain its X and Z coordinates are the same as on the flat area. All you would need to to is shoot a raycast from the edges of your object to place it at an angle relative to the terrain shape. The easier approach would be to shoot a raycast from the center point and place it at this altitude. You would also need to use some form of a boxcast against your terrain to check if by any any you are not intersecting a mountain edge when placing your object. Can be a lot of work to implement this. I hope it helps!
the sphere which serves as the cursor always has an offset to the cellindicator, it points at one cell but the cellindicator is on the diagonal opposite cell
@SunnyValleyStudio
Жыл бұрын
Hey! in the code we are relying on the "grid.CellToWorld(gridPosition);" so the method from the Grid class. Any offset might be caused by 1) offset added to the GRID object in the hierarchy or 2) offset added to the cell indicator prefab or 3) some error in the code. You can view the code here github.com/SunnyValleyStudio/Grid-Placement-System-Unity-2022/commits/main I hope it helps. if not feel free to write me on discord (link in the description) and attach screenshot so i have a better understanding of the problem 🙂
@sheesh5812
Жыл бұрын
@@SunnyValleyStudio Hey! Thanks for your quick answer, I made sure that every prefab and the grid start at 0,0,0. I fixed the problem by adding 1 to each the x and z position to the cellindicator position. Other than that everything worked fine, thank you for this awesome tutorial!
Great tutorial, but the grid seems to have a thin black outline that I don't like. Do you know how I might get rid of it? Or is it just due to imprecision with the grid node?
@SunnyValleyStudio
8 ай бұрын
I am not sure. It might be something connected to rendering settings. I am not that advanced with fixing visual bugs. Very often it can be connected to Anti Aliasing but again that is just what I would check.
@emerald8414
8 ай бұрын
@@SunnyValleyStudio okay thank you. Do you know if you're experiencing the same thing?
when you are changing plane size your grid size also change i assume because you prefab indicator indicate move to last shader visualize grid cell but mine are not move in that way my grid size remain same tell me about this
@SunnyValleyStudio
Жыл бұрын
I will be talking about the prefab in the next video. The prefab is of size 1x1 (grid cursor indicator). Then we modify the shader size it doesn't affect the Grid component. We have to manual (you can use a customs script) set the Grid component size to 0.5 when you set the shader size to be (2,2,2) - because we multiply there and 1 / 0.5f = 2. Anyhow the only moment that your cursor should move is when we modify the Transform of the "Grid Parent" object since it applies offset to the Grid components calculations. I hope it answers your question 🙂
The shader you created shows thin lines on the border of the grid. How to make it show even lines on the edges of the grid as well?
@SunnyValleyStudio
9 ай бұрын
This is because we only get half of it on the edges. You could use a Rectangle nod and add a thicker outline to the edges of the plane - just have to find the correct value based on the scale and the base thickness. You could just use "Add" node to the result that we have so far and for safety "Clamp" it to 0-1.
When making grid shader(connecting nodes and all that), the preview shows a pink sphere. If I change preview to Quad, it's just a pink rectangle. If I make it to material and put it on plane, the plane just turns pink. I'm sure I connect minus one out to fragment color. Please help.
@pengqihang5314
6 ай бұрын
Fixed it. It was a renderer issue
@SunnyValleyStudio
6 ай бұрын
Glad to hear that you were able to solve it 🙂
@pengqihang5314
6 ай бұрын
@@SunnyValleyStudio Great Guides! Thanks!
I've successfully managed to create the grid, everything is nice, the only thing is that in the distance the cells are flickering when i'm moving my character. Any fix for this? Thank you !
@SunnyValleyStudio
2 ай бұрын
Flickering can be cause by z-fighting (that is why we move the grid plane in front of the ground). When you zoom far away the flickering can be dues to Anti-aliasing and the fact that our grid is "thin" when viewed from afar). I'm not an expert when it comes to solving graphics related problems so it's something you would have to research 🙂
How to limit the object while placing it? If I place the table at the right border, some part of it goes out of the grid. How do I clamp it's size?
@SunnyValleyStudio
9 ай бұрын
The easiest way is to specify by hand the grid borders (later you can calculate those). Next just ask this "GridB0rders.cs" component "Are the positions selected for placement outside the grid border? " All you would have there is a "center point" and the "size" and single method with an if stement "If origin.x + offset.x I hope it makes sense
@shazboi
8 ай бұрын
@@SunnyValleyStudio Yep I kinda figured it out by taking limits of the Grid then doing something in the CalculateGridPositions(); function like Vector3Int desiredPosition = gridPosition + new Vector3Int(x, 0, y); if (desiredPosition.x (gridXLimit / 2) - 1 || desiredPosition.z (gridYLimit / 2) - 1) { return null; } and then in the CanPlaceObjectAt(); function if (positionToOccupy == null) return false; Solved the thing 👍
my object in the shader editor only has position and scale. why?
@SunnyValleyStudio
6 ай бұрын
Can be some changes done to the Shader Graph docs.unity3d.com/Packages/com.unity.shadergraph@6.9/manual/Object-Node.html . It shouldn't affect the shader that we create though 👍
i don't have the samples folder where can i find it
@SunnyValleyStudio
8 ай бұрын
If you mean for the shader Grid parameter you have to open Package Manager (from the Top menu I think "View" category ?) and find in it the Shader graph. Next on the right you should find "samples" and have a way to download the shader graph samples.
I'm using 2d sprites for my game and the grid appears in front of the sprites, how to fix that? Also how do you make the grid transparent?
@flikera
3 ай бұрын
I found the answer of the first: Material > Sorting Priority -1
@SunnyValleyStudio
3 ай бұрын
Good to hear that you have found a solution!
@flikera
3 ай бұрын
Do you know how to control the grid alpha/transparency?@@SunnyValleyStudio I tried the color, but it doesn't do anything.
the ball in the grid shader is just black it doesn't have the lines when we change the value to 1
@SunnyValleyStudio
24 күн бұрын
Strange. I remember that indeed some parameters had to be limited in range from 0 - 0.99 because otherwise the shader logic would not work. Maybe I forgot to add clamp node to prevent that. Sorry about that! I'm fairly confident about the shader itself so if it is not the issue that you are experiencing maybe take a look again at the section of the video where I present the graph and compare it with yours. Feel free to join my discord discord.com/invite/RQEtYHz if you need me to send you a screenshot of my graph 🙂
No "Open Shader Editor" button!
@SunnyValleyStudio
11 ай бұрын
Are you using URP pipeline? Another reason for it might be that you have created a default shader file and not the "Shader graph" asset. You can check this forum to read more about this issue forum.unity.com/threads/cant-open-shader-graph.669955/
@SunnyValleyStudio
5 ай бұрын
Thanks for the comment! 👍
comment for promoting your channel
@SunnyValleyStudio
Жыл бұрын
Thanks! 🙂
Had a hard time following the shader part. It was too fast and the explanations quite shallow. Otherwise good video.
@SunnyValleyStudio
24 күн бұрын
I really appreciate the feedback 👍
Sample doesn't have a Grid!
@SunnyValleyStudio
9 ай бұрын
What do you mean? We create the grid in the tutorial
@benzeji9686
8 ай бұрын
he's talking about the shader.@@SunnyValleyStudio
@osan99999
Ай бұрын
0:55 package manager->shader graph>samples>import
@bishopjackson2264
4 күн бұрын
@@SunnyValleyStudio In the recent starter package, there is no samples folder.