XAML Tips and Tricks

[faeran]

12 hours ago, wallmachine said:

@faeran if you have time can you confirm if this happens for you as well?

 

Unfortunately, it's just the way the RotationAmount was implemented.

[wallmachine]

17 hours ago, faeran said:

Unfortunately, it's just the way the RotationAmount was implemented.

Thanks for checking.

Hopefully in the future it can be fixed as all other theme features remember their settings and this is the only one that doesn't.

Edited June 26, 2020 by wallmachine

[y2guru]

4 hours ago, wallmachine said:

Thanks for checking.

Hopefully in the future it can be fixed as all other theme features remember their settings and this is the only one that doesn't.

In the meantime you could always apply a fade to the wheel and make the wheel appear shortly after the view is loaded 

[Parse]

Is there an editor that I can import an existing .xaml and edit?

[y2guru]

1 hour ago, Parse said:

Is there an editor that I can import an existing .xaml and edit?

Not a visual editor, we typically use notepad++ to edit existing themes

[Parse]

4 hours ago, y2guru said:

Not a visual editor, we typically use notepad++ to edit existing themes

Yeah, I meant as a visual editor.

So, how do you view the changes? Open bigbox, edit a line in notepad, exit bigbox and open again, and repeat?

Edit: Found out that switching views with K works, but still it's slow.

Edited July 3, 2020 by Parse

[y2guru]

19 hours ago, Parse said:

Yeah, I meant as a visual editor.

So, how do you view the changes? Open bigbox, edit a line in notepad, exit bigbox and open again, and repeat?

Edit: Found out that switching views with K works, but still it's slow.

you would be better off using the Theme Creator, you would have to start from scratch but you'd knock out a theme real quick and would work at any resolution

[Parse]

On 7/4/2020 at 10:26 AM, y2guru said:

you would be better off using the Theme Creator, you would have to start from scratch but you'd knock out a theme real quick and would work at any resolution

Thanks, I'll try that. But somehow I managed to edit on notepad. I just wanted to add a wall view in the switch theme:

https://i.imgur.com/7cZwRMK.jpg

https://i.imgur.com/XOjiXUa.jpg

But I have some questions:

1. In the first image, when you just click to view the games, the wall view is scrolled down. How can I make to always be centered vertically?

2. In the first image, Ace Combat is selected and in the second image, Brave Fencer is selected. They are scaled up as I wanted, however they are going left and right off of the wall. How can I highlight/select a game and it scales up on each axis?

3. How can I add the names of the games and a transparent strip (like in lanchbox if you select text), and to scale them up when the game is selected?

4. How can I add a border in the games I select?

5. How can I sort the games on the wall (favorites or star ratings)?

Edited July 6, 2020 by Parse

[BMovieBen]

On 7/4/2020 at 8:48 PM, Parse said:

Thanks, I'll try that. But somehow I managed to edit on notepad. I just wanted to add a wall view in the switch theme:

https://i.imgur.com/7cZwRMK.jpg

https://i.imgur.com/XOjiXUa.jpg

But I have some questions:

1. In the first image, when you just click to view the games, the wall view is scrolled down. How can I make to always be centered vertically?

2. In the first image, Ace Combat is selected and in the second image, Brave Fencer is selected. They are scaled up as I wanted, however they are going left and right off of the wall. How can I highlight/select a game and it scales up on each axis?

3. How can I add the names of the games and a transparent strip (like in lanchbox if you select text), and to scale them up when the game is selected?

4. How can I add a border in the games I select?

5. How can I sort the games on the wall (favorites or star ratings)?

You can't do most of what you're looking to do with the Wall View. Those options just aren't exposed to theme creators. If you look at the Documentation PDF included in the Themes folder of LaunchBox, you'll see the options that *are* available. Things like height and width of the component, scale of the game boxes, scale of the selected game box, spacing of the game boxes, etc. You *will* be able to specify a border color for the selected game as you wanted to. Let me know if you have trouble finding the xaml for it and I can look it up later. The Wall View is not as customizable as you're looking for it to be unfortunately. I just don't think it gets used very much. 

[Parse]

3 hours ago, BMovieBen said:

You can't do most of what you're looking to do with the Wall View. Those options just aren't exposed to theme creators. If you look at the Documentation PDF included in the Themes folder of LaunchBox, you'll see the options that *are* available. Things like height and width of the component, scale of the game boxes, scale of the selected game box, spacing of the game boxes, etc. You *will* be able to specify a border color for the selected game as you wanted to. Let me know if you have trouble finding the xaml for it and I can look it up later. The Wall View is not as customizable as you're looking for it to be unfortunately. I just don't think it gets used very much. 

Thanks for the info. I noticed wall view is cast aside. I just gave up and stick to using Launchbox and not Bigbox anymore.

The wheel view is good when you have up to 40 games, but when having hundreds it's not functional.

But the wall view is perfect for that situation. It really could use more options for customization.

[wallmachine]

On 6/26/2020 at 9:59 PM, y2guru said:

