Skip to content

Adding Contents into Viewport3DX

byran77 edited this page Jul 18, 2021 · 4 revisions

Add Lights

HelixToolkit.SharpDX provides 3 different lights: Directional Light, Spot Light and Point light. Currently HelixToolkit supports up to 8 lights. Each additional light may introduces performance penalty. Try to reduce number of lights if getting performance hit.

To add lights into the viewport, simple add lights into the viewport contents as following:

<hx:Viewport3DX Camera="{Binding Camera}" EffectsManager="{Binding EffectsManager}">
	<hx:DirectionalLight3D Direction="0, 0, -1" Color="White" />
</hx:Viewport3DX>

Add Geometry and Material

Currently 4 kinds of basic geometries are supported: Mesh, Line, Point, and Billboard. BoneSkinned Mesh provides bone skinned animation support for Mesh.

Different kinds of geometries need to use different GeometryModel for rendering. For example, Mesh uses MeshGeometryModel3D, Line uses LineGeometryModel3D, Point uses PointGeometryModel3D, etc.

Several materials have been provided for each geometry types.

For Mesh, material includes PhongMaterial, PBRMatieral, DiffuseMaterial, ColorStripeMaterial, NormalMaterial, PositionMaterial, VertColorMaterial.

For Line model, material includes LineMaterial and LineArrowMaterial. LineGeometryModel3D uses LineMaterial internally and expose the material properties through dependency properties. LineMaterialGeometryModel3D accepts LineMaterial through its Material property. Point model is similar to Line model.

To render a mesh, both Mesh data and a Material need to be provided. Following uses MeshBuilder to create a simple box mesh, and render it using MeshGeometryModel3D with PhongMaterial.

public class MainViewModel
{
	public EffectsManager EffectsManager { get; }

	public Camera Camera { get; }

	public Geometry3D CubeMesh { get; }

	public Material Red { get; }

	public MainViewModel()
	{
		EffectsManager = new DefaultEffectsManager();
		Camera = new PerspectiveCamera();
		var builder = new MeshBuilder();
		builder.AddCube();
		CubeMesh = builder.ToMesh();
		Red = PhongMaterials.Red;
	}
}
<hx:Viewport3DX Camera="{Binding Camera}" EffectsManager="{Binding EffectsManager}">
	<hx:DirectionalLight3D Direction="0, 0, -1" Color="White" />
	<hx:MeshGeometryModel3D Geometry="{Binding CubeMesh}" Material="{Binding Red}" />
</hx:Viewport3DX>

If you don't need to use XAML binding, you can always use code behind to add contents into viewport as following:

viewport.Items.Add(new DirectionalLight3D()
{
	Direction = new System.Windows.Media.Media3D.Vector3D(0, 0, -1),
	Color = System.Windows.Media.Colors.White
});
viewport.Items.Add(new MeshGeometryModel3D()
{
	Geometry = CubeMesh, 
	Material = Red
});

Grouping

HelixToolkit provides GroupModel3D to help organizing different Models.

<hx:Viewport3DX Camera="{Binding Camera}" EffectsManager="{Binding EffectsManager}">
	<hx:GroupModel3D>
		<hx:DirectionalLight3D Direction="0, 0, -1" Color="White" />
		<hx:DirectionalLight3D Direction="0, -1, 0" Color="White"/>
	</hx:GroupModel3D>
	<hx:GroupModel3D>
		<hx:SpotLight3D Direction="0, 1, 0" Color="Red" Position="0, -2, 0"/>
		<hx:PointLight3D Position="3, 0, 0" Color="Green"/>
	</hx:GroupModel3D>
	<hx:MeshGeometryModel3D Geometry="{Binding CubeMesh1}" Material="{Binding Red}" />
	<hx:GroupModel3D>
		<hx:MeshGeometryModel3D Geometry="{Binding CubeMesh2}" Material="{Binding Material1}" />
		<hx:MeshGeometryModel3D Geometry="{Binding CubeMesh3}" Material="{Binding Material2}" />
		<hx:MeshGeometryModel3D Geometry="{Binding CubeMesh4}" Material="{Binding Material3}" />
	</hx:GroupModel3D>
</hx:Viewport3DX>

Each group can be used to control the visibility or enable/disable hit test of all its child Models. Model visibility is controlled by Visibility property. Model hit test is controlled by IsHitTestVisible property. It is always a good practice to set IsHitTestVisible = false for models or groups don't need to be hit tested. This improves performance to skip unnecessary hit testing.