XAML Tips and Tricks

[Rincewind]

On 01/08/2017 at 10:51 AM, Grila said:

You can add drop shadows in XAML, no need to duplicate and stack text.

Sent from my Pixel XL using Tapatalk
 

How would I add it to this @Grila 

<!-- 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" />

I thought that this would of worked...

<TextBlock.Effect>
     <DropShadowEffect ShadowDepth="4" Direction="310" Color="Black" Opacity="0.7" BlurRadius="4"/>
</TextBlock.Effect>

 

[Grila]

3 minutes ago, Rincewind said:

How would I add it to this @Grila 

<!-- 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" />

I thought that this would of worked...

<TextBlock.Effect>
     <DropShadowEffect ShadowDepth="4" Direction="310" Color="Black" Opacity="0.7" BlurRadius="4"/>
</TextBlock.Effect>

 

<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.Effect>
    <DropShadowEffect BlurRadius="30" Direction="270" ShadowDepth="10" Opacity="0.5"/>
  </TextBlock.Effect>
</TextBlock>

It has to be a child property of the element.

[Rincewind]

Thank you I'll give that a go now 

[shinra358]

I was searching for how to data bind the list of games to vids and when Im on a certain game, a certain vid will come up. So I came across this vids which I thought would answer my question. It did..... for platforms. jWhen it got to this part, it was actually skipped over But I'm not sure how to do it for games:  @Jason Carr@Grila

 

 

	<UserControl.Resources>
        <DataTemplate DataType="{x:Type ContentControl}" x:Key="GamePreviewVideoTemplate">
            <MediaElement x:Name="GamePreviewVideo"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding Path= }" Value="  ">     **************NEED HELP HERE
                    <Setter TargetName="GamePreviewVideo" Property="Source" Value="pack://siteoforigin:,,,/Themes/PSP-XE/Videos/Games/Previews/Sony Playstation Portable/*.mp4"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
	</UserControl.Resources>
	 
	...
	 
	<ContentControl Content="{Binding}" ContentTemplate="{StaticResource GamePreviewVideoTemplate}" Name="GameVid" Grid.Row="4" Grid.RowSpan="2" Grid.Column="2" Grid.ColumnSpan="6" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="Auto" Height="Auto" ClipToBounds="True"/>
	

 

Edited August 9, 2017 by shinra358

[shinra358]

have no idea how the text became light like that. sorry.

[shinra358]

Anybody? So only 2 ppl on this website only know code???

[Grila]

11 hours ago, shinra358 said:

Anybody? So only 2 ppl on this website only know code???

Being impatient and then essentially knocking everybody in this community, because you haven't got your answer yet, is not a really good way to get help around here. Anyways, here's my question for you since I'm not 100% sure on what you are trying to accomplish.

On 8/7/2017 at 3:39 PM, shinra358 said:

I was searching for how to data bind the list of games to vids and when Im on a certain game, a certain vid will come up

You say you want a different video to play for each game. Are you talking about a video snap for the selected game or are you trying to get some other video to play? It kind of seems like you are trying to reinvent the wheel here, as you can already play a corresponding video snap according to the selected wheel item with the ImageVideoView or with the BackgroundView.

[shinra358]

Not knocking anyone nor am I impatient considering questions have gone by for a lot of members who ask them for days on end. It shouldn't be left up to only 4 ppl answering user's questions.

 

In the video, Jason mentioned about 75% of the way through that you can also code it so that it reads by just dropping the images in the folder but he never dealved into it. He just continued to teach about the single items. What I'm trying to accomplish as I've stated, to highlight a game, and have my specific video show up (one separate from what is shown in the bg). Not only that, I would want the vids to work like they do for background vids but in another directory so that they don't conflict with the original bg vids. Because using transition selector vids seems to only play in one location when there are 2 available and they do not stretch. Using background view code, images show when there is no video in which I'm also trying to eliminate by asking about this. It will also help me make theme media location work and help me create a gif folder all in one.

So If you look at the code posted, I have marked the part in the code where jason mentioned being able to do it this way in the vid. I need to edit that part so that I can code bigbox to select the vid, image, or gif based on the game's name. This will play a preview of said game for my theme in a way that the original methods can't. Again, the current methods are limited. ImageVideoView doesn't stretch the vid nor let's me have 2 vids running in different spots at once. And backgroundview doesn't let me choose pic or vid alone, it has to be both. Along with the other pluses that come along with this that I stated above. So I'm not inventing the wheel, it's helping me improve the wheel. We were given this open-ness to be able to take the strain from jason. That's what I'm trying to do because I've been waiting a very long time for this and shouldn't have to rely on one person in order to do it. He's only human.

 

Edit: of course it would help if I had the right vid up

Changed previous post with correct vid.

@17:25 in the vid is where he mentions the power to be able to have bigbox read just by throwing the images in the folder. This is what I need. As well as the code inserts to focus on games instead of the platforms.

