Jump to content
LaunchBox Community Forums

XAML noob | Transparent Grid?


kdub87
 Share

Recommended Posts

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.

Link to comment
Share on other sites

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 ..... />

 

Link to comment
Share on other sites

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

 

Link to comment
Share on other sites

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

 

Link to comment
Share on other sites

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

 

Link to comment
Share on other sites

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. 

 

Link to comment
Share on other sites

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.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...