Jump to content
LaunchBox Community Forums

Default marquee for ROMS that dont have an image?


Super_Paulie

Recommended Posts

Try this...and if it doesn't work,get rid of the code to display the clear logo and marquee,leaving just the code for the background default...see if it is showing up even...

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:transitions="clr-namespace:Unbroken.LaunchBox.Wpf.Transitions;assembly=Unbroken.LaunchBox.Wpf"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:cal="http://www.caliburnproject.org"
             mc:Ignorable="d"
             d:DesignHeight="562" d:DesignWidth="1000" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Style="{DynamicResource UserControlStyle}">

 

<Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
        <Grid.ColumnDefinitions>                        
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="465*" />
            <RowDefinition Height="615*" />
        </Grid.RowDefinitions>

<TextBlock x:Name="DefaultMarquee" Visibility="Visible">
    <TextBlock.Text>
        <MultiBinding StringFormat="{}pack://siteoforigin:,,,/Images/{0}/defaultMarq.png">
            <Binding Path="SelectedGame.Platform"/>
        </MultiBinding>
    </TextBlock.Text>
</TextBlock>
<Image x:Name="MainDefaultMarquee" Grid.RowSpan="2" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Panel.ZIndex="0" Source="{Binding Text, ElementName=DefaultMarquee, FallbackValue='pack://siteoforigin:,,,/Images/defaultMarq.png'}" Stretch="Fill" RenderOptions.BitmapScalingMode="LowQuality" ><Image.Effect><BlurEffect Radius="99"/></Image.Effect></Image>
        


<Image Source="{Binding Path=SelectedGame.ClearLogoImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="1" Grid.Column="1" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="1"/>


<Image Source="{Binding Path=SelectedGame.MarqueeImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="2"/>


</Grid>
</UserControl>

Link to comment
Share on other sites

Ok...last one I got...try this one...the whole thing,including usercontrols

 

 

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:transitions="clr-namespace:Unbroken.LaunchBox.Wpf.Transitions;assembly=Unbroken.LaunchBox.Wpf"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:cal="http://www.caliburnproject.org"

             

<Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
        <Grid.ColumnDefinitions>                        
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="465*" />
            <RowDefinition Height="615*" />
        </Grid.RowDefinitions>

<Image Source="pack://siteoforigin:,,,/Images/defaultMarq.png" Grid.RowSpan="2" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Panel.ZIndex="0" Stretch="Fill" RenderOptions.BitmapScalingMode="LowQuality" ><Image.Effect><BlurEffect Radius="99" /></Image.Effect></Image>   

<Image Source="{Binding Path=SelectedGame.ClearLogoImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="1" Grid.Column="1" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="1" ></Image>


<Image Source="{Binding Path=SelectedGame.MarqueeImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="2" ></Image>


</Grid>
</UserControl>

Link to comment
Share on other sites

woops..here you go...

 

<UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:transitions="clr-namespace:Unbroken.LaunchBox.Wpf.Transitions;assembly=Unbroken.LaunchBox.Wpf"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:cal="http://www.caliburnproject.org">

             

<Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
        <Grid.ColumnDefinitions>                        
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="465*" />
            <RowDefinition Height="615*" />
        </Grid.RowDefinitions>

<Image Source="pack://siteoforigin:,,,/Images/defaultMarq.png" Grid.RowSpan="2" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Panel.ZIndex="0" Stretch="Fill" RenderOptions.BitmapScalingMode="LowQuality" ><Image.Effect><BlurEffect Radius="99" /></Image.Effect></Image>   

<Image Source="{Binding Path=SelectedGame.ClearLogoImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="1" Grid.Column="1" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="1" ></Image>


<Image Source="{Binding Path=SelectedGame.MarqueeImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="2" ></Image>


</Grid>
</UserControl>

Link to comment
Share on other sites

No worries, I really appreciate the help with trying to achieve it. Frankly it looks just fine with the image of the clear/marquee repeated underneath blurred, it's just often the clear has a lot of blank space at the top and as the marquee monitor only has the top third visible it's way off the mark. A very minor gripe in the scheme of things, it's looking great so far I'm really happy with it. Interesting how you can manipulate the code, I think I'll look into it to see what else can be achieved in the game wheel etc! Thanks for today guys.

Edited by Super_Paulie
Link to comment
Share on other sites

11 minutes ago, Super_Paulie said:

No worries, I really appreciate the help with trying to achieve it. Frankly it looks just fine with the image of the clear/marquee repeated underneath blurred, it's just often the clear has a lot of blank space at the top and as the marquee monitor only has the top third visible it's way off the mark. A very minor gripe in the scheme of things, it's looking great so far I'm really happy with it. Interesting how you can manipulate the code, I think I'll look into it to see what else can be achieved in the game wheel etc! Thanks for today guys.

You mean with the clear; - clear logo, right? Is there empty space at the top of each clear logo? If not it could be empty space within some of the png files in need of cropping blank space first. Otherwise all thats left is messing around with the positioning of the logo code.

Link to comment
Share on other sites

Sorry, I didn't explain that very well. I set the clear logo/marquee to the very top of the screen so that it shows in the cut out in the cabinet. This works perfectly. As an addition to this, I have the image show again at Z0 but blurred. Obviously to keep the aspect ratio of the blurred clear logo, it expands to the size of the screen and thus only the top third of that is visible when in the cabinet, which is mostly blank space usually in clear logos. Which is why I would have preferred a static image as the blurred background that I could have made to fit.

It's not a problem, don't worry about it, it still looks great!

Link to comment
Share on other sites

