当前位置: 首页 > news >正文

WPF 3D 开发全攻略:实现3D模型创建、旋转、平移、缩放

🎮 WPF 3D 入门实战:从零打造一个可交互的立方体模型

标题:
🚀《WPF 3D 开发全攻略:实现旋转、平移、缩放与法线显示》


💡 引言

在现代图形应用中,3D 可视化已经成为不可或缺的一部分。WPF 提供了强大的 Viewport3D 控件,支持我们在桌面应用中轻松构建三维场景。

本文将手把手带你实现一个完整的 WPF 3D 应用程序,包括:

  • 创建基础立方体模型
  • 添加光源和材质
  • 实现鼠标控制视角(旋转、平移、缩放)
  • 法线计算与可视化展示
  • 完整项目结构与代码解析

非常适合刚接触 WPF 3D 的开发者入门学习!


🧱 第一步:创建窗口与视口

我们使用 Viewport3D 来承载所有 3D 内容,并为其添加相机和光源。

✅ XAML 部分(MainWindow.xaml)

<Window x:Class="_3D_WPF_Demo.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"Title="3D 立方体交互演示" Height="900" Width="1600"><Grid><Viewport3D Name="viewPort"MouseLeftButtonDown="ViewPort_MouseLeftButtonDown"MouseLeftButtonUp="ViewPort_MouseLeftButtonUp"MouseMove="ViewPort_MouseMove"PreviewMouseWheel="ViewPort_PreviewMouseWheel"MouseDown="ViewPort_MouseDown"MouseUp="ViewPort_MouseUp"><!-- 环境光 --><ModelVisual3D><ModelVisual3D.Content><Model3DGroup><AmbientLight Color="White"/></Model3DGroup></ModelVisual3D.Content></ModelVisual3D><!-- 方向光 --><ModelVisual3D><ModelVisual3D.Content><Model3DGroup><DirectionalLight Color="White" Direction="0,1,0"/></Model3DGroup></ModelVisual3D.Content></ModelVisual3D><!-- 相机 --><Viewport3D.Camera><PerspectiveCamera x:Name="mainCamera"Position="0,0,300"LookDirection="0,0,-1"UpDirection="0,1,0"FieldOfView="60"/></Viewport3D.Camera></Viewport3D></Grid>
</Window>

📦 第二步:创建立方体模型

我们手动定义立方体顶点和三角形索引,并通过工具类生成几何体。

🧰 工具类 _3DModelOperateHelper.cs

