[{"data":1,"prerenderedAt":418},["ShallowReactive",2],{"doc-global_essentials\u002Fcharacters\u002Fcharacter_views":3},{"id":4,"title":5,"body":6,"description":16,"extension":409,"meta":410,"navigation":258,"path":414,"seo":415,"stem":416,"__hash__":417},"docs\u002Fdocs\u002Fglobal_essentials\u002Fcharacters\u002Fcharacter_views.md","Character Views",{"type":7,"value":8,"toc":400},"minimark",[9,13,17,24,29,45,59,64,85,89,105,109,116,193,196,200,214,277,283,301,305,396],[10,11,5],"h1",{"id":12},"character-views",[14,15,16],"p",{},"Character Views is an advanced feature for rendering characters from different angles or perspectives. It is used by plugins and custom components that need alternative character visuals -- for example, showing a character's back during RPG battles or a side profile in a cutscene.",[14,18,19,23],{},[20,21,22],"strong",{},"You do not need Character Views for standard use."," Scenes, character sheets, dialogue portraits, and galleries all use the default base rendering automatically. Only define views when building custom rendering systems (e.g., battle plugins) that require non-standard character art.",[25,26,28],"h2",{"id":27},"how-it-works","How It Works",[14,30,31,32,35,36,39,40,44],{},"Characters are rendered using ",[20,33,34],{},"skin layers"," (static images) and optionally ",[20,37,38],{},"Spine animations",". By default, all layers without a ",[41,42,43],"code",{},"view"," tag are rendered -- these are the base layers.",[14,46,47,48,50,51,54,55,58],{},"When a ",[41,49,43],{}," is defined in the ",[20,52,53],{},"Characters > Views"," editor tab, it can be assigned to specific skin layers or spine configurations. Those tagged layers are then ",[20,56,57],{},"excluded from default rendering"," and only appear when explicitly requested by a component.",[60,61,63],"h3",{"id":62},"defining-views","Defining Views",[65,66,67,74],"ol",{},[68,69,70,71,73],"li",{},"Go to ",[20,72,53],{}," in the engine editor",[68,75,76,77,80,81,84],{},"Create a new view entry (e.g., ",[41,78,79],{},"id: \"back\"",", ",[41,82,83],{},"name: \"Back\"",")",[60,86,88],{"id":87},"tagging-skin-layers","Tagging Skin Layers",[65,90,91,96,102],{},[68,92,70,93],{},[20,94,95],{},"Characters > Skin Layers",[68,97,98,99,101],{},"On any layer, set the ",[41,100,43],{}," dropdown to your defined view (e.g., \"back\")",[68,103,104],{},"That layer will no longer render in default mode -- it only renders when the view is requested",[60,106,108],{"id":107},"spine-views","Spine Views",[14,110,111,112,115],{},"Character templates and statuses support ",[41,113,114],{},"spine_views"," -- an array of Spine configurations for specific views:",[117,118,123],"pre",{"className":119,"code":120,"language":121,"meta":122,"style":122},"language-json shiki shiki-themes github-light github-dark","\"spine_views\": [\n  { \"id\": \"back\", \"atlas\": \"path\u002Fto\u002Fback.atlas\", \"skeleton\": \"path\u002Fto\u002Fback.skel\", \"default_animation\": \"idle\" }\n]\n","json","",[41,124,125,138,187],{"__ignoreMap":122},[126,127,130,134],"span",{"class":128,"line":129},"line",1,[126,131,133],{"class":132},"sZZnC","\"spine_views\"",[126,135,137],{"class":136},"sVt8B",": [\n",[126,139,141,144,148,151,154,156,159,161,164,166,169,171,174,176,179,181,184],{"class":128,"line":140},2,[126,142,143],{"class":136},"  { ",[126,145,147],{"class":146},"sj4cs","\"id\"",[126,149,150],{"class":136},": ",[126,152,153],{"class":132},"\"back\"",[126,155,80],{"class":136},[126,157,158],{"class":146},"\"atlas\"",[126,160,150],{"class":136},[126,162,163],{"class":132},"\"path\u002Fto\u002Fback.atlas\"",[126,165,80],{"class":136},[126,167,168],{"class":146},"\"skeleton\"",[126,170,150],{"class":136},[126,172,173],{"class":132},"\"path\u002Fto\u002Fback.skel\"",[126,175,80],{"class":136},[126,177,178],{"class":146},"\"default_animation\"",[126,180,150],{"class":136},[126,182,183],{"class":132},"\"idle\"",[126,185,186],{"class":136}," }\n",[126,188,190],{"class":128,"line":189},3,[126,191,192],{"class":136},"]\n",[14,194,195],{},"Each entry overrides the default Spine rendering when the matching view is requested. A character can have a static base doll and a Spine back-view, or vice versa.",[25,197,199],{"id":198},"using-views-in-components","Using Views in Components",[14,201,202,203,205,206,209,210,213],{},"Pass the ",[41,204,43],{}," prop to ",[41,207,208],{},"CharacterDoll"," or ",[41,211,212],{},"CharacterSlot"," to request a specific view:",[117,215,219],{"className":216,"code":217,"language":218,"meta":122,"style":122},"language-javascript shiki shiki-themes github-light github-dark","\u002F\u002F Render the character's back view\n\u003CCharacterSlot :character=\"char\" :slot=\"slot\" view=\"back\" \u002F>\n\n\u002F\u002F Default rendering (base layers only, no view prop needed)\n\u003CCharacterDoll :character=\"char\" \u002F>\n","javascript",[41,220,221,227,254,260,266],{"__ignoreMap":122},[126,222,223],{"class":128,"line":129},[126,224,226],{"class":225},"sJ8bj","\u002F\u002F Render the character's back view\n",[126,228,229,232,234,238,241,245,249,251],{"class":128,"line":140},[126,230,231],{"class":136},"\u003C",[126,233,212],{"class":146},[126,235,237],{"class":236},"s7hpK"," :character=\"char\"",[126,239,240],{"class":236}," :slot=\"slot\"",[126,242,244],{"class":243},"sScJk"," view",[126,246,248],{"class":247},"szBVR","=",[126,250,153],{"class":132},[126,252,253],{"class":136}," \u002F>\n",[126,255,256],{"class":128,"line":189},[126,257,259],{"emptyLinePlaceholder":258},true,"\n",[126,261,263],{"class":128,"line":262},4,[126,264,265],{"class":225},"\u002F\u002F Default rendering (base layers only, no view prop needed)\n",[126,267,269,271,273,275],{"class":128,"line":268},5,[126,270,231],{"class":136},[126,272,208],{"class":146},[126,274,237],{"class":236},[126,276,253],{"class":136},[14,278,279,280,282],{},"When ",[41,281,43],{}," is provided:",[284,285,286,295,298],"ul",{},[68,287,288,289,291,292],{},"Base layers (no ",[41,290,43],{}," tag) are ",[20,293,294],{},"not rendered",[68,296,297],{},"Only layers matching the requested view are rendered",[68,299,300],{},"If a matching spine entry exists for that view, it overrides the default Spine config",[25,302,304],{"id":303},"script-api","Script API",[117,306,308],{"className":216,"code":307,"language":218,"meta":122,"style":122},"\u002F\u002F Check if a character has a spine config for a specific view\ncharacter.isSpineForView('back');\n\n\u002F\u002F Get the spine config for a view (returns null if not defined)\nconst config = character.getSpineForView('back');\n\n\u002F\u002F Get filtered image layers for a specific view\nconst layers = character.getImageLayersForView('back');\n",[41,309,310,315,332,336,341,364,369,375],{"__ignoreMap":122},[126,311,312],{"class":128,"line":129},[126,313,314],{"class":225},"\u002F\u002F Check if a character has a spine config for a specific view\n",[126,316,317,320,323,326,329],{"class":128,"line":140},[126,318,319],{"class":136},"character.",[126,321,322],{"class":243},"isSpineForView",[126,324,325],{"class":136},"(",[126,327,328],{"class":132},"'back'",[126,330,331],{"class":136},");\n",[126,333,334],{"class":128,"line":189},[126,335,259],{"emptyLinePlaceholder":258},[126,337,338],{"class":128,"line":262},[126,339,340],{"class":225},"\u002F\u002F Get the spine config for a view (returns null if not defined)\n",[126,342,343,346,349,352,355,358,360,362],{"class":128,"line":268},[126,344,345],{"class":247},"const",[126,347,348],{"class":146}," config",[126,350,351],{"class":247}," =",[126,353,354],{"class":136}," character.",[126,356,357],{"class":243},"getSpineForView",[126,359,325],{"class":136},[126,361,328],{"class":132},[126,363,331],{"class":136},[126,365,367],{"class":128,"line":366},6,[126,368,259],{"emptyLinePlaceholder":258},[126,370,372],{"class":128,"line":371},7,[126,373,374],{"class":225},"\u002F\u002F Get filtered image layers for a specific view\n",[126,376,378,380,383,385,387,390,392,394],{"class":128,"line":377},8,[126,379,345],{"class":247},[126,381,382],{"class":146}," layers",[126,384,351],{"class":247},[126,386,354],{"class":136},[126,388,389],{"class":243},"getImageLayersForView",[126,391,325],{"class":136},[126,393,328],{"class":132},[126,395,331],{"class":136},[397,398,399],"style",{},"html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .s7hpK, html code.shiki .s7hpK{--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}",{"title":122,"searchDepth":140,"depth":140,"links":401},[402,407,408],{"id":27,"depth":140,"text":28,"children":403},[404,405,406],{"id":62,"depth":189,"text":63},{"id":87,"depth":189,"text":88},{"id":107,"depth":189,"text":108},{"id":198,"depth":140,"text":199},{"id":303,"depth":140,"text":304},"md",{"plugin":411,"category":412,"page":413},"global_essentials","characters","character_views","\u002Fdocs\u002Fglobal_essentials\u002Fcharacters\u002Fcharacter_views",{"title":5,"description":16},"docs\u002Fglobal_essentials\u002Fcharacters\u002Fcharacter_views","EsQQIyTmkJu3Ctk8Kq7hm5feR2c9ZKPJY_EIX8frsms",1779582261233]