Ah ok so basically you need to scale the blurred layer in the same dimensions as the layer that is in front; the marquee/clear logo. Have you tried (I havent looked at the code that RetroHumanoid posted) copying the same scaling/positioning code for the marquee/clear logo? I made something simular before which is quite simplistic but maybe you can use it to learn/experiment/mix in with the code from RetroHumanoid.

 

Link to comment
Share on other sites

Yes I think so. I'm not entirely sure what I want now! ?

I don't really care if it 'over-runs' in any direction, as when the screen if in the cabinet you only ever see the top third. The blurred image is basically central to the screen but that means you only ever see the very top of it, if you get me. If you set that image to be "top" will it scale out from the top in every direction? Like off the top of the screen? I think that's what I'm needing, let me try to draw a picture on my phone... I think I would like it to expand from it's position at the top, hopefully the images explain a bit! The first image is what happens currently, the second image is what I would like. The red dotted box is the only bit visible when in the cab. You guys are really helpful, this has kept me entertained all day!

IMG_20181101_210518.jpg

IMG_20181101_210723.jpg

  • Like 1
Link to comment
Share on other sites

57 minutes ago, Super_Paulie said:

Yes I think so. I'm not entirely sure what I want now! ?

I don't really care if it 'over-runs' in any direction, as when the screen if in the cabinet you only ever see the top third. The blurred image is basically central to the screen but that means you only ever see the very top of it, if you get me. If you set that image to be "top" will it scale out from the top in every direction? Like off the top of the screen? I think that's what I'm needing, let me try to draw a picture on my phone... I think I would like it to expand from it's position at the top, hopefully the images explain a bit! The first image is what happens currently, the second image is what I would like. The red dotted box is the only bit visible when in the cab. You guys are really helpful, this has kept me entertained all day!

IMG_20181101_210518.jpg

IMG_20181101_210723.jpg

Lol the: you know what you want when you see it, principle ;)

I think (bare with me as I mostly just change code around till it works instead of the right theory right out of my head) all it needs then is the stretch property of the blurred layer to be set at downonly or uponly, youll have to test out what changes it brings.

Stretch="Uniform" StretchDirection="DownOnly"
Link to comment
Share on other sites

still no joy. For my own interests now more than anything im interested in why the code doesn't work. So stripped back to the below, even this wont work. It just shows the marquee associated with the ROM.


<Image Source="pack://siteoforigin:,,,/Images/defaultMarq.png" Panel.ZIndex="0" Stretch="Fill" RenderOptions.BitmapScalingMode="LowQuality"></Image>

Now although its not picking the correct image, it is adhering to the Stretch and quality parts of the code, so is it the path that is not correct?

So until the above works, then it will defo be a non starter. So how come the above code/path is being ignored...? or should i just leave this and move on! ha

Link to comment
Share on other sites

ok, so this is what i have came up with. My brain suggest this shouldnt work, as i am not referencing the clearLogo anywhere in the code, however it appears if no marquee is present. It also applies the clearLogo OR marqueeImage as the blurEffect image even though i am not referencing that directlty wither, i have even added "x" as the source and it still pulls it up, so there is something strange going on here. 

Anyways i have settled. If there is no marquee it shows the clear logo instead with the same clear logo behind but blurred. I have set up a grid so i can control the shape of the "blurred image" to make it more visually appealing. If there is a marquee present then it still shows the aforementioned clearLogo, blurred logo but then the marquee on top of both so you cant see them, job done.

Heres the code, and heres how it looks in the cabinet for the outcome. Pic1 if the ROM has a marquee, and the other picture what happens if it doesnt. Thanks a bunch guys, i think ive worked out the code but still a bit of a mystery. 

<Grid Height="{Binding ElementName=Canvas, Path=ActualHeight}" Width="{Binding ElementName=Canvas, Path=ActualWidth}">
        <Grid.ColumnDefinitions>                        
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />
            <ColumnDefinition Width="640*" />

        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="465*" />
            <RowDefinition Height="615*" />
        </Grid.RowDefinitions>


<Image Source="x" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="1" Panel.ZIndex="0" Stretch="Fill" RenderOptions.BitmapScalingMode="LowQuality"><Image.Effect><BlurEffect
Radius="100"/></Image.Effect></Image>


<Image Source="{Binding Path=SelectedGame.MarqueeImagePath}" Grid.RowSpan="1" Grid.Row="0" Grid.ColumnSpan="3" Grid.Column="0" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center"
RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="1"/>

</Grid>
</UserControl>

 

 

20181102_174116_resized.jpg

 

20181102_180140_resized.jpg

Edited by Super_Paulie
  • Like 3
Link to comment
Share on other sites

Looking really great man, my compliments! To unravel the mysteries a bit, the clear logo displays if there aint no marquee because of the image priority settings youve succesfully changed. The 'doubling' of the marquee/clear logo is something I came across as well when I created the magic marquee filler trick. For some reason any image file you add/link to the marquee xaml will keep on changing back to the marquee placeholder, this is probably because of the way the pre-coded environment is created. Maybe @Jason Carr can shed some light on this.

Link to comment
Share on other sites

On 11/2/2018 at 11:17 AM, Mr. RetroLust said:

Looking really great man, my compliments! To unravel the mysteries a bit, the clear logo displays if there aint no marquee because of the image priority settings youve succesfully changed. The 'doubling' of the marquee/clear logo is something I came across as well when I created the magic marquee filler trick. For some reason any image file you add/link to the marquee xaml will keep on changing back to the marquee placeholder, this is probably because of the way the pre-coded environment is created. Maybe @Jason Carr can shed some light on this.

Hmm, yes I believe this is just because of the backend code. The code searches for the first image found in the XAML and uses it to display the marquee image. Originally, I think I did it this way because the existing themes didn't have any better way to reference the image to use. I think one thing you could do is just put an image in there first and make it invisible.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...