Programadores => Código de la Semana => Mensaje iniciado por: XÑA en 18 de Diciembre de 2016, 07:44:34 pm

Título: Video texturas con transparencia en Unity 5
Publicado por: XÑA en 18 de Diciembre de 2016, 07:44:34 pm
Hola a todos. Hace nada he tenido que resolver el problema de utilizar un vídeo con una transparencia y quería compartirlo, por si alguien tiene esa necesidad.

El vídeo tiene que tener un color que identifique la parte transparente y la técnica es utilizar un Shader para detectar ese color y modificar el Alpha. Pero no es tan sencillo, claro :)

En mi caso tenía un objeto UI, un Raw Image, que es el que recibe la texture movie. Eso no os da problemas, hay ejemplos en la web, el problema viene con el shader.

Bien, en el caso del RawImage, yo he añadido un Unlit:

Código: [Seleccionar]
Shader "Unlit/videoAlpha"
{
// Hay que asignar en el materail la opción Transparent en Render Queue
Properties
{
_MainTex ("Texture", 2D) = "white" {}
_AlphaMult ("Multiplicador Alpha",Range(0,1)) = 1
}
SubShader
{
Tags { "RenderType"="Opaque" }
LOD 100

Pass
{
Blend SrcAlpha OneMinusSrcAlpha

CGPROGRAM
#pragma vertex vert
#pragma fragment frag
// make fog work
#pragma multi_compile_fog

#include "UnityCG.cginc"

struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};

struct v2f
{
float2 uv : TEXCOORD0;
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};

sampler2D _MainTex;
float4 _MainTex_ST;
float _AlphaMult;

v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = TRANSFORM_TEX(v.uv, _MainTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}

fixed4 frag (v2f i) : SV_Target
{
// sample the texture
fixed4 col = tex2D(_MainTex, i.uv);
// Si el color rojo supera 0.9, entonces hago que el Alpha cambie.
if (col.r > 0.9) col.a = 1-col.r;
// Multiplico por una constante para poder forzar que sea más o menos transparente.
col.a *= _AlphaMult;
// apply fog
UNITY_APPLY_FOG(i.fogCoord, col);
return col;
}
ENDCG
}
}
}

Y ahora lo que hay que hacer es crear un material, asociar este shader al material y este material al objeto UI RawImage!!

Y todos diríamos...ya está!!! Pues no!!!!!! Hay que hacer una cosita más que es lo que me ha costado !!!

Os vais al material y cambiais el RenderQuee a 'Transparent' ....e voila!!!!

En mi caso, lo que tenía que tener transparencia era el color blanco, y el resto es gris, por eso he utilizado el: color.r>0.9 , pero eso ya depende totalmente del vídeo.

Disfrutadlo!!