I want to change a specific gradient color to the color or effect I want in Unity Shader Graph or with Shader - unity3d

First of all, my English skills are immature, so the translation may be awkward as it was written using a translator. Please pardon this part.
I am an aspiring developer who dreams of becoming a game developer in Korea. I am in the process of creating a portfolio for employment and I have chosen CultOfTheLamb as my portfolio game.
However, an issue occurred while making a game mockup, so I have a question.
The question is: Shader issue occurred while trying to create a copy of CultOfTheLamb..
https://i.stack.imgur.com/L1MLJ.png
This image is an attack motion created by unpacking resources from CultOfTheLamb.
However, since there is a gradation image in the animation, I want to change the image with a shader as shown in the picture below.
https://i.stack.imgur.com/s9acl.png
https://i.stack.imgur.com/ij23S.jpg
This is the player sprite atlas for this game. At the bottom of the image, there is a gradient image. My guess is that the image is converted into an effect by masking the gradient color in the shader. So I looked for information on color masking in shaders and tried color masking with Shader Graph in Unity. However, I wonder if the method I found was wrong, and the color masking didn't work properly, and I was a bit confused about how to mask the gradation color... I just studied shaders for the first time yesterday, so I don't have any relevant knowledge. Any help with a detailed explanation would be greatly appreciated.
The expected result is to change the gradient color to the specific effect or color I want.

Related

All shaders render black while using shadergraph in unity 2020 1.10f

I am doing a simple animation in unity and I wanted to add portal efecct using shadergraph 8.2.0 and everything renders black
like this
shader setings
I have no clue whatsoever what it is
I'm still learning the pipeline, however, I would think you need to scale up the texture on the top left, I can't read its name from the image. But you are getting the red/yellow mix, getting the swirl, but the area that's being blacked out is comparable to the texture I mentioned. Sorry I don't know how to put it exactly, but the white to grey to black gradient is not large enough so you are rendering the center fine just need to expand the white-grey area, I think scaling the texture up would produce the effect you want.

Unity 2D shader graph not correct colored

I tried to create outline shader for my Sprite:
I watched tutorials on YouTube (CodeMonkey and Brackeys) about this, but it worked by half. In Scene Graph I see preview:
But outline color I so faded:
And also I can't see this shader on Scene Preview:
What am I doing wrong?
Thanks for your attention
P.S.: Of course I set render pipeline like on this video
P.P.S: Material settings:
P.P.P.S: Shader file
Ok first of all you hadn't set the color in the according Outline Color slot int he Material settings.
Then what you are using is Add which results in additive color combining towards white.
Since your original texture isn't fully black but grey-ish the outline color is added to the already existing color(s) making it also lighter!
Instead you could use a Blend node and re-use the output of the Substract node as blend texture (Opacity).
Then you have to play a bit with the mode but I think maybe Overwrite or PinLight would be what you want.
(Actually you wouldn't need the additional Multiply node for the Outline Color)
Btw before you added your file I just reproduced one from scratch and it is way less complex than yours ;)

Unity shader to render objects with same material to subsequent GrabPasses

