Wayback Machinekoobas.hobune.stream
May JUN Jul
Previous capture 13 Next capture
2021 2022 2023
1 capture
13 Jun 22 - 13 Jun 22
sparklines
Close Help
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
avatar image
0
Question by laurienash · Nov 02, 2014 at 05:42 PM · guishaders

Replace GUI texture colour with increased saturation of background?

Hi!

I was wondering whether anyone had any pointers as to how the best way to go about this.

The central grey rectangle shape in the centre of the image is a photoshop .png which I have attached to a GUI texture. But instead of it being a transparent colour laid over the top of the background - I want the colour instead to be an increased saturation of the game scene.

I'm struggling to find the best way to go about this - I've been looking into using shaders, but I can't work out how to apply it to only the shape of the box you can see below. (And ideally with a fading gradient as can be seen in the photoshop image - with the increased saturation replacing the grey)

Sorry for the newbie question - I was just hoping for some tips as to where to direct my search, as I'm struggling at the moment!

All the best, Laurien

alt text

alt text

screen shot 2014-11-02 at 17.32.46.png (448.6 kB)
screen shot 2014-11-02 at 17.36.51.png (73.2 kB)
Comment
Add comment
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users

1 Reply

· Add your reply
  • Sort: 
avatar image
2
Best Answer

Answer by Scribe · Nov 03, 2014 at 01:21 AM

Hey there!

If you have unity pro you can do this quite easily with RenderTextures and Image Effects, however if you are like me and don't have pro, the easiest way I can get to work reasonably well is to use Camera.SetReplacementShader with some for of saturation shader and mask image. Below I have added my test shader code and the code that you would attach to your main camera. You will probably need to add some more functionality to the shader code for bump and specular maps as I can see you have those in your scene screenshot but this should get you some way towards your target!

The code to attach to your main camera:

This code toggles the saturation effect on pressing 'Q', in the inspector you need to set the shader to a variation on the shader attached below, the mask to some texture such as the one you attached in the screenshot above and you should set f to control how strongly the masked area should be saturated!

 public Shader s;
 public Texture mask;
 public float f = 1;
 bool isOn = false;
 void Start(){
     Shader.SetGlobalTexture("_MaskTex", mask);
     f = Mathf.Clamp(f, 0, 5);
     Shader.SetGlobalFloat("_Sat", f);
 }
 
 void Update(){
     f = Mathf.Clamp(f, 0, 5);
     Shader.SetGlobalFloat("_Sat", f);
     if(Input.GetKeyDown(KeyCode.Q)){
         isOn = !isOn;
         if(isOn){
             camera.SetReplacementShader(s, "");
         }else{
             camera.ResetReplacementShader();
         }
     }
 }


The shader code:

You will need to add bump map and specular map functionality to this based on how the other shaders in your scene are set-up but it should still ~work~ as it is.

 Shader "Transparent/SaturationMask" {
     Properties {
         _Color ("Main Color", Color) = (1,1,1,1)
         _MainTex ("Base (RGB) Trans (A)", 2D) = "white" {}
         _MaskTex ("Mask Texture", 2D) = "white" {}
         _Sat ("Saturation", Range(0, 5.0)) = 0
     }
 
     SubShader {
         Tags {"Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent"}
         LOD 200
         Cull Off
 
         CGPROGRAM
         #pragma surface surf Lambert alpha
 
         sampler2D _MainTex;
         sampler2D _MaskTex;
         fixed4 _Color;
         float _Sat;
 
         struct Input {
             float2 uv_MainTex;
             float4 screenPos;
         };
 
         void surf (Input IN, inout SurfaceOutput o) {
             fixed4 c = tex2D(_MainTex, IN.uv_MainTex) * _Color;
             float2 screenUV = IN.screenPos.xy / IN.screenPos.w;
             fixed4 mC = tex2D(_MaskTex, screenUV);
             
             if(mC.a == 0){
                 o.Albedo = c.rgb;
                 o.Alpha = c.a;
             }else{
                 float s = _Sat;
                 float d = sqrt(c.r*c.r+c.g*c.g+c.b*c.b);
                 fixed4 satC = c;
                 satC.r = d + (c.r-d)*s;
                 satC.g = d + (c.g-d)*s;
                 satC.b = d + (c.b-d)*s;
                 o.Albedo = c.rgb + satC*mC.a;
                 o.Alpha = c.a;
             }
         }
         ENDCG
     }
     Fallback "Transparent/Diffuse"
 }


I hope that helps you on your way!

Scribe

Comment
Add comment · Show 5 · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image Scribe · Nov 03, 2014 at 02:08 PM 1
Share

Just realised, line 42 in the shader script should be o.Albedo = c.rgb*(1-mC.a) + satC.rgb*mC.a; for a real saturation effect, but the effect it has now is very similar!

avatar image laurienash · Nov 03, 2014 at 02:19 PM 0
Share

Hi - sorry!

I'm getting a parsing error on the line Shader "Transparent/Saturation$$anonymous$$ask" {

Assets/Scripts/Shader_code.cs(5,35): error CS8025: Parsing error

I've been going through it a while but I just can't work out what's wrong - any ideas?

(Thanks for the code advice by the way! That's so much for helpful than I was hoping for!)

avatar image Scribe · Nov 03, 2014 at 02:31 PM 0
Share

The shader code should not be a C# script as it looks like you have made it, in your project window right click and go to create->shader and replace all of the code in the created shader to what I posted. Then drag that shader asset onto the other script in the inspector!

avatar image laurienash · Nov 03, 2014 at 04:43 PM 0
Share

Thank you so much - that's worked so well, I'm so happy!

You're right, I need to set up the shader code for bump and specular maps, I'll have a look into how I should go about that now :)

avatar image Scribe · Nov 03, 2014 at 05:46 PM 0
Share

I'm glad you managed to get it working! Shader coding is not easy, but you should be able to mostly just copy how the _$$anonymous$$ainTex stuff is used. Good luck :)

Your answer

Hint: You can notify a user about this post by typing @username

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this Question

Answers Answers and Comments

27 People are following this question.

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Related Questions

GUI and Shader problem on specific Android devices (HTC ONE X) 0 Answers

SetTexture In A UI Material Doesn't Update Immediately 0 Answers

How to create a ripple like effect on the GUI based on ingame data? 0 Answers

Why are all my GUITexture elements semi-transparent? 0 Answers

3, 2, 1 GO! 3 Answers


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges