做一个网格3d看

时间:2011-06-12 17:48:37

标签: c# asp.net silverlight

Silverlight的新功能,我怎样才能使网格看起来像3D(有点像Silverlight进度条在视觉上突出)。我觉得我已经尝试了一切,但我的想法已经用完了。任何人都可以给我一个可以做到这一点的代码片段吗?

1 个答案:

答案 0 :(得分:2)

您是否尝试过使用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>