Overview
I'm working on a shader in Unity 2017.1 to enable UnityEngine.UI.Image components to blur what is behind them.
As some of the approaches in this Unity forum topic, I use GrabPasses, specifically a tex2Dproj(_GrabTexture, UNITY_PROJ_COORD(<uv with offset>)) call to look up the pixels that I use in my blur summations. I'm doing a basic 2-pass box blur, and not looking to optimize performance right now.
This works as expected:
I also want to mask the blur effect based on the image alpha. I use tex2D(_MainTex, IN.uvmain) to look up the alpha color of the sprite on the pixel I am calculating the blur for, which I then combine with the alpha of the blur.
This works fine when working with just a single UI.Image object:
The Problem
However when I have multiple UI.Image objects that share the same Material created from this shader, images layered above will cut into the images below:
I believe this is because objects with the same material may be drawn simultaneously and so don't appear in each other's GrabPasses, or at least something to that effect.
That at least would explain why, if I duplicate the material and use each material on its own object, I don't have this problem.
Here is the source code for the shader: https://gist.github.com/JohannesMP/8d0f531b815dfad07823d44bc12b8112
The Question
Is there a way to force objects of the same material to draw consecutively and not in parallel? Basically, I would like the result of a lower object's render passes to be visible to the grab pass of subsequent objects.
I could imagine creating a component that dynamically instantiates materials to force this, or using render textures, but I would really like a solution that doesn't require adding components or creating multiple materials to swap out.
I would love a solution that is entirely self-contained within one shader/one material but is unsure if this is possible. I'm still only starting to get familiar with shaders so I'm positive there are some features I am not familiar with.
It turns out that it was me re-drawing what I grabbed from the _GrabTexture that was causing the the issue. By correctly handling the alpha logic there I was able to get exactly the desired behavior:
Here is the updated sourcecode: https://gist.github.com/JohannesMP/7d62f282705169a2855a0aac315ff381
As mentioned before, optimizing the convolution step was not my priority.

How to color individual parts of curve in unity, real time?

So I have a mesh curve that I've imported from Blender. What I want to do is to place individual points on the curve (at fixed distance) and then based on a specific number, color them.
Let's say for instance number 1000 is color red and number 10 is color blue (based on color gradient). These numbers get updated real time, so I want my color to get updated real time.
I have no idea how to approach this problem. I've looked up some ideas but couldn't find anything useful.
Thank you.
Bad news, it's by no means easy to do this.
Unity is a game engine - it's just not relevant to that type of problem you know?
I believe the only real solution would be to do it at the shader level.
As you know writing shaders is a whole engineering field in itself. I suggest, just google things like "Unity3d color gradient, shader" in the first instance.
For example,
http://answers.unity3d.com/questions/1108472/3-color-linear-gradient-shader.html
One thing you can conceivably do. Make the rope white. Apply lights to it! So, colored narrow beam lights or carefully placed diffuse lights. Perhaps in conjunction with layers for the lighting. It's not inconceivable it could work, enjoy!
Note - in fact the OP solved the problem just using colored lights - a solution in some cases.
Please note, the GL api is perfect here also.
user2299169 gives an outstanding link in the comments above:
http://gamedev.stackexchange.com/questions/96964/how-to-correctly-draw-a-line-in-unity
GL Doco: https://docs.unity3d.com/ScriptReference/GL.LINES.html
Thanks user2299169.

OpenGL ES for iPhone blending not working

I'm a beginner to 3D graphics in general and I'm trying to make a 3D game for the iPhone, and more specifically, to use textures that contain transparency. I am able to load a texture (an 8 bit .png file) into OpenGL and map it to a square (made from a triangle strip) but the transparent parts of the image are not transparent when I run the app in the simulator - they take on the background colour, whatever it is set to, but obscure images that are further away. I am unable to post a screenshot as I am a new user, so my apologies for that. I will try to upload and link it some other way.
Even more annoying is that when I load the image into Apple's GLSprite example code, it works exactly as I want it to. I have copied the code from GLSprite's setupView into my project and it still doesn't work properly.
I am using the blend function:
glBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_ALPHA);
I was under the impression that this is correct for what I want to do.
Is there something very basic I am missing here? Any help would be much appreciated as I am submitting this as a coursework project in a few weeks and would very much like it to work.
Let me break this down:
First of all your transparent object is drawn.
At this point two things happen:
The pixels are drawn correctly to the back buffer
The depth buffer pixels are set in the depth buffer. Note that the depth buffer will write values all across your object, and transparency does not affect it.
You then draw other objects behind the transparent object.
But any of these objects pixels will not be drawn, because their depth buffer value are less than those already drawn.
The solution to this problem is to draw your scene back-to-front (draw starting at the further away things).
Hope that helps.
Edit: I'm assuming you are using the depth buffer here. If this isn't correct I'll consider writing another answer.