
Sundeth
Members-
Posts
2 -
Joined
-
Last visited
Sundeth's Achievements

1-Bit Wonder (1/7)
0
Reputation
-
xaml Need help with custom GameMarqueeView.xaml
Sundeth replied to Sundeth's topic in Big Box Custom Themes
Just to update, it worked! I'm now improving it and creating custom art, will probably post a final version once I have it, this is how the code looks now. Thanks @faeran and @Retro808 for your help! <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="360" d:DesignWidth="1920" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Style="{DynamicResource UserControlStyle}"> <!-- GRID DEFINITIONS --> <Grid Height="360" Width="1920" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"> <Grid.ColumnDefinitions> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="7*" /> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="2*" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="5*" /> <RowDefinition Height="1*" /> </Grid.RowDefinitions> <!-- GAME MARQUEE --> <Image Source="{Binding Path=SelectedGame.MarqueeImagePath}" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="0"/> <Border x:Name="Blackscreen" Grid.Column="0" Grid.Row="0" Grid.RowSpan="2" Grid.ColumnSpan="5" Panel.ZIndex="1" Background="Black" Opacity="1" SnapsToDevicePixels="True" RenderOptions.EdgeMode="Aliased" ></Border> <TextBlock x:Name="MarqueeBackgroundPlatform" Visibility="Collapsed"> <TextBlock.Text> <MultiBinding StringFormat="LAUNCHBOX_ROOT_FOLDER/Images/Marquees/Platforms/{0}.png"> <Binding Path="SelectedGame.Platform" /> </MultiBinding> </TextBlock.Text> </TextBlock> <Image Source="{Binding Text, ElementName=MarqueeBackgroundPlatform, FallbackValue='LAUNCHBOX_ROOT_FOLDER/Images/Marquees/Platforms/Default.png'}" Grid.Row="0" Grid.RowSpan="4" Grid.Column="0" Grid.ColumnSpan="8" Panel.ZIndex="2" Stretch="Fill" RenderOptions.BitmapScalingMode="HighQuality" /> <Image Grid.Column="1" Grid.Row="0" Source="{Binding Path=SelectedGame.ClearLogoImagePath}" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Panel.ZIndex="2"/> <Image Grid.Column="2" Grid.Row="0" Source="{Binding Path=SelectedGame.CartFrontImagePath}" Stretch="Uniform" HorizontalAlignment="Right" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Opacity="0.5" RenderTransformOrigin="0.5,0.5" Panel.ZIndex="2"> <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <RotateTransform Angle="-20"/> <TranslateTransform X="-20" Y="-20"/> </TransformGroup> </Image.RenderTransform> <Image.Effect> <BlurEffect Radius="50"/> </Image.Effect> </Image> <Image Grid.Column="2" Grid.Row="0" Source="{Binding Path=SelectedGame.CartFrontImagePath}" Stretch="Uniform" HorizontalAlignment="Right" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" Panel.ZIndex="3"> <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <RotateTransform Angle="-20"/> <TranslateTransform X="20"/> </TransformGroup> </Image.RenderTransform> </Image> <Image Grid.Column="3" Grid.Row="0" Source="{Binding Path=SelectedGame.Box3DImagePath}" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Opacity="0.5" RenderTransformOrigin="0.5,0.5" Panel.ZIndex="2"> <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <TranslateTransform X="-40" Y="-20"/> </TransformGroup> </Image.RenderTransform> <Image.Effect> <BlurEffect Radius="50"/> </Image.Effect> </Image> <Image Grid.Column="3" Grid.Row="0" Source="{Binding Path=SelectedGame.Box3DImagePath}" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" Panel.ZIndex="3"> <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <TranslateTransform/> </TransformGroup> </Image.RenderTransform> </Image> </Grid> </UserControl> -
I'm new do theme creation so things are a little fuzzy. My intention is to create a custom view for a 1920x360 resolution marquee. It should look something like this I was able to add the box and cart bindings, but for some reason, where it should be showing the clear logo, it's showing the original marquee instead 1 - I need BixBox to stop rendering the marquee file and render the clear logo 2 - I don't know how to bind the background image for it to be platform specific 3 - is it possible to make a special view only for arcade games? Those usually have a marquee artwork Here's my current code. I'm using Retro Console Theme Anim V2, but tested it with Default and Unified <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="360" d:DesignWidth="1920" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Style="{DynamicResource UserControlStyle}"> <!-- GRID DEFINITIONS --> <Grid Height="360" Width="1920" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"> <Grid.ColumnDefinitions> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="7*" /> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="3*" /> <ColumnDefinition Width="2*" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="5*" /> <RowDefinition Height="1*" /> </Grid.RowDefinitions> <Grid.Background> <ImageBrush ImageSource="H:\LaunchBox\Themes\Custom\Images\Platforms\Banner\Atari 2600.png" Stretch="UniformToFill"> </ImageBrush> </Grid.Background> <!-- GAME MARQUEE --> <Image Grid.Column="1" Grid.Row="0" Source="{Binding Path=SelectedGame.ClearLogoImagePath}" Stretch="Uniform" HorizontalAlignment="Center" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" /> <Image Grid.Column="2" Grid.Row="0" Source="{Binding Path=SelectedGame.CartFrontImagePath}" Stretch="Uniform" HorizontalAlignment="Right" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Opacity="0.5" RenderTransformOrigin="0.5,0.5" > <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <RotateTransform Angle="-20"/> <TranslateTransform X="-20" Y="-20"/> </TransformGroup> </Image.RenderTransform> <Image.Effect> <BlurEffect Radius="50"/> </Image.Effect> </Image> <Image Grid.Column="2" Grid.Row="0" Source="{Binding Path=SelectedGame.CartFrontImagePath}" Stretch="Uniform" HorizontalAlignment="Right" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" > <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <RotateTransform Angle="-20"/> <TranslateTransform X="20"/> </TransformGroup> </Image.RenderTransform> </Image> <Image Grid.Column="3" Grid.Row="0" Source="{Binding Path=SelectedGame.Box3DImagePath}" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" Opacity="0.5" RenderTransformOrigin="0.5,0.5" > <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <TranslateTransform X="-40" Y="-20"/> </TransformGroup> </Image.RenderTransform> <Image.Effect> <BlurEffect Radius="50"/> </Image.Effect> </Image> <Image Grid.Column="3" Grid.Row="0" Source="{Binding Path=SelectedGame.Box3DImagePath}" Stretch="Uniform" HorizontalAlignment="Left" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality" RenderTransformOrigin="0.5,0.5" > <Image.RenderTransform> <TransformGroup> <ScaleTransform ScaleY="0.8" ScaleX="0.8"/> <SkewTransform/> <TranslateTransform/> </TransformGroup> </Image.RenderTransform> </Image> </Grid> </UserControl>