XAML Tips and Tricks

[eatkinola]

Did you put font files in a subfolder within your project called Fonts?

1 minute ago, shinra358 said:

What about having the font read from the folder without hiding it in the dll like an image file would be read? Possible?

I don't think that's possible. Tried that first but was unable to get it to work.

[shinra358]

Yes, and they are shown in vs. U cant set as resource if it isnt there.

 

...PSP-XE.Resources;Component/Fonts/#Square721 BT</FontFamily>

The underlined is supposed to be the name of the theme right?

 

This is what I got by following the provided directions. Looks totally different from the screenshot you posted:

Edited September 13, 2017 by shinra358

[LogicalEgo]

Make a video tutorial :D, I tried all these before and crapped out each time lol.

[shinra358]

Issue was the hyphen in the reference name. Thanks eatkinola~

[GunerX]

how do I add in the xaml to enable Device images for Playlists?

[Hexxxer]

I am attempting to reference my Resources from a dictionary in another file 

  <FontFamily x:Key="FontTitle">/Hexxxer.Futurestate.Resources;Component/Fonts/#Spartan</FontFamily>
    <FontWeight x:Key="FontTitleWeight">Normal</FontWeight>
    <SolidColorBrush x:Key="FontTitleBrush" Color="White" />
    <System:Double x:Key="FontTitleSize">48</System:Double>

    <Style x:Key="TitleFont" TargetType="TextBlock">
        <Setter Property="Foreground" Value="{DynamicResource FontTitleBrush}"/>
        <Setter Property="FontFamily" Value="{DynamicResource FontTitle}"/>
        <Setter Property="FontWeight" Value="{DynamicResource FontTitleWeight}"/>
        <Setter Property="FontSize" Value="{DynamicResource FontTitleSize}"/>
    </Style>

when I use this within my user control directly in  my view it can see the fonts fine but from the dictionary is will use the default file. What do I need to change to get this working?

[eatkinola]

4 minutes ago, Hexxxer said:

What do I need to change to get this working?

In my experience with fonts as resources, you have to reiterate the definition for the font family within the actual view in which you use the font.

<FontFamily x:Key="FontTitle">/Hexxxer.Futurestate.Resources;Component/Fonts/#Spartan</FontFamily>

[Kriven]

Hokay, so

I want to dictate a way for Big Box to display icons which indicate all of the operating systems a game is intended to support. Right now I am using the "Series" field to dictate which OS goes with which games.

(Series: Windows XP; Windows Vista; etc.;)

This works when displaying the information as text, of course, but I want a visual icon which goes beside a game's content rating and the favorite, etc. icons. I'm trying to use this code (admittedly borrowed from another skin):

<Image x:Name="Windows7" DockPanel.Dock="Left" Source="pack://siteoforigin:,,,/Themes/BigForce/Images/Core/Windows7.png" Margin="0,0,5,0" RenderOptions.BitmapScalingMode="HighQuality" >
                    <Image.Style>
                        <Style TargetType="Image">
                            <Setter Property="Visibility" Value="Collapsed" />
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding ActiveGame.Series}" Value="Windows 7">
                                    <Setter Property="Visibility" Value="Visible" />
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </Image.Style>
                </Image>

 

But this doesn't seem to be working, presumably because there are multiple values in the Series field. Is there any way to reword the "Value=" command into some kind of "Value contains" command?

[shinra358]

I'm trying to rearrange the details view of the games. It seems impossible to do. I want to move the list of words )(options like play, launch, view pics, etc.) to the other side but nothing in the xaml under details view seems to affect it. Any thoughts?

Edited October 15, 2017 by shinra358

[NJDave71]

<!-- PLATFORM TOTAL GAMES --> <TextBlock Grid.Column="21" Grid.ColumnSpan="2" Grid.Row="15" Grid.RowSpan="1" Text="TOTAL GAMES:" Foreground="Black" FontFamily="Segoe UI Light" FontSize="20" /> <TextBlock Grid.Column="22" Grid.ColumnSpan="3" Grid.Row="15" Grid.RowSpan="1" Text="{Binding Path=SelectedPlatform.TotalGameCount}" Foreground="Black" FontFamily="Segoe UI Semibold" FontSize="20" Margin="55,0,0,0" />

is this suppose to return a count for number of games in a playlist?   i am seeing 0.

Edited October 23, 2017 by NJDave71

[shinra358]

This is the game details control for game details view:

<controls:ScrollableTextBlock Name="ScrollingNotes" Text="{Binding Path=Notes}" FontFamily="{StaticResource FontMain}" Foreground="White" TextWrapping="Wrap"
                Width="{Binding ElementName=NotesCanvas, Path=ActualWidth}" ScrollBeginDelay="10" ScrollSpeed="3" ScrollAutoReverse="True"
                ScrollEndDelay="10" ReverseScrollSpeed="0.5" ScrollDirection="Up" RenderTransformOrigin="0.0,0.5">

 

When I add this:

<controls:ScrollableTextBlock.RenderTransform>
                    <TransformGroup>
                        <ScaleTransform ScaleX="1.5853"/>
                        <SkewTransform/>
                        <RotateTransform/>
                        <TranslateTransform/>
                    </TransformGroup>
                </controls:ScrollableTextBlock.RenderTransform>

 

It won't scroll anymore. How do I make it autoscroll with that 2nd piece added on?

[Kriven]

omg what is that skin

[shinra358]

You'll see... if I can get an answer to my question(s)

[shinra358]

found the solution. Use layouttransform instead of rendertransform.

[mcfilmmakers]

On 1/8/2017 at 4:53 PM, Liam said:

