使网格看起来像3d

Question

对于Silverlight来说，我是个新手，如何才能让网格看起来像3D(有点像Silverlight进度条在视觉上的突出效果)。我觉得我已经尝试了所有的方法，但是我已经没有主意了。谁能给我一个可以做到这一点的代码片段？

Answer 1

您是否尝试过使用DropShadowEffect

<data:DataGrid>
  <data:DataGrid.Effect>
    <DropShadowEffect />
  </data:DataGrid.Effect>
  ...
  ...
</data:DataGrid>

当然，你也可以在其他控件上使用它。

创造一个凹陷的效果完全是关于照明的错觉。如果您在元素周围绘制一个边框，在顶部和左侧使用深色，在底部和右侧使用较浅的颜色，您会得到这样的印象，即内容已沉入表面。切换阴影将产生内容被提升的效果。

下面是一个小示例来演示

<UserControl x:Class="SilverlightApplication1.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"        
        mc:Ignorable="d"
        d:DesignHeight="300" d:DesignWidth="400" >
  <Grid x:Name="LayoutRoot" Background="Lightgray">
    <Grid.ColumnDefinitions>
      <ColumnDefinition />
      <ColumnDefinition />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
    </Grid.RowDefinitions>

    <StackPanel Grid.Row="1" Grid.Column="1" Orientation="Vertical">
      <!-- Sunken -->
      <Grid Width="100" Height="25" Background="Wheat" Margin="0,5,0,0">
        <!-- Draw the 3d border -->
        <Rectangle Height="1" Fill="DarkGray" HorizontalAlignment="Stretch" VerticalAlignment="Top" />
        <Rectangle Width="1" Fill="DarkGray" HorizontalAlignment="Left" VerticalAlignment="Stretch" />
        <Rectangle Height="1" Fill="White" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" />
        <Rectangle Width="1" Fill="White" HorizontalAlignment="Right" VerticalAlignment="Stretch" />

        <!-- Put your content in this Grid -->
        <Grid>
          <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Text="Sunken" />
        </Grid>
      </Grid>

      <!-- Raised -->
      <Grid Width="100" Height="25" Background="Wheat" Margin="0,5,0,0">
        <!-- Draw the 3d border -->
        <Rectangle Height="1" Fill="White" HorizontalAlignment="Stretch" VerticalAlignment="Top" />
        <Rectangle Width="1" Fill="White" HorizontalAlignment="Left" VerticalAlignment="Stretch" />
        <Rectangle Height="1" Fill="DarkGray" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" />
        <Rectangle Width="1" Fill="DarkGray" HorizontalAlignment="Right" VerticalAlignment="Stretch" />

        <!-- Put your content in this Grid -->
        <Grid>
          <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Text="Raised" />
        </Grid>
      </Grid>
    </StackPanel>
  </Grid>
</UserControl>