I'm trying to put the anyportrait animation inside my UI Image, I'm using Raw Image component to do this
I have a camera in my scene render to a render texture and put it inside my raw texture and then put the raw texture inside my raw image. Problem is it's not showing anything unless there's another image inside the camera (i think this is a shader problem)
Look at how it's rendered inside camera without a problem
but when I put it inside a render texture and put it inside raw image, it becomes like this
notice how only a small part of the character is visible, this is because there's a square image behind the character. It doesn't render anything if I don't put anything behind the character, but If I put a big square behind the character then the background won't be visible like this
Is there any way to render anyportrait inside Unity UI?
Hi!
It seems that you are burdened with writing shaders.
So, we deliver the Shader script files introduced in the Sprite Mask example.
Attach the attached "Unitypackage" file to your project and apply it as the following description.
(1) A scene was created for the explanation.
There are an object with "Sprite Renderer + Sprite Mask" and an "AnyPortrait character object".
(2) If you import the attached package, 8 Shader files will be added as above.
(1) Select a character and open it with AnyPortrait editor, and select "Root Unit".
(2) Click the "Material Library" button.
(3) We will duplicate "Unlit (Default)", which is set by default. Choose it
(4) Click the "Duplicate" button.
(5) Now, an "Unlit (Default) Copy" will be created as above.
This Material Set is a set of Shaders that render the character.
By modifying this, you can change the shaders applied to the character.
(1) Select the duplicated "Unlit (Default) Copy".
(2) Rename the Material Set appropriately.
(3) Press the "Default Material" button to make it "ON". Only in this state will this material set be applied when baking.
Now we will replace the Shaders.
If you do not use "Linear Color Space", you can replace 8 Shaders in "1. Color Space : Gamma". (If you are in a hurry, you only need to replace 2 of Alpha Blend.)
(4) Let's replace the Shader file in "Basic Rendering > Alpha Blend".
(5) Since there are many files, you can easily find them by entering "Stencil", the common keyword of the attached files.
(6) Select the "Stencil_Transparent_AlphaBlend" file corresponding to the selected item.
Repeat the same process to replace all 8 Shaders as above.
You now configured the Material Set to apply the Sprite Mask.
Note that.
If you want to apply this material set to other characters, you can save it as a "Material Preset".
Just click the "Register as a Preset" button. Check the "Material Library" manual for details.
https://rainyrizzle.github.io/en/AdvancedManual/AD_MaterialLibrary.html
When complete, run Bake to apply it to the Unity Scene.
Go back to your Unity Scene.
To use a Sprite as a mask, it must be set as above.
(1) Select a Sprite object to use as a mask.
(2) The "Sprite Mask" component must be added to the object.
(3) If all tasks are completed, you can see the AnyPortrait character with Mask applied as above.
This process is all introduced in the manual.
https://rainyrizzle.github.io/en/AdvancedManual/AD_SpriteMask.html
Note that since the Sprite Mask uses a stencil, blur or translucent are not applied to the edges of the mask.
We hope our explanation was helpful to you.
Thank you
I see, too bad there's no solution for this
I'm not good at coding shader and that might rise more problems too
I really appreciate the fast replies, thanks a lot
Glad your problem is resolved!
To apply the mask, you have to do a bit of hard process.
If the image you want to use as a mask is a "Sprite" type, you can use the Mask function built into the Sprite Renderer.
In order to apply the Sprite Renderer's Mask function to AnyPortrait, you must write a shader yourself.
How to apply Sprite Mask can be found in the following manual.
https://rainyrizzle.github.io/en/AdvancedManual/AD_SpriteMask.html
If you write a custom shader, you will be able to implement various types of masks besides Sprite Masks.
You could use screen coordinates or 3D Meshes as masks.
But it won't be an easy task as you will have to write a custom shader.
If needed - and the discussion returns to the beginning - you could also use a Render Texture.
(https://rainyrizzle.github.io/en/AdvancedManual/AD_RenderTexture.html)
Depending on how you implement it, you may need the following complex manual.
https://rainyrizzle.github.io/en/AdvancedManual/AD_CommandBuffer.html
Either way, we think, you will need to write a custom shader, so we recommend that you decide carefully how you implement it.
This is no easy task, so if you have any more questions, please leave a comment.
(If you think there will be a lot of questions, please write a new article.)
Thank you.
Thanks a lot, that ambient light color fixed it!
Now to my last problem
Is it possible to mask the character? i want the character to be inside the window
Hi!
We're glad that the previous issue has been resolved.
Brighter colors usually appear when Ambient Light Color is not Black.
Of course, there is a variety of reasons (e.g. shaders or other settings.) that occurs the color problem.
Look at the following manual and check out Ambient Light.
https://rainyrizzle.github.io/en/AdvancedManual/AD_LightingScene.html
If the problem is not resolved, you may need to check that Light objects are placed in the scene, or how the shader and rendering settings are configured.
Please look at our answer and leave a comment if the problem is not resolved.
We would appreciate it if you could let us know about the settings related to lightings (the lighting menu of the project, whether or not the light is placed in the scene, the Shader of AnyPortrait used, etc.).
Thanks.
so I tried without using render texture, it's working fine but i'm having a problem. For some reason there are scenes where the character is rendered too bright even with the exact same settings. I don't know what's causing this, I even check that the color of the mesh is the same
how do i fix this?
Hi!
Resolving rendering issues with a transparent background Render Texture is a fairly complex issue.
Because it has to do with Unity's Render Pipeline.
The simplest way to solve this problem is to use a material with the "KeepAlpha" shader provided by AnyPortrait.
Applying the KeepAlpha material provided by the "Material Library" in the AnyPortrait editor will solve this problem for you.
You can check this issue and solution in detail in the following manual.
https://rainyrizzle.github.io/en/AdvancedManual/AD_RenderTexture.html
Among the contents of the above manual, "Render the Render Textures with a translucent or transparent background" will be helpful for you.
In addition, we recommend that you check all the various issues with Render Texture.
However, the "KeepAlpha" material has a problem with translucent colors being calculated strangely.
So, to solve this problem perfectly, you need to write a script that uses "Command Buffer".
It's very complex, so it's hard for us to give you an easy recommendation.
If you want to render in high quality, the following manual will help you.
(The topic "Rendering the Render Texture with a Transparent Background" covers this issue.)
https://rainyrizzle.github.io/en/AdvancedManual/AD_CommandBuffer.html
In fact, the best option in your case may be to not use a Render Texture.
If you want to use Render Texture because AnyPortrait is not rendered on Canvas, consider the following two approaches.
(1) Make settings to render AnyPortrait characters on Canvas.
Since Canvas has a separate coordinate system, it is not perfectly compatible with AnyPortrait based on Mesh Renderer.
However, in some settings of Canvas, Mesh Renderer renders normally, so AnyPortrait will also render at this time normally.
Please check the following manual.
https://rainyrizzle.github.io/en/AdvancedManual/AD_2DCanvas.html
(2) Use multiple cameras.
This method is used in all games that use both 3D and 2D techniques.
Place multiple cameras in your scene to render "Screen Background", "Character (usually 3D)", and "UI" respectively.
AnyPortrait works normally with all cameras other than Canvas.
So, adding a camera that renders the AnyPortrait character solves this problem.
We think this method is the best!
If you have any more questions about our suggested solution, please leave a comment!
If necessary, we can provide more specific instructions on how to resolve the issue.
Check out the above solutions one by one!
Thank you.