XAML noob | Transparent Grid?

[kdub87]

How do I make this transparent?

<Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="#313536" />

I have tried  these 2 methods and neither worked.

<Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="Trasnparent" />

<Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="#313536" Opacity="0.5" />

More Context:

Theme = COLORFUL - Dark

File in question = WheelGamesView.xaml

Goal = Make the left bar be a little bit transparent so that we can see the whole video. Right now video's are getting cut off due to the grey bar.

[Retro808]

You have a typo with transparent. You spelled it “trasnparent”. Try correcting that. 

Are you editing the right line of code though? If I remember that section he used a rectangle call to make that area if the screen the dark grey. Not a grid. 

Something like below I believe  

< Rectangle Grid.Column="0" Grid.ColumnSpan="7” ........... and so on ..... />

 

[kdub87]

42 minutes ago, Retro808 said:

You have a typo with transparent. You spelled it “trasnparent”. Try correcting that. 

Are you editing the right line of code though? If I remember that section he used a rectangle call to make that area if the screen the dark grey. Not a grid. 

Something like below I believe  

< Rectangle Grid.Column="0" Grid.ColumnSpan="7” ........... and so on ..... />

 

I assume it is the correct line. Changing the background color to something else changes the color of what I am trying to make transparent.

 

            <!-- ================================================================= -->
            <!-- LEFT MENU DARK BACKGROUND ======================================= -->
            <!-- ================================================================= -->
            <Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="#313536" />

Change this to this.
 

            <!-- ================================================================= -->
            <!-- LEFT MENU DARK BACKGROUND ======================================= -->
            <!-- ================================================================= -->
            <Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="#ffffff" />

 

[kdub87]

1 hour ago, Retro808 said:

You have a typo with transparent. You spelled it “trasnparent”. Try correcting that. 

Are you editing the right line of code though? If I remember that section he used a rectangle call to make that area if the screen the dark grey. Not a grid. 

Something like below I believe  

< Rectangle Grid.Column="0" Grid.ColumnSpan="7” ........... and so on ..... />

 

I tried again, making absolutely sure I had it spelled correctly. Still did not work.
 

            <!-- ================================================================= -->
            <!-- LEFT MENU DARK BACKGROUND ======================================= -->
            <!-- ================================================================= -->
            <Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="Transparent" />

I also tried using both to see what would happen. Didnt work.
 

            <!-- ================================================================= -->
            <!-- LEFT MENU DARK BACKGROUND ======================================= -->
            <!-- ================================================================= -->
            <Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="Transparent" Opacity="0.5" />

 

[kdub87]

I figured it out. I had it right in the beginning but the video was set to start at column 7, which is right after the dark grey box on the left.

Now I need to figure out how to properly shift the video to the right so it is always Right aligned.

Here is what I have right now.

 

            <!-- ================================================================= -->
            <!-- MAIN VIDEO, ON THE RIGHT ======================================== -->
            <!-- ================================================================= -->
            <transitions:TransitionPresenter x:Name="vidsource" Grid.Column="0" Grid.ColumnSpan="16" Grid.Row="0" Grid.RowSpan="15" TransitionSelector="{Binding ImageVideoTransitionSelector}" Content="{Binding ImageVideoView}" IsContentVideo="True" Visibility="Hidden"/>
            <Border Grid.Column="0" Grid.ColumnSpan="16" Grid.Row="1" Grid.RowSpan="13">
                <Border.Background>
                    <VisualBrush Visual="{Binding ElementName=vidsource, Path=Content}" x:Name="VideoRatio" Stretch="UniformToFill" AlignmentX="Center" AlignmentY="Center"/>
                </Border.Background>
                
            </Border>
			<!-- ================================================================= -->
            <!-- LEFT MENU DARK BACKGROUND ======================================= -->
            <!-- ================================================================= -->
            <Grid Grid.Column="0" Grid.ColumnSpan="7" Grid.Row="0" Grid.RowSpan="15" Background="#313536" Opacity="0.8" />

 

[Retro808]

Ah. OK. He must have updated the code since I last messed with that theme and looked at it. However, I do not think it is as simple as changing a color code. He constrained the video to start in column 7. That grid stops at the column adjacent to where the video starts. 

 

[kdub87]

@Retro808 do you know how to make this video shove itself to the top right corner? I have tried a few different methods and it just stays in the center.

<VisualBrush Visual="{Binding ElementName=vidsource, Path=Content}" x:Name="VideoRatio" AlignmentX="Right" AlignmentY="Top"/>

 

[Retro808]

12 hours ago, kdub87 said:

@Retro808 do you know how to make this video shove itself to the top right corner? I have tried a few different methods and it just stays in the center.

<VisualBrush Visual="{Binding ElementName=vidsource, Path=Content}" x:Name="VideoRatio" AlignmentX="Right" AlignmentY="Top"/>

 

Not sure on that. The AlignmentX and Y he used I have no experience with. The theme looks to be painting the video as the background. Usually you align an image or video with HorizontalAlignment and VerticalAlignment but that would not work for a visual brush. It might be best to post in his support thread. Viking's pretty good about responding and helping. Viking is doing a little more that just calling the video. There is also some animation and he is using a plugin as well.