在windows 8中创建三维道路样效果

Question

如何在windows 8中使用Direct和Xaml创建一个类似于3d道路的效果。有人能帮助我或引导我在windows 8中创建一条类似于道路的效果吗?我正在附上一些类似的示例图像。

或者是否可以在xaml & C#中对其进行抑制。用那条路指引我。因为我在那个技术上更能被证实。我不是一个直接X的积极开发人员，我也不是一个寻找“为我做那个”的方法。我只需要指导方针或一些示例参考，以帮助我实现同样的。

​

​

Answer 1

所以，这将是很棘手的。我想指给你看MatrixTransform。完成你想做的事情的唯一方法。这可不是一件小事。MatrixTransform的一些功能已经封装在一个名为ProjectionPlane的助手类中，但它并没有给您提供图形所指示的压缩外观。考虑到开箱即用的ProjectionPanel，我认为这样的事情是你能做到的最好的事情。

​

​

记住，MatrixTransform可以做到这一点。但这将是一些工作。工作，就像我肯定的那样，需要创建你想要模仿的图形。太棒了可不是免费的。

<Grid Background="Black" VerticalAlignment="Center">
    <Grid.RowDefinitions>
        <RowDefinition Height="728" />
        <RowDefinition Height="40"/>
    </Grid.RowDefinitions>
    <Grid x:Name="BackgroundGrid" RenderTransformOrigin="0.5,0.5" Margin="0,0,0,-282" Grid.RowSpan="2">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Grid.RenderTransform>
            <CompositeTransform ScaleX="0.75" ScaleY="0.75" TranslateY="-250"/>
        </Grid.RenderTransform>
        <Grid.Projection>
            <PlaneProjection RotationX="-29"/>
        </Grid.Projection><Rectangle Fill="Gainsboro" Grid.Column="0" />
        <Rectangle Fill="Gainsboro" Grid.Column="2" />
        <Rectangle Fill="Gainsboro" Grid.Column="4" />
        <Rectangle Fill="Gainsboro" Grid.Column="6" />
        <Rectangle Fill="Gainsboro" Grid.Column="8" />
        <Rectangle Fill="Gainsboro" Grid.Column="10" />
        <Rectangle Fill="Gainsboro" Grid.Column="12" />
        <Rectangle Fill="Gainsboro" Grid.Column="14" />
        <Rectangle Fill="Gainsboro" Grid.Column="16" />
        <Rectangle Fill="Gainsboro" Grid.Column="18" />
        <Rectangle Fill="Gainsboro" Grid.Column="20" />
        <Rectangle Fill="Gray" Grid.Column="1" />
        <Rectangle Fill="Gray" Grid.Column="3" />
        <Rectangle Fill="Gray" Grid.Column="5" />
        <Rectangle Fill="Gray" Grid.Column="7" />
        <Rectangle Fill="Gray" Grid.Column="9" />
        <Rectangle Fill="Gray" Grid.Column="11" />
        <Rectangle Fill="Gray" Grid.Column="13" />
        <Rectangle Fill="Gray" Grid.Column="15" />
        <Rectangle Fill="Gray" Grid.Column="17" />
        <Rectangle Fill="Gray" Grid.Column="19" />
    </Grid>
    <ScrollViewer x:Name="ForegroundGrid"  RenderTransformOrigin="0.5,0.5" Margin="0,0,0,-282">
        <ScrollViewer.RenderTransform>
            <CompositeTransform ScaleX="0.75" ScaleY="0.75" TranslateY="-230"/>
        </ScrollViewer.RenderTransform>
        <ScrollViewer.Projection>
            <PlaneProjection RotationX="-29"/>
        </ScrollViewer.Projection>
        <Grid>
        <Grid.Resources>
            <Style TargetType="Ellipse">
                <Setter Property="Height" Value="50" />
                <Setter Property="Width" Value="50" />
                <Setter Property="Fill" Value="Green" />
                <Setter Property="VerticalAlignment" Value="Top" />
            </Style>
        </Grid.Resources>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Ellipse Margin="0,1040,0,0" Grid.Column="0" />
        <Ellipse Margin="0,1240,0,0" Grid.Column="3" />
        <Ellipse Margin="0,550,0,0" Grid.Column="4" />
        <Ellipse Margin="0,350,0,0" Grid.Column="4" />
        <Ellipse Margin="0,600,0,0" Grid.Column="7" />
        <Ellipse Margin="0,1450,0,0" Grid.Column="11" />
        <Ellipse Margin="0,650,0,0" Grid.Column="13" />
        <Ellipse Margin="0,1150,0,0" Grid.Column="13" />
        <Ellipse Margin="0,450,0,0" Grid.Column="14" />
        <Ellipse Margin="0,1250,0,0" Grid.Column="17" />
        <Ellipse Margin="0,550,0,0" Grid.Column="18" />
    </Grid>
    </ScrollViewer>
    <Grid x:Name="BottomGrid" Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
            <ColumnDefinition Width="1*" />
        </Grid.ColumnDefinitions>
        <Rectangle Fill="Orange" Grid.Column="0" />
        <Rectangle Fill="Orange" Grid.Column="2" />
        <Rectangle Fill="Orange" Grid.Column="4" />
        <Rectangle Fill="Orange" Grid.Column="6" />
        <Rectangle Fill="Orange" Grid.Column="8" />
        <Rectangle Fill="Orange" Grid.Column="10" />
        <Rectangle Fill="Orange" Grid.Column="12" />
        <Rectangle Fill="Orange" Grid.Column="14" />
        <Rectangle Fill="Orange" Grid.Column="16" />
        <Rectangle Fill="Orange" Grid.Column="18" />
        <Rectangle Fill="Orange" Grid.Column="20" />
        <Rectangle Fill="Chocolate" Grid.Column="1" />
        <Rectangle Fill="Chocolate" Grid.Column="3" />
        <Rectangle Fill="Chocolate" Grid.Column="5" />
        <Rectangle Fill="Chocolate" Grid.Column="7" />
        <Rectangle Fill="Chocolate" Grid.Column="9" />
        <Rectangle Fill="Chocolate" Grid.Column="11" />
        <Rectangle Fill="Chocolate" Grid.Column="13" />
        <Rectangle Fill="Chocolate" Grid.Column="15" />
        <Rectangle Fill="Chocolate" Grid.Column="17" />
        <Rectangle Fill="Chocolate" Grid.Column="19" />
        <Grid HorizontalAlignment="Left" Height="100" VerticalAlignment="Top" Width="100" Grid.ColumnSpan="2">
            <Grid RenderTransformOrigin="0.5,0.5" Margin="0,0,-1266,-950">
                <Grid.Resources>
                    <Style TargetType="Ellipse">
                        <Setter Property="Height" Value="50" />
                        <Setter Property="Width" Value="50" />
                        <Setter Property="Fill" Value="Green" />
                        <Setter Property="VerticalAlignment" Value="Top" />
                    </Style>
                </Grid.Resources>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                    <ColumnDefinition Width="1*" />
                </Grid.ColumnDefinitions>
                <Grid.RenderTransform>
                    <CompositeTransform ScaleX="0.75" ScaleY="0.75" TranslateY="-250"/>
                </Grid.RenderTransform>
                <Grid.Projection>
                    <PlaneProjection RotationX="-29"/>
                </Grid.Projection>
                <Ellipse Margin="0,040,0,0" Grid.Column="0" />
                <Ellipse Margin="0,240,0,0" Grid.Column="3" />
                <Ellipse Margin="0,550,0,0" Grid.Column="4" />
                <Ellipse Margin="0,350,0,0" Grid.Column="4" />
                <Ellipse Margin="0,600,0,0" Grid.Column="7" />
                <Ellipse Margin="0,450,0,0" Grid.Column="11" />
                <Ellipse Margin="0,650,0,0" Grid.Column="13" />
                <Ellipse Margin="0,250,0,0" Grid.Column="13" />
                <Ellipse Margin="0,450,0,0" Grid.Column="14" />
                <Ellipse Margin="0,250,0,0" Grid.Column="17" />
                <Ellipse Margin="0,550,0,0" Grid.Column="18" />
            </Grid>
        </Grid>
    </Grid>
</Grid>

您可能会以DX而不是XAML的身份获得最好的运气。但是，如果您不知道DX，那么您可以点击XAML解决方案，这将是很棒的，当你得到它。我敢肯定。

祝你好运！