Video recorder app in Windows Phone 8.1

Question

I am going to write a Video Recorder app in Windows Phone 8.1 (RT).

I used the example provided in Windows Reference.

 public sealed partial class CamcorderMainPage : Page
    {
        StatusBar StatusBarObject = Windows.UI.ViewManagement.StatusBar.GetForCurrentView();
        string StatusBarHeader = "Firefly Moments";
        MediaCaptureInitializationSettings _captureInitSettings;
        List<Windows.Devices.Enumeration.DeviceInformation> _deviceList;
        Windows.Media.MediaProperties.MediaEncodingProfile _profile;
        Windows.Media.Capture.MediaCapture _mediaCapture;
        bool _recording = false;
        bool _previewing = false;
        string NoCameraError = "No camera device is found ";

        public CamcorderMainPage()
        {
            this.InitializeComponent();
            this.Loaded += CamcorderMainPage_Loaded;
        }

        void CamcorderMainPage_Loaded(object sender, RoutedEventArgs e)
        {
            //throw new NotImplementedException();
            EnumerateCameras();
        }


        private async void EnumerateCameras()
        {
            var devices = await Windows.Devices.Enumeration.DeviceInformation.FindAllAsync(
                Windows.Devices.Enumeration.DeviceClass.VideoCapture);

            _deviceList = new List<Windows.Devices.Enumeration.DeviceInformation>();

            // Add the devices to deviceList
            if (devices.Count > 0)
            {

                for (var i = 0; i < devices.Count; i++)
                {
                    _deviceList.Add(devices[i]);
                }

                InitCaptureSettings();
                InitMediaCapture();
               // rootPage.NotifyUser("Initialization complete.", NotifyType.StatusMessage);

            }
            else
            {
                StatusBarObject.ProgressIndicator.Text = NoCameraError;
                //rootPage.NotifyUser("No camera device is found ", NotifyType.ErrorMessage);
            }
        }


        private void InitCaptureSettings()
        {
            _captureInitSettings = null;
            _captureInitSettings = new Windows.Media.Capture.MediaCaptureInitializationSettings();
            _captureInitSettings.AudioDeviceId = "";
            _captureInitSettings.VideoDeviceId = "";
            _captureInitSettings.StreamingCaptureMode = Windows.Media.Capture.StreamingCaptureMode.AudioAndVideo;
            _captureInitSettings.PhotoCaptureSource = Windows.Media.Capture.PhotoCaptureSource.VideoPreview;

            if (_deviceList.Count > 0)
                _captureInitSettings.VideoDeviceId = _deviceList[0].Id;
        }

        // Create a profile.
        private void CreateProfile()
        {
            _profile = Windows.Media.MediaProperties.MediaEncodingProfile.CreateMp4(
            Windows.Media.MediaProperties.VideoEncodingQuality.Qvga);
        }

        // Create and initialze the MediaCapture object.
        public async void InitMediaCapture()
        {
            _mediaCapture = null;
            _mediaCapture = new Windows.Media.Capture.MediaCapture();

            // Set the MediaCapture to a variable in App.xaml.cs to handle suspension.
            (App.Current as App).MediaCapture = _mediaCapture;

            await _mediaCapture.InitializeAsync(_captureInitSettings);

            CreateProfile();
        }

        // Start the video capture.
        private async void StartMediaCaptureSession()
        {
            var storageFile = await Windows.Storage.KnownFolders.VideosLibrary.CreateFileAsync(
                "cameraCapture.mp4", Windows.Storage.CreationCollisionOption.GenerateUniqueName);

            await _mediaCapture.StartRecordToStorageFileAsync(_profile, storageFile);
            _recording = true;
        }

        // Stop the video capture.
        private async void StopMediaCaptureSession()
        {
            await _mediaCapture.StopRecordAsync();
            _recording = false;
            (App.Current as App).IsRecording = false;
        }


        private async void ShowFireFlyStatusBar()
        {
            //this will show the Status Bar  


            Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().SetDesiredBoundsMode(ApplicationViewBoundsMode.UseVisible);
            StatusBarObject.ProgressIndicator.Text = StatusBarHeader;
            StatusBarObject.ProgressIndicator.ProgressValue = 0;

            StatusBarObject.ForegroundColor = Colors.MintCream;
            StatusBarObject.BackgroundColor = Color.FromArgb(255, 166, 62, 59);
            StatusBarObject.BackgroundOpacity = .6;
            await StatusBarObject.ProgressIndicator.ShowAsync();


        }  

        /// <summary>
        /// Invoked when this page is about to be displayed in a Frame.
        /// </summary>
        /// <param name="e">Event data that describes how this page was reached.
        /// This parameter is typically used to configure the page.</param>
        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            ShowFireFlyStatusBar();
        }

        private void Camcorder_StartCapture_Click(object sender, RoutedEventArgs e)
        {
            StartMediaCaptureSession();
        }

        private void Camcorder_StopCapture_Click(object sender, RoutedEventArgs e)
        {
            StopMediaCaptureSession();
        }
    }

Its working fine as I am getting the video file from Photos App .

Now how to enable live preview while recording in app? Which control to use for it?

Answer 1

You're looking for the CaptureElement. Once you add it to your XAML, connect it to your MediaCapture object and start preview like so:

PreviewControl.Source = _mediaCapture;
await _mediaCapture.StartPreviewAsync();

Have a look at the UniversalCameraSample posted on the Microsoft github page for more information. It targets Windows 10, but most of the patterns should work on 8/8.1 as well.