funkey/RetroFE
1
0
Fork 0
mirror of https://github.com/FunKey-Project/RetroFE.git synced 2025-12-25 08:08:55 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity
RetroFE/Package/Environment/Common/layouts/Default 16x9/layout.xml

370 lines
17 KiB
XML
Raw Blame History

<layout width="1920" height="1080" font="Roboto-Bold.ttf" loadFontSize="32" fontColor="EEEEEEE">
<sound type="load" src="load.wav" />
<sound type="unload" src="unload.wav" />
<sound type="highlight" src="highlight.wav" />
<sound type="select" src="select.wav" />
<!--Imageless background example-->
<!--This layout does not use containers here is an example of one used as a background. These can be any size-->
<!-- <container backgroundColor="262626" backgroundAlpha="1.0" x="0" y="0" height="stretch" width="stretch" layer="0"/> -->
<!--Background Image-->
<image src="bkgnd.png" x="0" y="0" height="stretch" width="stretch" layer="0"/>
<!-----------------MAIN MENU Section----------------->
<!-- This is the title text that shows at the bottom of the main menu list. -->
<reloadableText type="title" x="center" y="center" xOrigin="center" yOrigin="center" yOffset="394" fontSize="48" layer="5">
<onMenuEnter menuIndex="0">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="0">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableText>
<!--Main Menu Background-->
<!--This image is the main menu bar background Notice that it has its animations set to menuIndex="0". as it is only shown for the top most menu -->
<image src="barbkgrnd.png" x="center" y="center" yOffset="300" xOrigin="center" yOrigin="center" layer="5">
<onMenuExit menuIndex="0">
<set duration=".4">
<animate type="xOffset" from="0" to="-1028" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
<onMenuEnter menuIndex="0">
<set duration=".4">
<animate type="xOffset" from="-1028" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
</image>
<!--Main Menu index 0-->
<!-- This is the main menu. It is set to show game logo images instead of text -->
<menu type="custom" imageType="logo" scrollTime=".24" scrollAcceleration=".04" orientation="horizontal" x="0" width="center" y="center" yOffset="260" algorithm="easeincircular" >
<!-- itemDefaults allow you to set default attributes for all items in a menu list An item may still have its own attributes that override the defaults -->
<!-- Notice that xOffset and yOffset are set to center. This puts a pin in the very center of the image(or item). Normally it is in the top left corner of the image. From that pin we will put the coordinates of where we wish the image to be. In this case the the center of the screen x="center" and y="center". Now yOffset="260" is moves the image 260 additional pixels towards the bottom. yOffset="-260" would move it 260 pixels towards the top -->
<itemDefaults x="center" y="center" yOrigin="center" xOrigin="center" width="300" spacing="10" yOffset="260" alpha="0.5" fontSize="35" layer="6"/>
<!-- In this menu each item is placed. notice that the first and last item of this menu are alpha="0" if this is not done you would see the last time of the menu move to be the first when scrolling. -->
<item xOffset="-1420" alpha="0" />
<item xOffset="-1060">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<item xOffset="-720">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<item xOffset="-380">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<!-- This is the Selected item of the menu we override the width and alpha here to make it more clear that it is indeed selected -->
<!-- we also have animations inplace so that this logo stays visable and moves to another location when entering the sub menu -->
<item selected="true" width="400" layer="7" alpha="1">
<onMenuExit>
<set duration=".4">
<animate type="xOffset" from="0" to="-710" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
<onMenuEnter>
<set duration=".4">
<animate type="xOffset" from="-710" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
</item>
<item xOffset="380">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<item xOffset="720">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<item xOffset="1060">
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="0.5" algorithm="easeincircular"/>
</set>
</onMenuEnter>
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="0.5" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
</item>
<item xOffset="1420" alpha="0" />
</menu>
<!-----------------SUB MENU----------------->
<!--Sub Menu index 1-->
<menu orientation="vertical" scrollTime=".24" scrollAcceleration=".04" algorithm="easeincircular" y="638" width="940" height="380">
<itemDefaults spacing="4" x="center" height="32" width="400" maxWidth="910" fontSize="32" alpha="1" xOrigin="left" xOffset="20" layer="5">
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="1" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="1" algorithm="easeincircular"/>
</set>
</onMenuEnter>
</itemDefaults>
<item index="start" spacing="0" alpha="0"/>
<item index="4" spacing="8" height="48" fontSize="48" alpha="1" selected="true">
<onMenuExit>
<set duration=".25">
<animate type="alpha" from="1" to="0" algorithm="easeincircular"/>
</set>
</onMenuExit>
<onMenuEnter>
<set duration=".25">
<animate type="alpha" from="0" to="1" algorithm="easeincircular"/>
</set>
</onMenuEnter>
</item>
<item index="last" spacing="10.5" alpha="0"/>
<item index="end" spacing="10.5" alpha="0"/>
</menu>
<!-- Title Text shown on the sub menu -->
<reloadableText type="title" x="center" alpha="0" y="center" xOrigin="center" yOrigin="center" xOffset="380" yOffset="20" fontSize="48" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableText>
<!-- Background image for the sub menu list -->
<image src="menubk.png" yOffset="300" x="center" xOffset="1500" y="center" xOrigin="center" yOrigin="center" layer="4">
<onMenuEnter menuIndex="1">
<set duration=".4">
<animate type="xOffset" from="1500" to="500" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".4">
<animate type="xOffset" from="500" to="1500" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</image>
<!-- This is the bar that is under the selected item of the sub menu list -->
<image src="highlight.png" yOffset="300" x="center" xOffset="1500" y="center" xOrigin="center" yOrigin="center" layer="4">
<onMenuEnter menuIndex="1">
<set duration=".4">
<animate type="xOffset" from="1500" to="500" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".4">
<animate type="xOffset" from="500" to="1500" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
<onIdle menuIndex="1">
<set duration=".4">
<animate type="alpha" from="1" to=".6" />
</set>
<set duration=".4">
<animate type="alpha" from=".6" to="1"/>
</set>
</onIdle>
</image>
<!-- This is the game title that is over the video in the sub menu -->
<reloadableImage type="logo" alpha="0" xOffset="-740" yOffset="-382" x="center" y="center" angle="-20" xOrigin="center" yOrigin="center" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableImage>
<!-- This is the games publisher-developer logo -->
<reloadableImage type="_manufacturer" alpha="0" xOffset="-282" yOffset="260" x="center" y="center" xOrigin="center" yOrigin="center" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableImage>
<!-- This is a Text item. It has no function other than displaying "Released:" -->
<text value="Released:" alpha="0" x="center" y="center" xOrigin="right" yOrigin="center" xOffset="-510" yOffset="394" fontSize="48" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</text>
<reloadableText type="year" alpha="0"x="center" y="center" xOrigin="left" yOrigin="center" xOffset="-506" yOffset="394" fontSize="48" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableText>
<!-- This is the games box or flyer or CD Case art -->
<!-- The maxHeight and width prevent the image from being sized large than intended -->
<!-- if i want the images in a 500x500px space and there are different size images a 1000x500px flyer for example. maxHeight/Width will keep the image within that space -->
<reloadableImage type="artwork_front" alpha="0" xOffset="145" yOffset="-240" x="center" maxHeight="405" maxWidth="405" y="center" xOrigin="center" yOrigin="center" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableImage>
<!-- This is the games Cartridge or CD image -->
<reloadableImage type="medium_front" alpha="0" xOffset="617" yOffset="-240" x="center" maxHeight="405" height="405" maxWidth="405" y="center" xOrigin="center" yOrigin="center" layer="5">
<onMenuEnter menuIndex="1">
<set duration=".2">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".2">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</reloadableImage>
<!-- This is the background for the video in the submenu -->
<image src="videobk.png" xOffset="-540" yOffset="-800" x="center" y="center" xOrigin="center" yOrigin="center" layer="2">
<onMenuEnter menuIndex="1">
<set duration=".4">
<animate type="yOffset" from="-800" to="-200" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".4">
<animate type="yOffset" from="-200" to="-800" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</image>
<!-- This is the background for the Cartridge and Box art in the submenu -->
<image src="infobk.png" xOffset="380" yOffset="-800" x="center" y="center" xOrigin="center" yOrigin="center" layer="4">
<onMenuEnter menuIndex="1">
<set duration=".4">
<animate type="yOffset" from="-800" to="-200" algorithm="easeinquadratic"/>
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".4">
<animate type="yOffset" from="-200" to="-800" algorithm="easeinquadratic"/>
</set>
</onMenuExit>
</image>
<!-- This is the gameplay video. It is the same item in the main menu and sub menu -->
<!-- imageType="screenshot" means that it will show a screenshot instead if a video is not found-->
<reloadableVideo imageType="screenshot" x="center" alpha="0.2" height="1440" y="center" yOrigin="center" layer="3" xOrigin="center" >
<onMenuEnter menuIndex="1">
<set duration=".25">
<animate type="xOffset" from="0" to="-540"/>
<animate type="yOffset" from="0" to="-200" />
<animate type="height" from="1440" to="480" />
<animate type="alpha" from=".2" to="1" />
</set>
</onMenuEnter>
<onMenuExit menuIndex="1">
<set duration=".25">
<animate type="xOffset" to="0" from="-540"/>
<animate type="yOffset" to="0" from="-200" />
<animate type="height" to="1440" from="480" />
<animate type="alpha" from="1" to="0.2" />
</set>
</onMenuExit>
<onHighlightEnter menuIndex="0">
<set duration=".3">
<animate type="alpha" from="0" to="0.2" algorithm="easeinquadratic"/>
</set>
</onHighlightEnter>
<onHighlightExit menuIndex="0">
<set duration=".3">
<animate type="alpha" from="0.2" to="0" algorithm="easeinquadratic"/>
</set>
</onHighlightExit>
<onHighlightEnter menuIndex="1">
<set duration=".3">
<animate type="alpha" from="0" to="1" algorithm="easeinquadratic"/>
</set>
</onHighlightEnter>
<onHighlightExit menuIndex="1">
<set duration=".3">
<animate type="alpha" from="1" to="0" algorithm="easeinquadratic"/>
</set>
</onHighlightExit>
</reloadableVideo>
</layout>
Reference in New Issue View Git Blame Copy Permalink