In the meantime you could always apply a fade to the wheel and make the wheel appear shortly after the view is loaded 

Dang doesn't seem to work well with Platform Category views.

[Rincewind]

@wallmachine Try adding your the Text Clearlogo Images you use into the BigBox Media Overrides / Images / Platform Catagories / Clear Logo folder.  

[wallmachine]

5 hours ago, Rincewind said:

@wallmachine Try adding your the Text Clearlogo Images you use into the BigBox Media Overrides / Images / Platform Catagories / Clear Logo folder.  

Wheres this? do I just create the a folder called BigBox Media Overrides? Current Location of images \LaunchBox\Themes\Pandora\Images\Platforms\Clear Logo

Summary:

• if you enter the options view then go platforms view it doesn't remember the RotationAmount
• if you enter the systems view then go platform view it remembers the RotationAmount
• if you enter the game view then go platform view it remembers the RotationAmount
• if you are on the platform category view and enter into platform view it doesn't remember the RotationAmount

Edit: Ah I see what you mean... I'll create some art for it but it won't fix the RotationAmount value being forgotten.

Edited August 14, 2020 by wallmachine

[RedSnake]

Hello all,

 

In the process of coding a BB theme in xaml, I encountered a problem with one of the LB API:

"PrioritizedPathSelector" from "Unbroken.LaunchBox.Windows.Controls".

 

It seems to me that the third choice for path selection "Priority3FileName" is not taken into account at all.

 

For example, in the following code

<Style x:Key="PNGFileNameBinding" TargetType="controls:PrioritizedPathSelector">
        <Setter Property="FileExtension" Value=".png" />
        <Setter Property="Priority1FileName">
            <Setter.Value>
                <Binding Path="Platform.Name"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority2FileName">
            <Setter.Value>
                <Binding Path="KnownPlatformOrPlaylistTitle"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority3FileName" Value="_Default" />
    </Style>

 

I have a _Default.png picture that should be selected when the first 2 path selectors fails, but instead, nothing is selected resulting as an "empty" image displayed in BB.

 

If I change it to 

<Style x:Key="PNGFileNameBinding" TargetType="controls:PrioritizedPathSelector">
        <Setter Property="FileExtension" Value=".png" />
        <Setter Property="Priority1FileName">
            <Setter.Value>
                <Binding Path="Platform.Name"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority2FileName">
            <Setter.Value>
                <Binding Path="KnownPlatformOrPlaylistTitle"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority4FileName" Value="_Default" />
    </Style>

Then it works correctly.

 

Has anyone encountered this issue? It is a little problematic cause I need the 5 priorities but only have 4.

[Jason Carr]

@RedSnake Looking at the code, I don't see how that could be the case. Here's the code I have to do the prioritizations:

Edit: Ha, nevermind. I found the bug. You're totally correct. I have it fixed for the next beta release.

[RedSnake]

Thanks!

[viking]

Hi all !
I am in the process of finalizing v.1.0 of my Colorful theme and I still have 2 points that are causing a problem. I need your help !

#01 :
Lots of demand to add a Scanline effect on top of VideosSnap. It's easy to do, but I have a problem with square or vertical ratio video.
Then, my Scanline Overlay PNG "overflows" the video aera and goes over the white area.
And it's very ugly.
There is a possibility to force a "sort of fill" of the PNG image, to the exact size of the video? In order to adapt to all possible ratio.

#02 :
It's about Game.Genres.
For now, I used : "Text="{Binding Path=ActiveGame.GenresString}"  and it's work well.
But the display is ugly. Like this :

• Action;Puzzle;Platform

But I want something like this:

• Action / Puzzle / Platform

I already asked the question here and you answered me that I need a converter.
The problem is, I have no idea how to do it at all!
If anyone can help me with this, that would be GREAT !!! @eatkinola ?? ?

Thx !

[RedSnake]

6 hours ago, viking said:

Hi all !
I am in the process of finalizing v.1.0 of my Colorful theme and I still have 2 points that are causing a problem. I need your help !

#01 :
Lots of demand to add a Scanline effect on top of VideosSnap. It's easy to do, but I have a problem with square or vertical ratio video.
Then, my Scanline Overlay PNG "overflows" the video aera and goes over the white area.
And it's very ugly.
There is a possibility to force a "sort of fill" of the PNG image, to the exact size of the video? In order to adapt to all possible ratio.

#02 :
It's about Game.Genres.
For now, I used : "Text="{Binding Path=ActiveGame.GenresString}"  and it's work well.
But the display is ugly. Like this :

• Action;Puzzle;Platform

But I want something like this:

• Action / Puzzle / Platform

I already asked the question here and you answered me that I need a converter.
The problem is, I have no idea how to do it at all!
If anyone can help me with this, that would be GREAT !!! @eatkinola ?? ?

Thx !

 

Hi,

About point #01, I don't know. 

About point #02, you need code-behind (dll from c# code) for your converter

ConvertersPlugin.dll

ConvertersPlugin.zip

