• 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏吧

我怎么能在我的网格线分隔在UWP

c/c++ 来源:NicoTing 5次浏览

我有我的网格中的3个定义:我怎么能在我的网格线分隔在UWP

<Grid.RowDefinitions> 
    <RowDefinition Height=".1*"/> 
    <RowDefinition Height="*"/> 
    <RowDefinition Height=".1*"/> 
</Grid.RowDefinitions> 

我怎样才能让这个看起来像这样: enter image description here

,你可以看到我的行被行隔开,那是怎么回事?

感谢

===========解决方案如下:

您可以使用边界这样的 –

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height=".1*"/> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height=".1*"/> 
    </Grid.RowDefinitions> 

    <Border Grid.Row="0" BorderThickness="1" BorderBrush="Gray" VerticalAlignment="Bottom"/> 
    <!-- Your Contents --> 

    <Border Grid.Row="1" BorderThickness="1" BorderBrush="Gray" VerticalAlignment="Bottom"/> 
</Grid> 

输出

Output

更新

使用只有边框可能看起来不太好,所以你需要使用社区工具包的阴影,但它需要你使用min 10.0.15063,所以这里是自定义阴影效果比社区工具包更薄的角落,不要忘记调整边框根据您的要求在风格阴影厚度目前我使用的“2”,增加它,如果你想—

<Page.Resources> 
    <Style x:Key="DownwardDropShadow" TargetType="Border"> 
     <Setter Property="CornerRadius" Value="100" /> 
     <Setter Property="BorderThickness" Value="0,0,0,2" /> 
     <Setter Property="BorderBrush"> 
      <Setter.Value> 
       <LinearGradientBrush> 
        <GradientStop Color="#ccc" Offset="1" /> 
        <GradientStop Color="#ddd" Offset="0" /> 
       </LinearGradientBrush> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <Style x:Key="UpwardDropShadow" TargetType="Border"> 
     <Setter Property="CornerRadius" Value="100" /> 
     <Setter Property="BorderThickness" Value="0,2,0,0" /> 
     <Setter Property="BorderBrush"> 
      <Setter.Value> 
       <LinearGradientBrush> 
        <GradientStop Color="#ccc" Offset="1" /> 
        <GradientStop Color="#ddd" Offset="0" /> 
       </LinearGradientBrush> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources> 

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height=".1*"/> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height=".1*"/> 
    </Grid.RowDefinitions> 

    <Border Grid.Row="0" Style="{StaticResource DownwardDropShadow}" BorderThickness="1.5" Opacity="0.9" BorderBrush="#ddd" VerticalAlignment="Bottom" Background="#FFC8D5DD" /> 

    <!-- Your Contents --> 

    <Border Grid.Row="1" Style="{StaticResource UpwardDropShadow}" BorderThickness="1.5" Opacity="0.9" BorderBrush="#ccc" VerticalAlignment="Bottom"/> 
</Grid> 

输出

Output


版权声明:本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系管理员进行删除。
喜欢 (0)