I'm trying to animate a 2D game object using several overlaid layers of images in one mesh renderer. I've got several layers of different textures, each is an image with a transparent background.
I've found a way to programmatically create a rectangular mesh and layer the materials within it with UV mapping. Unfortunately Unity now has to render each of these material layers separately, despite the fact that they are all within one mesh. This results in a very inefficient number of draw calls. I can see that each material now has it's own shader as well.
Will I need to edit all of my images into one gigantic image outside of Unity and display portions of them using UV mapping in a single material within the mesh?
Or is there some way to achieve this with a shader?
Create your own Shader (Code or ShaderGraph). Shaders can render multiple Textures (layers). You can blend by alpha/transprency however you like.
ShaderGraph Code: https://pastebin.com/a8ubgxRP
application/vnd.unity.graphview.elements {
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.CopyPasteGraph",
"m_ObjectId": "82a0e513542e4106ae94a0ba8a6ec750",
"m_Edges": [
{
"m_OutputSlot": {
"m_Node": {
"m_Id": "a58e7e104e604e0b9e2961da5510e2bf"
},
"m_SlotId": 0
},
"m_InputSlot": {
"m_Node": {
"m_Id": "5e1616a6e87c470f8e3520b520b86bea"
},
"m_SlotId": 1
}
},
{
"m_OutputSlot": {
"m_Node": {
"m_Id": "5e1616a6e87c470f8e3520b520b86bea"
},
"m_SlotId": 0
},
"m_InputSlot": {
"m_Node": {
"m_Id": "b9bc9d71a2354d1ebadb93dab18e7223"
},
"m_SlotId": 0
}
},
{
"m_OutputSlot": {
"m_Node": {
"m_Id": "e5668fa7ac4e42fdaa32049802bd78b2"
},
"m_SlotId": 0
},
"m_InputSlot": {
"m_Node": {
"m_Id": "a275a2c058614973b0efd13817919cc6"
},
"m_SlotId": 1
}
},
{
"m_OutputSlot": {
"m_Node": {
"m_Id": "a275a2c058614973b0efd13817919cc6"
},
"m_SlotId": 0
},
"m_InputSlot": {
"m_Node": {
"m_Id": "b9bc9d71a2354d1ebadb93dab18e7223"
},
"m_SlotId": 1
}
},
{
"m_OutputSlot": {
"m_Node": {
"m_Id": "a275a2c058614973b0efd13817919cc6"
},
"m_SlotId": 7
},
"m_InputSlot": {
"m_Node": {
"m_Id": "b9bc9d71a2354d1ebadb93dab18e7223"
},
"m_SlotId": 3
}
}
],
"m_Nodes": [
{
"m_Id": "5e1616a6e87c470f8e3520b520b86bea"
},
{
"m_Id": "a275a2c058614973b0efd13817919cc6"
},
{
"m_Id": "e5668fa7ac4e42fdaa32049802bd78b2"
},
{
"m_Id": "b9bc9d71a2354d1ebadb93dab18e7223"
},
{
"m_Id": "a58e7e104e604e0b9e2961da5510e2bf"
}
],
"m_Groups": [],
"m_StickyNotes": [],
"m_Inputs": [],
"m_MetaProperties": [],
"m_MetaPropertyIds": [],
"m_MetaKeywords": [],
"m_MetaKeywordIds": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "09a8291e17ab424e8149728df0325ac7",
"m_Id": 5,
"m_DisplayName": "G",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "G",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "09adddb00a6a45ba89f015d46cc7e777",
"m_Id": 5,
"m_DisplayName": "G",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "G",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector4MaterialSlot",
"m_ObjectId": "254965f8ab4b456789bf3701f105035f",
"m_Id": 0,
"m_DisplayName": "RGBA",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "RGBA",
"m_StageCapability": 2,
"m_Value": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "394d8ab6d6254442a22a1d2a1d393090",
"m_Id": 4,
"m_DisplayName": "R",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "R",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.SampleTexture2DNode",
"m_ObjectId": "5e1616a6e87c470f8e3520b520b86bea",
"m_Group": {
"m_Id": ""
},
"m_Name": "Sample Texture 2D",
"m_DrawState": {
"m_Expanded": true,
"m_Position": {
"serializedVersion": "2",
"x": -1229.6002197265625,
"y": -552.0,
"width": 208.0000762939453,
"height": 433.6000061035156
}
},
"m_Slots": [
{
"m_Id": "7f1789f703db4759a2c2cbbdcee37bb7"
},
{
"m_Id": "fdbf06e354c64748bc51ee1f630dec56"
},
{
"m_Id": "09a8291e17ab424e8149728df0325ac7"
},
{
"m_Id": "e3d48a7642ee490d9e52742319616c2a"
},
{
"m_Id": "6ea82df60cc64a08a6d75d13343fa8b3"
},
{
"m_Id": "fcc275cddbd44f6491e5c6752757e36f"
},
{
"m_Id": "6f90ea7d44914d0985b264b8fdd91f89"
},
{
"m_Id": "f9c9786a2bcd475d9ad02b23429c97f6"
}
],
"synonyms": [],
"m_Precision": 0,
"m_PreviewExpanded": true,
"m_PreviewMode": 0,
"m_CustomColors": {
"m_SerializableColors": []
},
"m_TextureType": 0,
"m_NormalMapSpace": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.DynamicVectorMaterialSlot",
"m_ObjectId": "5f0e671f32cf47cda2dbaf52f3591216",
"m_Id": 2,
"m_DisplayName": "Out",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "Out",
"m_StageCapability": 3,
"m_Value": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
}
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DMaterialSlot",
"m_ObjectId": "69f238b9d6ec46009f9ad1e06532c289",
"m_Id": 0,
"m_DisplayName": "Out",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "Out",
"m_StageCapability": 3,
"m_BareResource": false
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "6a74085b28a4494f9928fbde7bb14ab4",
"m_Id": 6,
"m_DisplayName": "B",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "B",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "6ea82df60cc64a08a6d75d13343fa8b3",
"m_Id": 7,
"m_DisplayName": "A",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "A",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.UVMaterialSlot",
"m_ObjectId": "6f90ea7d44914d0985b264b8fdd91f89",
"m_Id": 2,
"m_DisplayName": "UV",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "UV",
"m_StageCapability": 3,
"m_Value": {
"x": 0.0,
"y": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0
},
"m_Labels": [],
"m_Channel": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.DynamicVectorMaterialSlot",
"m_ObjectId": "7d86c10d04514f1db34f1c03b5e0d07a",
"m_Id": 0,
"m_DisplayName": "Base",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Base",
"m_StageCapability": 3,
"m_Value": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
}
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector4MaterialSlot",
"m_ObjectId": "7f1789f703db4759a2c2cbbdcee37bb7",
"m_Id": 0,
"m_DisplayName": "RGBA",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "RGBA",
"m_StageCapability": 2,
"m_Value": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DMaterialSlot",
"m_ObjectId": "9cf09bc550a4468faa6908e33854182c",
"m_Id": 0,
"m_DisplayName": "Out",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "Out",
"m_StageCapability": 3,
"m_BareResource": false
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.UVMaterialSlot",
"m_ObjectId": "9f7246d6f2f84e50a35232a424585f47",
"m_Id": 2,
"m_DisplayName": "UV",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "UV",
"m_StageCapability": 3,
"m_Value": {
"x": 0.0,
"y": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0
},
"m_Labels": [],
"m_Channel": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.SampleTexture2DNode",
"m_ObjectId": "a275a2c058614973b0efd13817919cc6",
"m_Group": {
"m_Id": ""
},
"m_Name": "Sample Texture 2D",
"m_DrawState": {
"m_Expanded": true,
"m_Position": {
"serializedVersion": "2",
"x": -1236.8001708984375,
"y": -95.99998474121094,
"width": 208.00001525878907,
"height": 433.6000061035156
}
},
"m_Slots": [
{
"m_Id": "254965f8ab4b456789bf3701f105035f"
},
{
"m_Id": "394d8ab6d6254442a22a1d2a1d393090"
},
{
"m_Id": "09adddb00a6a45ba89f015d46cc7e777"
},
{
"m_Id": "6a74085b28a4494f9928fbde7bb14ab4"
},
{
"m_Id": "de7a0347276243dca2e037c26fdd8b82"
},
{
"m_Id": "f18732f84c8f40849bb8eb7fc6d31fb6"
},
{
"m_Id": "9f7246d6f2f84e50a35232a424585f47"
},
{
"m_Id": "f08fa5b4eede46afad513c1f5cb4539e"
}
],
"synonyms": [],
"m_Precision": 0,
"m_PreviewExpanded": true,
"m_PreviewMode": 0,
"m_CustomColors": {
"m_SerializableColors": []
},
"m_TextureType": 0,
"m_NormalMapSpace": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DAssetNode",
"m_ObjectId": "a58e7e104e604e0b9e2961da5510e2bf",
"m_Group": {
"m_Id": ""
},
"m_Name": "Texture 2D Asset",
"m_DrawState": {
"m_Expanded": true,
"m_Position": {
"serializedVersion": "2",
"x": -1484.8001708984375,
"y": -556.7999877929688,
"width": 145.5999755859375,
"height": 105.59998321533203
}
},
"m_Slots": [
{
"m_Id": "9cf09bc550a4468faa6908e33854182c"
}
],
"synonyms": [],
"m_Precision": 0,
"m_PreviewExpanded": true,
"m_PreviewMode": 0,
"m_CustomColors": {
"m_SerializableColors": []
},
"m_Texture": {
"m_SerializedTexture": "{\"texture\":{\"instanceID\":0}}",
"m_Guid": ""
}
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.DynamicVectorMaterialSlot",
"m_ObjectId": "aee1f01a0a34437095d6a66540ce346f",
"m_Id": 1,
"m_DisplayName": "Blend",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Blend",
"m_StageCapability": 3,
"m_Value": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
},
"m_DefaultValue": {
"x": 0.0,
"y": 0.0,
"z": 0.0,
"w": 0.0
}
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.BlendNode",
"m_ObjectId": "b9bc9d71a2354d1ebadb93dab18e7223",
"m_Group": {
"m_Id": ""
},
"m_Name": "Blend",
"m_DrawState": {
"m_Expanded": true,
"m_Position": {
"serializedVersion": "2",
"x": -852.800048828125,
"y": -306.3999938964844,
"width": 208.00001525878907,
"height": 360.0
}
},
"m_Slots": [
{
"m_Id": "7d86c10d04514f1db34f1c03b5e0d07a"
},
{
"m_Id": "aee1f01a0a34437095d6a66540ce346f"
},
{
"m_Id": "c868501ed3c14206b2d478b0ceb706bf"
},
{
"m_Id": "5f0e671f32cf47cda2dbaf52f3591216"
}
],
"synonyms": [],
"m_Precision": 0,
"m_PreviewExpanded": true,
"m_PreviewMode": 0,
"m_CustomColors": {
"m_SerializableColors": []
},
"m_BlendMode": 21
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "c868501ed3c14206b2d478b0ceb706bf",
"m_Id": 3,
"m_DisplayName": "Opacity",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Opacity",
"m_StageCapability": 3,
"m_Value": 1.0,
"m_DefaultValue": 1.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "de7a0347276243dca2e037c26fdd8b82",
"m_Id": 7,
"m_DisplayName": "A",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "A",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "e3d48a7642ee490d9e52742319616c2a",
"m_Id": 6,
"m_DisplayName": "B",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "B",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DAssetNode",
"m_ObjectId": "e5668fa7ac4e42fdaa32049802bd78b2",
"m_Group": {
"m_Id": ""
},
"m_Name": "Texture 2D Asset",
"m_DrawState": {
"m_Expanded": true,
"m_Position": {
"serializedVersion": "2",
"x": -1501.6002197265625,
"y": -96.79998779296875,
"width": 145.60009765625,
"height": 105.5999984741211
}
},
"m_Slots": [
{
"m_Id": "69f238b9d6ec46009f9ad1e06532c289"
}
],
"synonyms": [],
"m_Precision": 0,
"m_PreviewExpanded": true,
"m_PreviewMode": 0,
"m_CustomColors": {
"m_SerializableColors": []
},
"m_Texture": {
"m_SerializedTexture": "{\"texture\":{\"instanceID\":0}}",
"m_Guid": ""
}
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.SamplerStateMaterialSlot",
"m_ObjectId": "f08fa5b4eede46afad513c1f5cb4539e",
"m_Id": 3,
"m_DisplayName": "Sampler",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Sampler",
"m_StageCapability": 3,
"m_BareResource": false
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DInputMaterialSlot",
"m_ObjectId": "f18732f84c8f40849bb8eb7fc6d31fb6",
"m_Id": 1,
"m_DisplayName": "Texture",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Texture",
"m_StageCapability": 3,
"m_BareResource": false,
"m_Texture": {
"m_SerializedTexture": "{\"texture\":{\"instanceID\":0}}",
"m_Guid": ""
},
"m_DefaultType": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.SamplerStateMaterialSlot",
"m_ObjectId": "f9c9786a2bcd475d9ad02b23429c97f6",
"m_Id": 3,
"m_DisplayName": "Sampler",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Sampler",
"m_StageCapability": 3,
"m_BareResource": false
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Texture2DInputMaterialSlot",
"m_ObjectId": "fcc275cddbd44f6491e5c6752757e36f",
"m_Id": 1,
"m_DisplayName": "Texture",
"m_SlotType": 0,
"m_Hidden": false,
"m_ShaderOutputName": "Texture",
"m_StageCapability": 3,
"m_BareResource": false,
"m_Texture": {
"m_SerializedTexture": "{\"texture\":{\"instanceID\":0}}",
"m_Guid": ""
},
"m_DefaultType": 0
}
{
"m_SGVersion": 0,
"m_Type": "UnityEditor.ShaderGraph.Vector1MaterialSlot",
"m_ObjectId": "fdbf06e354c64748bc51ee1f630dec56",
"m_Id": 4,
"m_DisplayName": "R",
"m_SlotType": 1,
"m_Hidden": false,
"m_ShaderOutputName": "R",
"m_StageCapability": 2,
"m_Value": 0.0,
"m_DefaultValue": 0.0,
"m_Labels": []
}