Here is the dll that does what you want and the C# project in case you want to change it for whatever reason.

In your xaml view:

1 - Add the reference to the dll:

<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:bigBox="clr-namespace:Unbroken.LaunchBox.Windows;assembly=Unbroken.LaunchBox.Windows"
             xmlns:transitions="clr-namespace:Unbroken.LaunchBox.Windows.Transitions;assembly=Unbroken.LaunchBox.Windows"
             xmlns:controls="clr-namespace:Unbroken.LaunchBox.Windows.Controls;assembly=Unbroken.LaunchBox.Windows"
             xmlns:coverFlow="clr-namespace:Unbroken.LaunchBox.Windows.Controls.CoverFlow;assembly=Unbroken.LaunchBox.Windows"
             xmlns:rs="clr-namespace:DarkRoomPlugin;assembly=DarkRoomPlugin"
             xmlns:vk="clr-namespace:ConvertersPlugin;assembly=ConvertersPlugin"
             xmlns:PathSelector="clr-namespace:Unbroken.LaunchBox.Plugins.PrioritizedPathSelector;assembly=Unbroken.LaunchBox.Plugins.PrioritizedPathSelector"
             xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
             xmlns:cal="http://www.caliburnproject.org"
             xmlns:aov="clr-namespace:Ao.Bigbox.ViewModels;assembly=Ao.Bigbox.Themer.v3_9_7"
             xmlns:aox="clr-namespace:Ao.Bigbox.Converters;assembly=Ao.Bigbox.Themer.v3_9_7"
             xmlns:aoc="clr-namespace:Ao.Bigbox.Controls;assembly=Ao.Bigbox.Themer.v3_9_7"
             xmlns:sys="clr-namespace:System;assembly=mscorlib"
             xmlns:wpf="clr-namespace:Unbroken.LaunchBox.Wpf;assembly=Unbroken.LaunchBox.Wpf"
             mc:Ignorable="d" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Style="{DynamicResource UserControlStyle}">

2 - Declare the converter static ressource:

<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="pack://siteoforigin:,,,/Themes/DarkRoom/Views/Styles/Animations.xaml" />
            <ResourceDictionary Source="pack://siteoforigin:,,,/Themes/DarkRoom/Views/Styles/StaticStyles.xaml" />
            <ResourceDictionary Source="pack://siteoforigin:,,,/Themes/DarkRoom/Views/Styles/DynamicStyles.xaml" />
        </ResourceDictionary.MergedDictionaries>
        <vk:VkConverter x:Key="VkConverter" />
        <bigBox:ImageToSourceConverter x:Key="ImageToSourceConverter" x:Name="ImageToSourceConverter"/>
        <wpf:RemoveNewLineConverter x:Key="RemoveNewLineConverter" />
        <LinearGradientBrush x:Key="GameDetailsBackgroundOpacityMask" StartPoint="0,0" EndPoint="0,1">
          <GradientStop Color="#CCFFFFFF" Offset="0"/>
          <GradientStop Color="#00FFFFFF" Offset="1"/>
        </LinearGradientBrush>    
    </ResourceDictionary>
  </UserControl.Resources>

3 - The use it to convert your string:

                        <!-- Genres -->
                        <aoc:AutoscaleTextBlock Text="{Binding SelectedGame.GenresString, Converter={StaticResource VkConverter}, StringFormat= 'Genre: \{0\}'}" Opacity="0.7" TextAlignment="Left" 
                            TargetFontSize="{Binding Source={StaticResource TargetFontSize18}}" 
                            TargetScreenHeight="{Binding Source={StaticResource TargetFontHeight1080}}" 
                            Foreground="#e7e7e7" FontFamily="Comic Book">
                            <aoc:AutoscaleTextBlock.Style>
                                <Style TargetType="aoc:AutoscaleTextBlock">
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding SelectedGame.GenresString}" Value="{x:Null}">
                                            <Setter Property="Visibility" Value="Collapsed" />
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding SelectedGame.GenresString}" Value="">
                                            <Setter Property="Visibility" Value="Collapsed" />
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </aoc:AutoscaleTextBlock.Style>
                        </aoc:AutoscaleTextBlock>
 

==> Result:

instead of:

 

Edited October 15, 2020 by RedSnake

[The Mask]

On 10/13/2020 at 4:20 PM, RedSnake said:

<Style x:Key="PNGFileNameBinding" TargetType="controls:PrioritizedPathSelector">
        <Setter Property="FileExtension" Value=".png" />
        <Setter Property="Priority1FileName">
            <Setter.Value>
                <Binding Path="Platform.Name"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority2FileName">
            <Setter.Value>
                <Binding Path="KnownPlatformOrPlaylistTitle"/>
            </Setter.Value>
        </Setter>
        <Setter Property="Priority4FileName" Value="_Default" />
    </Style>

 

Is this to replace the launchbox image when a game image isn't found? If so, I was looking for something like this for ages

[RedSnake]

No it is to replace a string like "Shooter;Action;Platform" to "Shooter / Action / Platform"