Hi does anyone know if it is possible to have the text pop up containing a games custom field. I'm guessing this is not possible since it says nothing about it in the Documentation.pdf but i thought i'd check here anyway.

 

Back in January, Jason said he'd look into implementing this. Is this feature now possible? The launchbox documentation still doesn't say anything about it.

In my case, I want to set up a custom field for controller types called Controller and give it a value such as Joystick, Gamepad, Paddle, etc. (this really should a main field along with the genre, publisher, etc!)

In any case, I've got my theme ready to go with the code: 

<TextBlock x:Name="PlatformControlPanel" Visibility="Collapsed">
                        <TextBlock.Text>
                            <MultiBinding StringFormat="{}pack://siteoforigin:,,,/Themes/Custom/Images/Controls/{0}/{1}.png">
                                <Binding Path="SelectedGame.Platform" />
                                <Binding Path="SelectedGame.Controller" />
                            </MultiBinding>
                        </TextBlock.Text>
                    </TextBlock>

but nothing happens. The idea is to display an image of the controller on the game view, similar to the Griddle theme, but that theme is fixed per platform rather than per game.

Alternatively, I absolutely can set it so that I have an image for every single game title and change my code to use SelectedGame.Title but then I'd have 500+ copies of the same image rather than one image that I can call.

Edited November 5, 2017 by mcfilmmakers

[Jason Carr]

@mcfilmmakers Responded in your other thread. Unfortunately there's no good way to do it right now without using a plugin, but a plugin should give you what you need if you can tackle it.

[mcfilmmakers]

2 hours ago, Jason Carr said:

@mcfilmmakers Responded in your other thread. Unfortunately there's no good way to do it right now without using a plugin, but a plugin should give you what you need if you can tackle it.

In that case, feature request?

[Kriven]

On 1/9/2017 at 6:18 PM, Jason Carr said:

 

@Liam That is a good point; I don't think it's currently possible to display custom fields individually. We should look into that.

I don't suppose custom fields were ever looked at?

 

 

 

Edit: Anybody know of a way to draw a random Box Front from games within a playlist?

Edited November 7, 2017 by Kriven

[shinra358]

<ListBox Name="Items" Style="{DynamicResource ListBoxStyle}" FontFamily="{StaticResource FontMain}">
                        <ListBox.LayoutTransform>
                            <TransformGroup>
                                <ScaleTransform ScaleX="1.5"/>
                                <SkewTransform/>
                                <RotateTransform/>
                                <TranslateTransform/>
                            </TransformGroup>
                        </ListBox.LayoutTransform>
                        <i:Interaction.Triggers>
                            <i:EventTrigger EventName="MouseDoubleClick">
                                <cal:ActionMessage MethodName="OnEnter" />
                            </i:EventTrigger>
                        </i:Interaction.Triggers>                       
                        <ListBox.Effect>
                            <BlurEffect Radius="2"/>
                        </ListBox.Effect>
                        <ListBox.ItemContainerStyle>
                            <Style TargetType="ListBoxItem">
                                <Style.Triggers>
                                    <EventTrigger RoutedEvent="ListBoxItem.Loaded">
                                        <EventTrigger.Actions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation
                                                          Storyboard.TargetProperty="(RadialGradientBrush.Opacity)"
                                                          BeginTime="0:0:0" From="0.15" To="0.15" Duration="0:0:0.85" AutoReverse="True"
                                                          RepeatBehavior="Forever" />
                                                </Storyboard>
                                            </BeginStoryboard>
                                        </EventTrigger.Actions>
                                    </EventTrigger>
                                    <Trigger Property="IsSelected" Value="True" >
                                        <Setter Property="FontWeight" Value="Bold" />
                                        <Setter Property="Background" Value="Transparent" />
                                        <Setter Property="Foreground" Value="White" />
                                    </Trigger>
                                </Style.Triggers>
                                <Style.Resources>
                                    <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
                                    <RadialGradientBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Opacity="0.15">
                                        <RadialGradientBrush.RelativeTransform>
                                            <TransformGroup>
                                                <ScaleTransform CenterY="0.5" CenterX="0.5" ScaleX="1.7" ScaleY="1.1"/>
                                                <SkewTransform CenterY="0.5" CenterX="0.5"/>
                                                <RotateTransform CenterY="0.5" CenterX="0.5"/>
                                                <TranslateTransform/>
                                            </TransformGroup>
                                        </RadialGradientBrush.RelativeTransform>
                                        <GradientStop Color="White" Offset="1"/>
                                        <GradientStop Color="Transparent"/>
                                    </RadialGradientBrush>
                                </Style.Resources>
                            </Style>
                        </ListBox.ItemContainerStyle>
                    </ListBox>

Can someone edit this so that the highlighter of the listbox is glowing (opacity increasing and decreasing). For some reason this isn't working.

Animation portion:

<EventTrigger RoutedEvent="ListBoxItem.Loaded">
                                        <EventTrigger.Actions>
                                            <BeginStoryboard>
                                                <Storyboard>
                                                    <DoubleAnimation
                                                          Storyboard.TargetProperty="(RadialGradientBrush.Opacity)"
                                                          BeginTime="0:0:0" From="0.15" To="0.15" Duration="0:0:0.85" AutoReverse="True"
                                                          RepeatBehavior="Forever" />

 

Listbox Highlighter:

<RadialGradientBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Opacity="0.15">

Edited November 9, 2017 by shinra358

[Grila]

Just from a quick look, in your storyboard the animation value for opacity is the same for from and to, both 0.15

You need to change one to 0 I believe.

Edited November 9, 2017 by Grila