3D表面上的WPF文本

问题描述

我正在尝试使用WPF内置3D类（并且仅使用XAML）将某些文本转换为所需的角度。然后，使用此用户控件的代码调用控件中的方法将 renderPanel 呈现给png文件。根据这个xaml，它正在显示我想要的方式。但是，它在生成的PNG文件中看起来大不相同。

I'm trying to get some text to a desired angle using WPFs built-in 3D classes (and only using XAML). The code that uses this user control then calls a method in the control to render the renderPanel to a png file. According to this xaml, it's displaying exactly the way I want it. However, it looks substantially different in the resulting PNG file.

<UserControl x:Class="WpfControls.UserControl1"

             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 

             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 

             xmlns:sys="clr-namespace:System;assembly=mscorlib"

             mc:Ignorable="d" 

             d:DesignHeight="350" d:DesignWidth="350" removed="black"

             >
    <Grid x:Name="renderGrid">

        <Border x:Name="renderPanel" removed="Transparent" SnapsToDevicePixels="True" >
            <Viewport3D x:Name="viewPort" >
                <Viewport3D.Camera >
                    <PerspectiveCamera Position="0, 0, 5" />
                </Viewport3D.Camera>

                <Viewport2DVisual3D >
                    <Viewport2DVisual3D.Transform>
                        <RotateTransform3D>
                            <RotateTransform3D.Rotation>
                                <AxisAngleRotation3D Angle="51" Axis="-95, -10, -138" />
                            </RotateTransform3D.Rotation>
                        </RotateTransform3D>
                    </Viewport2DVisual3D.Transform>

                    <Viewport2DVisual3D.Geometry>
                        <MeshGeometry3D Positions="-1,1,0  -2.1,-1.1,0  1,-1.1,0  2,1,0"

                                        TextureCoordinates="0,0  0,1  1,1  1,0" 

                                        TriangleIndices="0 1 2 0 2 3"/>
                    </Viewport2DVisual3D.Geometry>

                    <Viewport2DVisual3D.Material>
                        <DiffuseMaterial Viewport2DVisual3D.IsVisualHostMaterial="True" 

                                         Brush="White"/>
                    </Viewport2DVisual3D.Material>

                    <!-- Putting the textblock into a border made the text look exactly the
                    way I wanted it to. -->
                    <Border BorderBrush="Transparent" BorderThickness="0" >
                        <TextBlock Text="11:35" FontWeight="Thin" 

                                   FontFamily="Roboto Th" Foreground="White" >
                        </TextBlock>
                    </Border>
                </Viewport2DVisual3D>

                <ModelVisual3D>
                    <ModelVisual3D.Content>
                        <DirectionalLight Color="#FFFFFFFF" Direction="0,-1,-1"/>
                    </ModelVisual3D.Content>
                </ModelVisual3D>
            </Viewport3D>
        </Border>
    </Grid>
</UserControl>

当我运行时，调用 Render 在下面的代码中，生成的图像文件看起来不同（好像文本块不在边框容器中）。如果你在xaml中注释出边框容器，你可以看到这个。

When, I run call the Render method in the following code, the resulting image file looks different (as if the textblock wasn't in the border container).You can see this if you comment out the border container in the xaml

using System;
using System.ComponentModel;
using System.IO;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media;
using System.Windows.Media.Imaging;

namespace WpfControls
{
    public partial class UserControl1 : UserControl
    {
        public UserControl1()
        {
            InitializeComponent();
            this.Height = 275;
            this.Width = 275;
            this.DataContext = this;
        }

        public void Render(string filename)
        {
            this.renderPanel.Measure(new System.Windows.Size(this.Width, this.Height));
            this.renderPanel.Arrange(new Rect(new System.Windows.Size(this.Width,
                                                                      this.Height)));
            this.renderPanel.UpdateLayout();
            this.UpdateLayout();
            RenderTargetBitmap rtb = new RenderTargetBitmap((int)this.renderPanel.ActualWidth,
                                                            (int)this.renderPanel.ActualHeight,
                                                            96d, 96d, PixelFormats.Pbgra32);
            rtb.Render(this.renderPanel);
            using (FileStream outputStream = new FileStream(filename, FileMode.Create))
            {
                PngBitmapEncoder enc = new PngBitmapEncoder();
                enc.Frames.Add(BitmapFrame.Create(rtb));
                enc.Save(outputStream);
                outputStream.Close();
            }
        }

    }
}

推荐答案

这篇关于3D表面上的WPF文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！