using System.Windows.Media;
using System.Windows.Media.Media3D;namespace _3D_WPF_Demo.Tools
{public static class _3DModelOperateHelper{public static GeometryModel3D CreateSingleColorCube(int width, int height, int depth, DiffuseMaterial diffuseMaterial){Point3DCollection points = new Point3DCollection(new Point3D[] {new Point3D(-0.5*width, -0.5*height, -0.5*depth), // 0new Point3D(0.5*width, -0.5*height, -0.5*depth),  // 1new Point3D(0.5*width, 0.5*height, -0.5*depth),   // 2new Point3D(-0.5*width, 0.5*height, -0.5*depth),  // 3new Point3D(-0.5*width, -0.5*height, 0.5*depth),  // 4new Point3D(0.5*width, -0.5*height, 0.5*depth),   // 5new Point3D(0.5*width, 0.5*height, 0.5*depth),    // 6new Point3D(-0.5*width, 0.5*height, 0.5*depth)    // 7});Int32Collection triangles = new Int32Collection(new int[] {// 底面 (Z-)0, 1, 2, 2, 3, 0,// 顶面 (Z+)4, 5, 6, 6, 7, 4,// 前面 (Y+)3, 2, 6, 6, 7, 3,// 后面 (Y-)0, 1, 5, 5, 4, 0,// 右面 (X+)1, 2, 6, 6, 5, 1,// 左面 (X-)4, 7, 3, 3, 0, 4});MeshGeometry3D mesh = new MeshGeometry3D();mesh.Positions = points;mesh.TriangleIndices = triangles;mesh.Normals = CalculateNormals(mesh); // 计算法线mesh.Freeze();return new GeometryModel3D{Geometry = mesh,Material = diffuseMaterial,BackMaterial = diffuseMaterial};}private static Vector3DCollection CalculateNormals(MeshGeometry3D mesh){var normals = new Vector3DCollection();for (int i = 0; i < mesh.TriangleIndices.Count; i += 3){int i1 = mesh.TriangleIndices[i];int i2 = mesh.TriangleIndices[i + 1];int i3 = mesh.TriangleIndices[i + 2];Point3D p1 = mesh.Positions[i1];Point3D p2 = mesh.Positions[i2];Point3D p3 = mesh.Positions[i3];Vector3D v1 = p2 - p1;Vector3D v2 = p3 - p1;Vector3D normal = Vector3D.CrossProduct(v1, v2);normal.Normalize();normals.Add(normal);normals.Add(normal);normals.Add(normal);}return normals;}}
}

🖱️ 第三步:实现交互操作

MainWindow.xaml.cs 中实现鼠标控制相机旋转、平移和缩放功能。

🧩 主要逻辑(MainWindow.xaml.cs)

using System.Windows;
using System.Windows.Controls;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Media3D;namespace _3D_WPF_Demo
{public partial class MainWindow : Window{private bool isDragging = false;private Point lastMousePosition;private double cameraDistance = 300;private Point3D centerPoint = new Point3D(0, 0, 0);private bool isPanning = false;private Point lastPanMousePosition;private Vector3D panOffset = new Vector3D(0, 0, 0);private ModelVisual3D modelVisual;private TranslateTransform3D modelTranslation = new TranslateTransform3D();private double yaw = 0;private double pitch = 0;public MainWindow(){InitializeComponent();viewPort.LostMouseCapture += (s, e) =>{isDragging = false;isPanning = false;Mouse.Capture(null);};LoadModel();UpdateCamera();}private void LoadModel(){var material = new DiffuseMaterial(new SolidColorBrush(Colors.Orange));GeometryModel3D model = _3DModelOperateHelper.CreateSingleColorCube(10, 10, 10, material);modelVisual = new ModelVisual3D();modelVisual.Content = model;modelVisual.Transform = modelTranslation;viewPort.Children.Add(modelVisual);if (model.Geometry is MeshGeometry3D mesh){var normalGroup = new Model3DGroup();AddNormalLines(mesh, normalGroup);var normalVisual = new ModelVisual3D { Content = normalGroup };viewPort.Children.Add(normalVisual);}}private void AddNormalLines(MeshGeometry3D mesh, Model3DGroup group){if (mesh.Positions == null || mesh.TriangleIndices == null || mesh.Normals == null)return;int indexCount = mesh.TriangleIndices.Count;for (int i = 0; i < indexCount; i += 3){int i1 = mesh.TriangleIndices[i];int i2 = mesh.TriangleIndices[i + 1];int i3 = mesh.TriangleIndices[i + 2];Point3D p1 = mesh.Positions[i1];Point3D p2 = mesh.Positions[i2];Point3D p3 = mesh.Positions[i3];Point3D center = new Point3D((p1.X + p2.X + p3.X) / 3,(p1.Y + p2.Y + p3.Y) / 3,(p1.Z + p2.Z + p3.Z) / 3);Vector3D normal = mesh.Normals[i / 3];Point3D endPoint = center + normal * 5;var lineMesh = new MeshGeometry3D();lineMesh.Positions.Add(center);lineMesh.Positions.Add(endPoint);lineMesh.TriangleIndices.Add(0);lineMesh.TriangleIndices.Add(1);lineMesh.TriangleIndices.Add(1);var material = new DiffuseMaterial(Brushes.Magenta);var model = new GeometryModel3D(lineMesh, material);group.Children.Add(model);}}private void ViewPort_MouseLeftButtonDown(object sender, MouseButtonEventArgs e){isDragging = true;lastMousePosition = e.GetPosition(viewPort);Mouse.Capture(viewPort);}private void ViewPort_MouseLeftButtonUp(object sender, MouseButtonEventArgs e){isDragging = false;Mouse.Capture(null);}private void ViewPort_MouseMove(object sender, MouseEventArgs e){var current = e.GetPosition(viewPort);if (isDragging){Vector delta = current - lastMousePosition;yaw += delta.X * 0.3;pitch -= delta.Y * 0.3;UpdateCamera();lastMousePosition = current;}else if (isPanning){UpdateCamera();lastPanMousePosition = current;}}private void ViewPort_PreviewMouseWheel(object sender, MouseWheelEventArgs e){double zoomFactor = e.Delta > 0 ? 1.1 : 0.9;cameraDistance *= zoomFactor;cameraDistance = Math.Max(50, Math.Min(cameraDistance, 1000));UpdateCamera();}private void ViewPort_MouseDown(object sender, MouseButtonEventArgs e){if (e.ChangedButton == MouseButton.Middle){isPanning = true;lastPanMousePosition = e.GetPosition(viewPort);Mouse.Capture(viewPort);e.Handled = true;}}private void ViewPort_MouseUp(object sender, MouseButtonEventArgs e){if (e.ChangedButton == MouseButton.Left){isDragging = false;Mouse.Capture(null);}if (e.ChangedButton == MouseButton.Middle){isPanning = false;Mouse.Capture(null);e.Handled = true;}}private void UpdateCamera(){Vector3D initialLookDirection = new Vector3D(0, 0, -1);Matrix3D rotationMatrix = new Matrix3D();rotationMatrix.Rotate(new Quaternion(new Vector3D(0, 1, 0), yaw));rotationMatrix.Rotate(new Quaternion(new Vector3D(1, 0, 0), pitch));Vector3D rotatedLookDirection = rotationMatrix.Transform(initialLookDirection);mainCamera.Position = new Point3D(centerPoint.X - rotatedLookDirection.X * cameraDistance,centerPoint.Y - rotatedLookDirection.Y * cameraDistance,centerPoint.Z - rotatedLookDirection.Z * cameraDistance);mainCamera.LookDirection = rotatedLookDirection;mainCamera.UpDirection = new Vector3D(0, 1, 0);Vector3D forward = rotatedLookDirection;forward.Normalize();Vector3D right = Vector3D.CrossProduct(new Vector3D(0, 1, 0), forward);if (right.Length == 0) right = new Vector3D(1, 0, 0);right.Normalize();Vector3D up = Vector3D.CrossProduct(forward, right);up.Normalize();if (isPanning){double panSpeed = 0.1;var delta = lastPanMousePosition - Mouse.GetPosition(viewPort);panOffset += right * (panSpeed * delta.X);panOffset += up * (panSpeed * delta.Y);modelTranslation.OffsetX = panOffset.X;modelTranslation.OffsetY = panOffset.Y;modelTranslation.OffsetZ = panOffset.Z;lastPanMousePosition = Mouse.GetPosition(viewPort);}}}
}

🎨 功能总结

功能描述
🧱 立方体建模手动定义顶点与三角形索引
🔆 光源设置环境光 + 方向光增强视觉效果
🖱️ 鼠标交互支持左键旋转、中键平移、滚轮缩放
🧭 相机控制使用四元数进行相机旋转,避免万向节死锁
📐 法线可视化绘制每个面的法线方向,便于理解光照原理

📚 小结与展望

本项目是一个非常完整的 WPF 3D 入门示例,涵盖了从模型创建到交互控制的核心知识点。你可以在此基础上继续扩展:

  • 加载 .obj.fbx 模型文件
  • 添加 UI 控件切换显示/隐藏法线
  • 使用 Helix Toolkit 实现更高级的功能
  • 实现动画、碰撞检测、粒子系统等进阶功能

📢 结语

如果你是 WPF 初学者或想了解 3D 编程,这个项目是非常好的起点。它不仅展示了如何使用 Viewport3DMedia3D,还帮助你掌握三维空间中的基本变换和交互技巧。

📌 下期预告:《WPF 3D 进阶篇:使用 Helix Toolkit 快速开发 3D 应用》敬请期待!


如需下载项目源码,关注群名片,我会提供压缩包链接。欢迎点赞、收藏、转发分享给更多学习者!👏

http://www.lqws.cn/news/545113.html

相关文章:

  • 记录一个C#/.NET的HTTP工具类
  • Feign 实战指南:从 REST 替代到性能优化与最佳实践
  • 文法、正规式相关习题
  • Linux系统(信号篇)信号的保存
  • WinAppDriver 自动化测试:JavaScript 篇
  • gRPC技术解析与python示例
  • Python基础知识之文件
  • JMH (Java Microbenchmark Harness)
  • .NET MAUI跨平台串口通讯方案
  • (LeetCode 面试经典 150 题 ) 238. 除自身以外数组的乘积 (前缀和)
  • LeetCode 312 戳气球题解(Swift)+ 区间 DP 原理详解 + 可运行代码
  • WSL升级到24.04
  • 使用 asp.net core webapi 导出数据文件
  • .NetCore+Vue快速生产框架开发详细方案
  • LeetCode 349题解 | 两个数组的交集
  • 苍穹外卖day5--Redis设置店铺营业状态
  • 基于ubuntu 22.04环境安装NEURON仿真器
  • jenkins中执行python脚本导入路径错误
  • 跟着AI学习C#之项目实战-电商平台 Day3
  • 《聊一聊ZXDoc》之汽车服务导向SOME/IP
  • 自动登录脚本神器-Mac电脑实现自动登录堡垒机并自动输入账号密码跳转不同机器环境
  • uniapp处理后端返回的html字符串
  • spring-security-oauth2系列:自定义认证服务器
  • 为什么python处理csv文件将某个值替换成另一个值并另存后,csv文件的大小减小了一半
  • Nginx 与 Apache:有什么区别?哪种服务器最适合您?
  • 【数据挖掘】数据采集和预处理
  • 如何确保京东商品数据采集的准确性和及时性?
  • 【lua】Linux上安装lua和luarocks包管理工具
  • 提升AI准确性的关键:精准添加上下文
  • 【NodeJs】【npm】npm安装electron报错