이 Post 는 WPF 에서 사용 가능한 대표적인 3D Library HelixToolkit 의 사용법을 간단히 알아봅니다.
기존에 만든 프로젝트에서는 .Net Framework 4.7.1 에서 테스트 했으나 이번에는 .Net 8.0 을 사용하여 테스트 했습니다.
그렇다 해도 .Net Framework 와 거의 차이가 없음을 확인 했습니다.
Nuget 패키지를 다운받을때, HelixToolkit.Wpf 는 .Net Framework 용이고 HelixToolkit.Core.Wpf 는 .Net 용이니 이것만 주의하면 됩니다.
1. MainWindow.xaml
<Window x:Class="HelixToolkitTest02.MainWindow"
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"
xmlns:local="clr-namespace:HelixToolkitTest02"
xmlns:helix="http://helix-toolkit.org/wpf"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<helix:HelixViewport3D x:Name="helixViewport" Background="Black"
ZoomExtentsWhenLoaded="True"
ShowCoordinateSystem="True"
ZoomAroundMouseDownPoint="True"
RotateAroundMouseDownPoint="True">
<helix:DefaultLights/>
<helix:CoordinateSystemVisual3D />
<helix:SortingVisual3D x:Name="sortingVisual3D"/>
<helix:TextVisual3D Text="Hello, Helix Toolkit!" Position="0,0,0" Foreground="White">
<helix:TextVisual3D.Transform>
<ScaleTransform3D ScaleX="10" ScaleY="10" ScaleZ="10"/>
</helix:TextVisual3D.Transform>
</helix:TextVisual3D>
</helix:HelixViewport3D>
</Grid>
</Window>
7: helix 를 namespace 로 등록 합니다.
12: 처음 화면이 로드 되었을때 너무 꽉차 보이지 않도록 자동으로 확장 합니다.
13: CoorDinate 를 보이게 합니다. 일번적인 3D 화면에서 세 방향으로 화살표 그려져 있는 그거예요.
14: Zoom 을 할때 마우스 포인터 기준으로 Zoom 하게 됩니다. 이게 없으면 화면 중앙에서 Zoom 합니다.
15: 마찬가지로 회전할때 마우스 포인터 기준으로 회전 하게 됩니다.
20~22: TextVisual3D 는 텍스트 객체입니다. 흔히 크기를 조절할 때 Text 는 FontSize 를 떠올리게 되는데요, FontSize 로는 크기를 조절할 수 없습니다. ScaleTransform3D 로 크기를 조절 합니다.
2. MainWindow.xaml.cs
public MainWindow()
{
InitializeComponent();
DrawTestObject();
}
private void DrawTestObject()
{
SphereVisual3D sphereVisual3D_Inside = new SphereVisual3D
{
Center = new Point3D(50, 50, 50),
Radius = 5,
Fill = Brushes.Red,
ThetaDiv = 10,
PhiDiv = 10,
};
sphereVisual3D_Inside.EndEdit();
sortingVisual3D.Children.Add(sphereVisual3D_Inside);
SphereVisual3D sphereVisual3D = new SphereVisual3D
{
Center = new Point3D(50, 50, 50),
Radius = 10,
Material = MaterialHelper.CreateMaterial(Colors.Red, 0.6),
ThetaDiv = 10,
PhiDiv = 10,
};
sphereVisual3D.EndEdit();
sortingVisual3D.Children.Add(sphereVisual3D);
CubeVisual3D cubeVisual3D_Inside = new CubeVisual3D
{
Center = new Point3D(100, 50, 50),
SideLength = 5,
Fill = Brushes.Blue,
};
cubeVisual3D_Inside.EndEdit();
sortingVisual3D.Children.Add(cubeVisual3D_Inside);
CubeVisual3D cubeVisual3D = new CubeVisual3D
{
Center = new Point3D(100, 50, 50),
SideLength = 10,
Material = MaterialHelper.CreateMaterial(Colors.Blue, 0.6)
};
cubeVisual3D.EndEdit();
sortingVisual3D.Children.Add(cubeVisual3D);
}SphereVisual3D 는 구, CubeVisual3D 는 육면체 입니다.
Fill 과 Material 이 혼용되어 있는데, Fill 은 단순 색상으로 채우는 것이고, Material 은 여러가지 표면 효과를 줄 수 있습니다.
여기서는 그냥 투명도를 좀 줘서 객체가 겹쳐있는 것이 보이도록 했습니다.
EndEdit 는 더이상 그 객체를 수정하지 않겠다는 뜻입니다.
EndEdit 를 하지 않는 한, 해당 객체는 화면에 올라가 있어도 계속하여 위치를 옮기거나 색을 변경 할 수 있습니다.
다만 EndEdit 를 해야 랜더링 할 때 (Pan, Zoom, Rotation) 속도가 훨씬 빨라집니다.
ThetaDiv: 수평 방향 도형 분할 개수, PhiDiv: 수직 방향 도형 분할 개수 입니다.
이 수치가 적을수록 완전한 구 형태가 아닌 각이진 형태로 보이게 됩니다.
랜더링 속도를 위해 적당히 타협 하는게 좋습니다.
3. 마우스 버튼 설정
기본 상태는 회전은 마우스 우클릭, 이동은 마우스 가운데 버튼 클릭 입니다.
왼쪽은 아마도 나중에 객체 선택시 이벤트를 위해 남겨둔것 같습니다.
하지만 왼쪽 클릭을 사용하지 않는다면 굳이 어색한 상태로 둘 필요는 없겠죠.
다음과 같이 수정 가능 합니다.
helixViewport.RotateGesture = new MouseGesture(MouseAction.LeftClick);
helixViewport.RotateGesture2 = null;
helixViewport.PanGesture = new MouseGesture(MouseAction.RightClick);
helixViewport.PanGesture2 = null;이렇게 설정해 두면, 마우스 왼쪽 클릭은 회전, 마우스 오른쪽 클릭은 이동으로 변경 됩니다.
Helix Toolkit 는 무료에 소스까지 공개되어 있는 WPF 및 WinForm 등에서 사용 가능한 유용한 3D 라이브러리 입니다.
3D 모델을 읽어오거나 3D 분산 차트를 만드는 등 여러 방면으로 활용 가능합니다.
공식 HelixToolkit GitHub 에 다양한 예제가 있으니 확인해 보시면 좋을 것 같습니다.