The issue is that the ApplyTemplate method is not called in the order you are expecting. This appears to be a known issue and there is a work-around. If you manually call ApplyTemplate() in the Loaded event of your control, the template should be applied and the video should play. I applied this work-around to your code along with a few other minor-tweaks and it worked correctly for me.
Also, as another suggestion, I would strongly suggest that you convert setSource to a dependency property. You can read more about dependency properties here.
customControl.cs
public class customControl:Control
{
private MediaElement _vidStage;
public customControl()
{
this.DefaultStyleKey = typeof(customControl);
this.Loaded += new RoutedEventHandler(customControl_Loaded);
}
void customControl_Loaded(object sender, RoutedEventArgs e)
{
this.ApplyTemplate();
}
public override void OnApplyTemplate()
{
_vidStage = base.GetTemplateChild("vidStage") as MediaElement;
}
...
public Uri Source
{
get
{
return _vidStage.Source;
}
set
{
if (_vidStage != null)
{
_vidStage.Source = value;
//_vidStage.Play();
// For some reason, the video wouldn't play using Play()
// I set the AutoPlay to true and it worked.
_vidStage.AutoPlay = true;
}
}
}
...
Page.xaml.cs
public partial class Page : UserControl
{
public Page()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(Page_Loaded); // Setting the source after loading...
}
void Page_Loaded(object sender, RoutedEventArgs e)
{
// Please note the added forward-slash and I have set the Build Action to "Content" for the hippo.wmv file.
g.Source = new Uri("/hippo.wmv", UriKind.Relative);
}
...
I hope this helps!