Full screen video in video view

SpaceBlaze

Raspberry Pi 3B+
RetroPie 4.7.1

I'm in the process of building my first theme in emultation station.

Screen is set to vertical and has a vertical scrolling menu to select the "system". System's are actually custom collections. All the games are vertical arcade shmups divided by developers (Psikyo, Cave, Toaplan etc). I've made videos of the arcade intro screen for each. What I would like is that when you enter the collection you see a full screen video and can scroll up and down to change the video/game and push A to start to play. The effect is like scrolling through multiple arcade games. Left/right changed the collection. At least, that's the plan...

Functionality wise it works but I'm having issues with the display of the video. I can't seem to get it to display fullscreen.

I followed instructions from this doc https://retropie.org.uk/docs/Creating-Your-Own-EmulationStation-Theme/#video-view

I changed the video code to

	<view name="video">
    	<video name="md_video">
		<zIndex>55</zIndex>
        	<origin>0.5 0.5</origin>
        	<pos>0.5 0.5</pos>
        	<maxSize>1 1</maxSize>
        	<showSnapshotNoVideo>true</showSnapshotNoVideo>
    	</video>
	</view>

I thought this would display the video at full screen, it doesn't. The video is cropped and squashed into a square which is positioned centered horizontally but higher up vertically.

I based this on logic I had applied to get an image to appear fullscreen. The following works for me.

<view name="detailed, video">
      <image name="md_image">
         <pos>0.5 0.5</pos>
         <maxSize>1 1</maxSize>
      </image>
   </view>

I'm sure to be missing something obvious. The documentation I followed doesn't actually explain what the different tags mean or do within <video></video>.

Apologies if there is a source for this information that I have not yet found. Thanks for any help or advice on getting this to work.

SpaceBlaze

@spaceblaze

I found this that helps somewhat - https://github.com/RetroPie/EmulationStation/blob/master/THEMES.md

I still can't get it to work. Here's what I have now. Which after a few tweaks ended up the same as before. Just dropped z-index that was not necessary.

<view name="detailed">
      <image name="md_image">
         <pos>0.5 0.5</pos>
         <maxSize>1 1</maxSize>
      </image>
   </view>

This displayed the image as large as it will go on the screen whilst keeping the correct ratio.

<view name="video">
	<video name="md_video">
    	<origin>0.5 0.5</origin>
    	<pos>0.5 0.5</pos>
    	<maxSize>1 1</maxSize>
    	<showSnapshotNoVideo>true</showSnapshotNoVideo>
	</video>
</view>

This crops the video into a square. Strange thing is that not all the videos display the same. Some are positioned higher on screen than others (see photos below).

Strikers appears higher up the screen than Strikers III. The resolutions are 482x640 and 361x480. Code is the same for both. All the videos not displayed at the correct aspect ratio.

I suspect maxSize may be not the best way to do this, but not sure what is best and what values I should put in there. Monitor is rotated 90' to 4:5 1280 x 1024. I'd like the videos to maintain the aspect ratio but fill the screen as much as possible.

alt text

SpaceBlaze

@spaceblaze

I'm getting somewhere on this.

The following makes a difference.

<view name="video">
	<video name="md_video">
    	<origin>0.5 0.5</origin>
    	<pos>0.5 0.5</pos>
    	<size>1.1 1.1</size>
    	<showSnapshotNoVideo>true</showSnapshotNoVideo>
	</video>
</view>

I found that size 1 1 appears to be capped, so upping it to 1.1 1.1 almost fills the screen. I can play around with the exact figure.

I seem to have discovered an issue in my videos.

2 videos are 361x480 and they display all the video. The rest of the videos are 482x640 and the bottom is cropped and somehow the centre is off so they appear higher and cropped to square for some reason.

I'll export them again and see if I can get them all the same size and ratio. If anyone has details on this I'd appreciate the guidance!

I realise this post is maybe a bit obscure and asking for something that no-one ever does - but there must be someone out there with knowledge of the video function of ES.

SpaceBlaze

@spaceblaze Just to confirm the above code change does work.

I reexported all the videos at 480p and now have control over the size.

As it turns out, the end result is not that great a user experience so I'm reworking the layout a bit.

Will post a video once I'm happy with it.