Viewport3DX Basics

Create a WPF project in Visual Studio.

Install HelixToolkit.Wpf.SharpDX through nuget.

Install following nuget packages if not being installed automatically.

HelixToolkit
SharpDX.Direct3D11
SharpDX.Mathematics
SharpDX.D3DCompiler
SharpDX.Direct2D1
SharpDX.Direct3D9
SharpDX.DXGI
Cyotek.Drawing.BitmapFont

Add Viewport3DX to XAML

1. Add HelixToolkit.Wpf.SharpDX namespace into XAML.

xmlns:hx="http://helix-toolkit.org/wpf/SharpDX"

2. Add Viewport3DX into a Grid.

<Grid>
    <hx:Viewport3DX>
    </hx:Viewport3DX>
</Grid>

3. Create a view model with EffectsManager and Camera.

EffectsManager is used to manage all graphics related resources. Usage please refer to EffectsManager-Usage.

using HelixToolkit.Wpf.SharpDX;
using System.ComponentModel; // INotifyPropertyChanged

    public class MainViewModel : INotifyPropertyChanged
    {
        public EffectsManager EffectsManager { get; }

        public Camera Camera { get; }

        public MainViewModel()
        {
            EffectsManager = new DefaultEffectsManager();
            Camera = new PerspectiveCamera();
        }

        #region INotifyPropertyChanged
        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName]string info = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(info));
        }

        protected bool Set<T>(ref T backingField, T value, [CallerMemberName]string propertyName = "")
        {
            if (object.Equals(backingField, value))
            {
                return false;
            }

            backingField = value;
            OnPropertyChanged(propertyName);
            return true;
        }
        #endregion
    }

4. Binds Viewport3DX to EffectsManager

Make sure to assign the view model to your view.

<Window.DataContext>
    <local:MainViewModel></local:MainViewModel>
</Window.DataContext>
<Grid>
    <hx:Viewport3DX EffectsManager="{Binding EffectsManager}"
                    Camera="{Binding Camera}">
    </hx:Viewport3DX>
</Grid>

If you run your project, you should see a ViewCube at the bottom right corner of the Viewport.