MediaElement not showing in custom 3D class

Question

I'm trying to display a videostream in a Viewport3d. When I add the MediaElement via xaml, the video plays without a problem; even when I add the video as ModelVisual3D in the code-behind, the video works. When I abstract the video into a class, however, the video stops appearing. This happens with both web and local video files. I tried compiling with both x86 and 64 bit. Any way to fix this behaviour? Why is this happening?

I have the following viewport:

<Viewport3D>
    <!-- Camera -->
    <Viewport3D.Camera>
        <PerspectiveCamera Position="0,0,100" LookDirection="0,0,-1" UpDirection="0,1,0" />
    </Viewport3D.Camera>

    <!-- Light -->
    <ModelVisual3D>
        <ModelVisual3D.Content>
            <AmbientLight Color="White" />
        </ModelVisual3D.Content>
    </ModelVisual3D>

    <!-- this doesn't work -->
    <mediaElementTest:VideoControl />

    <!-- but this does? -->
    <!--<ModelVisual3D>
        <ModelVisual3D.Content>
            <GeometryModel3D>

                <GeometryModel3D.Geometry>
                    <MeshGeometry3D 
                        Positions="-100,-100,0 100,-100,0 100,100,0 -100,100,0"
                        TextureCoordinates="0,1 1,1 1,0 0,0"
                        TriangleIndices="0 1 2   0 2 3"
                        />
                </GeometryModel3D.Geometry>

                <GeometryModel3D.Material>
                    <DiffuseMaterial>
                        <DiffuseMaterial.Brush>
                            <VisualBrush>
                                <VisualBrush.Visual>
                                    <MediaElement Source="http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" />
                                </VisualBrush.Visual>
                            </VisualBrush>
                        </DiffuseMaterial.Brush>
                    </DiffuseMaterial>
                </GeometryModel3D.Material>
            </GeometryModel3D>
        </ModelVisual3D.Content>
    </ModelVisual3D>-->
</Viewport3D>

VideoControl.xaml

<UIElement3D x:Class="MediaElementTest.VideoControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"/>

VideoControl.xaml.cs

public partial class VideoControl
{
    public VideoControl()
    {
        InitializeComponent();
        Visual3DModel = CreateModel();
    }

    private GeometryModel3D CreateModel()
    {
        return new GeometryModel3D
        {
            Geometry = new MeshGeometry3D
            {
                Positions = new Point3DCollection
                {
                    new Point3D(-100, -100, 0),
                    new Point3D(100, -100, 0),
                    new Point3D(100, 100, 0),
                    new Point3D(-100, 100, 0)
                },

                TextureCoordinates = new PointCollection
                {
                    new Point(0, 1),
                    new Point(1, 1),
                    new Point(1, 0),
                    new Point(0, 0)
                },

                TriangleIndices = new Int32Collection
                {
                    0, 1, 2,
                    0, 2, 3
                }
            },
            Material = new DiffuseMaterial(new VisualBrush(new MediaElement
            {
                Source = new Uri("http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4", UriKind.RelativeOrAbsolute)
            }))
        };
    }
}

Answer 1

Answered here: MediaElement not showing in custom 3D class

For your issue, I think the root cause is the method of creating VideoControl, we need to create a base class for 3D primitives that inherits from UIElement3D and create a MediaElement implementation that will serve as a demonstration, here is my sample:

ReusableUIElement3D.cs:

public abstract class ReusableUIElement3D : UIElement3D
{
    public static readonly DependencyProperty ModelProperty = DependencyProperty.Register("Model", typeof (Model3D),
        typeof (ReusableUIElement3D), new PropertyMetadata(ModelPropertyChanged));

    public Model3D Model
    {
        get
        {
            return (Model3D)GetValue(ModelProperty);
        }
        set
        {
            SetValue(ModelProperty, value);
        }
    }

    protected override void OnUpdateModel()
    {
        this.Model = this.CreateElementModel();
    }

    protected virtual Model3D CreateElementModel()
    {
        return null;
    }

    protected static void VisualPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        ReusableUIElement3D reusableElement = (ReusableUIElement3D)d;
        reusableElement.InvalidateModel();
    }

    protected static void ModelPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        ReusableUIElement3D reusableElement = (ReusableUIElement3D)d;
        reusableElement.Visual3DModel = reusableElement.Model;
    }
}

VideoControl.cs

public class VideoControl : ReusableUIElement3D
{
    protected override Model3D CreateElementModel()
    {
        Model3DGroup cubeModel = new Model3DGroup();
        cubeModel.Children.Add(CreateModel());
        return cubeModel;
    }

    private GeometryModel3D CreateModel()
    {
        return new GeometryModel3D
        {
            Geometry = new MeshGeometry3D
            {
                Positions = new Point3DCollection
            {
                new Point3D(-100, -100, 0),
                new Point3D(100, -100, 0),
                new Point3D(100, 100, 0),
                new Point3D(-100, 100, 0)
            },

                TextureCoordinates = new PointCollection
            {
                new Point(0, 1),
                new Point(1, 1),
                new Point(1, 0),
                new Point(0, 0)
            },

                TriangleIndices = new Int32Collection
            {
                0, 1, 2,
                0, 2, 3
            }
            },
            Material = new DiffuseMaterial(new VisualBrush(new MediaElement
            {
                Source = new Uri("http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4", UriKind.RelativeOrAbsolute),
            }))
        };
    }
}

To use VideoControl class, like this:

<Viewport3D>
    <!-- Camera -->
    <Viewport3D.Camera>
        <PerspectiveCamera Position="0,0,100" LookDirection="0,0,-1" UpDirection="0,1,0" />
    </Viewport3D.Camera>

    <!-- Light -->
    <ModelVisual3D>
        <ModelVisual3D.Content>
            <AmbientLight Color="White" />
        </ModelVisual3D.Content>
    </ModelVisual3D>

    <ModelVisual3D x:Name="UIElement3DContainer">
        <mediaElementTest:VideoControl />
    </ModelVisual3D>
</Viewport3D>