如何在網格行周圍添加透明邊框？

在網格內部有一個網格。需要內部網格有一個透明邊框，以便外部網格的背景顏色顯示。如何在網格行周圍添加透明邊框？

到目前爲止：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Rectangle Fill="#999999" Grid.Column="0" ></Rectangle> 
    <Rectangle Fill="White" Grid.Column="1"></Rectangle> 

    <Grid x:Name="gridLeft" Grid.Column="0" Background="#DFDFDF"> 
<Border BorderBrush="Transparent" BorderThickness="30" Grid.ColumnSpan="4" Grid.RowSpan="1"></Border> 

     <Rectangle Grid.RowSpan="4" Grid.ColumnSpan="4" Style="{StaticResource RightGridLine}"/> 
     <Rectangle Grid.Column="0" Grid.RowSpan="3" Style="{StaticResource RightGridLine}"></Rectangle> 
     <Rectangle Grid.Column="1" Grid.RowSpan="3" Style="{StaticResource RightGridLine}"></Rectangle> 
     <Rectangle Grid.Column="2" Grid.RowSpan="3" Style="{StaticResource RightGridLine}"></Rectangle> 

     <Grid.RowDefinitions> 
      <RowDefinition></RowDefinition> 
      <RowDefinition></RowDefinition> 
      <RowDefinition></RowDefinition> 
      <RowDefinition></RowDefinition> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="1*"></ColumnDefinition> 
      <ColumnDefinition Width="2*"></ColumnDefinition> 
      <ColumnDefinition Width="1*"></ColumnDefinition> 
      <ColumnDefinition Width="1*"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
    </Grid> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
     <ColumnDefinition Width="*"></ColumnDefinition> 
    </Grid.ColumnDefinitions> 
</Grid>

然而，由於上面的透明邊框是在內部網格，它只是說明，而不是外部電網的背景色內網的背景色。

enter image description here

來源

2014-05-16 O.O

我看到一個網格，也許快速MSPAINT塗鴉圖像或者什麼來幫助你可視化後是什麼？ –

@ChrisW。我更新了它。 –

灰色應該是透明還是藍色？ –

好了，所以如果我理解正確的，你想是像你通常會使用不透明蒙了，但你沒有在WinRT中應用該選項。所以你根據自己的需要組織事情。作爲一個簡單的例子，更像這樣的東西適合你。

<Grid Width="500" Background="Gray"> 

    <Grid Margin="20"> 
    <Grid.RowDefinitions> 
     <RowDefinition/> 
     <RowDefinition Height="10"/> 
     <RowDefinition/> 
     <RowDefinition Height="10"/> 
     <RowDefinition/> 
     <RowDefinition Height="10"/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition Width="5"/> 
     <ColumnDefinition/> 
     <ColumnDefinition Width="5"/> 
     <ColumnDefinition/> 
     <ColumnDefinition Width="5"/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <Grid.Resources> 
     <Style TargetType="Rectangle"> 
     <Setter Property="Fill" Value="#FF0066FF"/> 
     </Style> 
    </Grid.Resources> 

    <Rectangle/> 
    <Rectangle Grid.Column="2"/> 
    <Rectangle Grid.Column="4"/> 
    <Rectangle Grid.Column="6"/> 
    <Rectangle Grid.Row="2"/> 
    <Rectangle Grid.Row="2" Grid.Column="2"/> 
    <Rectangle Grid.Row="2" Grid.Column="4"/> 
    <Rectangle Grid.Row="2" Grid.Column="6"/> 
    <Rectangle Grid.Row="4"/> 
    <Rectangle Grid.Row="4" Grid.Column="2"/> 
    <Rectangle Grid.Row="4" Grid.Column="4"/> 
    <Rectangle Grid.Row="4" Grid.Column="6"/> 
    <Rectangle Grid.Row="6"/> 
    <Rectangle Grid.Row="6" Grid.Column="2"/> 
    <Rectangle Grid.Row="6" Grid.Column="4"/> 
    <Rectangle Grid.Row="6" Grid.Column="6"/> 

    <TextBlock Text="Something"/> 
    <TextBlock Grid.Row="2" Text="Something"/> 
    <TextBlock Grid.Row="4" Text="Something"/> 
    <TextBlock Grid.Row="6" Text="Something"/> 

    </Grid> 

</Grid>

enter image description here

來源

2014-05-16 16:47:30

如何在網格行周圍添加透明邊框？

回答

相關問題