Edited August 9, 2017 by shinra358

[damageinc86]

Someday is the far distant future there will be a drag and drop theme editor for this.   That will be a glorious time, and I shall celebrate with several displays of overly emotional ? and ? guzzling.

Edited August 9, 2017 by damageinc86

[Cookz718]

Wassup Everyone.. Complete Total Newb Here jejeje so im working on a little something and i need a little help being able to add gameplay pictures / cover / or video..  any help ? hopefully its someting not too complicated (yes this is going to be a 4K Theme)  

and also being able to resize the " About This Game " sypnosis and to kind of remove that blend in the background.

Edited August 23, 2017 by Cookz718

[CriticalCid]

Those are pretty basic things to do. You should start with @Jason Carr's XAML tutorials because they are perfect for learning the basics. Especially understanding the Grid/Row/Column system and how to assign objects to them is essential for everything you do in XAML.

https://www.youtube.com/playlist?list=PL6pTDaHeAz-X8yNgOD3DPxUf1gaB2FLzb

[Cookz718]

hey guys going to sound like a total noob but... im currently creating a theme would like to know what's the XAML for :

• Platform Description

• To add the Clock Time

 

i know the code to add the images but how can i center it and stuff ?? Any help would be great im currently in the middle of creating a great theme that i know everyone will like. Thank you

Edited August 27, 2017 by Cookz718

[kmoney]

Hey everyone that create themes,I have a question. I was wanting to start experimenting in creating a theme so I have been trying to open different  creators themes in Visual Studio to see how certain things are done. In a lot of the themes when I open the views in Visual Studio it says "Invalid Markup" so I cannot see a visual on how the view is created. Why is this and can this be corrected?

[CriticalCid]

21 hours ago, Cookz718 said:

• Platform Description

<TextBlock Text="{Binding Path=SelectedPlatform.Notes}" Foreground="White" />

 

21 hours ago, Cookz718 said:

i know the code to add the images but how can i center it and stuff ??

To center something in XAML just add one or both properties (depending what you need) to the element

HorizontalAlignment="Center"

VerticalAlignment="Center"

 

16 hours ago, kmoney said:

Hey everyone that create themes,I have a question. I was wanting to start experimenting in creating a theme so I have been trying to open different  creators themes in Visual Studio to see how certain things are done. In a lot of the themes when I open the views in Visual Studio it says "Invalid Markup" so I cannot see a visual on how the view is created. Why is this and can this be corrected?

I’m not 100% sure about the technical stuff behind it but AFAIK this happens when a View is using an element/binding that Jason hasn’t added support in Visual Basic for it yet. I only use Notepad++ for editing so it never bothered me much.

[shinra358]

When loading a page, you can see pop-in. If you had effects that weren't there to begin with, you may see your effect first and then the pop-in a few secs later. Ive put up a loading screen so the user wouldn't have to see that, that lasts like 1.5 to 2 seconds, using doubleanimation. During this time I'd like for all input to be disabled until said loading screen goes away so the user won't engage anything until the loading screen is over.

My question is, through xaml only, how do I disable all input for the 2 secs of first entering said page?

Edited August 29, 2017 by shinra358

[eatkinola]

44 minutes ago, shinra358 said:

My question is, through xaml only, how do I disable all input for the 2 secs of first entering said page?

Don't know of a way to do this via XAML, but I wonder if you could implement a simple IBigBoxThemeElementPlugin and just have it process and ignore the left, right, enter, etc keys.

Could another way to address"pop-in" be to fade in those controls, using a storyboard? I use this approach to simulate a transition.

[shinra358]

" Could another way to address"pop-in" be to fade in those controls, using a storyboard? I use this approach to simulate a transition. "

yes but the effect I use for having the highlighted wheel item to have a glow would show first and then the wheel would slowly fade in. That didn't look right. I have the effect linked to the game change. If I delayed that glow, it would take too long to show again when scrolling the wheels. So the loading screen was the best choice. It's pretty much just a black screen that stays black for 1.5 seconds and transition fades in to the time that the wheel is completely loaded.

I tried making a 2nd wheel and placing the zindex behind the current wheel to have loading emblem circles on it 'like what psp does' but it is forbidden in the depths of bigbox to have 2 wheels on one page at the same time.

 

unfortunately I don't know how to create plugins.

[eatkinola]

Any way you could upload a video showing what it looks like? It might help us kick around some ideas.

[shinra358]

(0:10 is the pop-in mask)

Edited August 29, 2017 by shinra358

[eatkinola]

Those views are looking very nice. What if you faded in the entire view, e.g., the grid or other element that is housing the background and all controls? Then, you could avoid having to fade to black and avoid worrying about temporary blocking of input. You should be able to add this fade-in animation without changing your other animations, though you'd have to find something to bind it to as a trigger...