Sebastien Receveur
Sebastien Receveur

Reputation: 91

Rotate a CamerePreviewImageSource

I'm trying to rotate a CameraPreviewImageSource to make it appear (only) in portrait mode:

    private async Task InitializeAsync()
    {
        this.cameraPreviewImageSource = new CameraPreviewImageSource();

        DeviceInformationCollection devices = await Windows.Devices.Enumeration.DeviceInformation.FindAllAsync(Windows.Devices.Enumeration.DeviceClass.VideoCapture);
        String backCameraId = devices.FirstOrDefault(x => x.EnclosureLocation != null && x.EnclosureLocation.Panel == Windows.Devices.Enumeration.Panel.Back).Id;
        await cameraPreviewImageSource.InitializeAsync(backCameraId);

        VideoEncodingProperties properties = await this.cameraPreviewImageSource.StartPreviewAsync();

        double width = 1280;
        double height = 720;

        this.writeableBitmap = new WriteableBitmap( (int)width, (int)height );
        this.capturePreview.Source = this.writeableBitmap;

        this.writeableBitmapRenderer = new WriteableBitmapRenderer();
        this.jpegRenderer = new JpegRenderer();

        this.cameraPreviewImageSource.PreviewFrameAvailable += OnPreviewFrameAvailable;
    }

I also tried in the XAML file, but most of the time the result is weird (like 90% of the picture is hidden):

<Image x:Name="capturePreview" Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3" Grid.RowSpan="3" Width="auto"  Height="auto" Canvas.ZIndex="0" >
    <Image.RenderTransform>
        <CompositeTransform CenterX="0.5" CenterY="0.5" Rotation="90" />
    </Image.RenderTransform>
</Image> 

Any ideas?

Upvotes: 1

Views: 453

Answers (2)

Henrik Str&#246;mberg
Henrik Str&#246;mberg

Reputation: 51

Try this switch, Width and Height, and add a RotationFilter with rotation set to 90. Also set the Device Orientation to Portrait. If you want to have support for another orientation in the rest of the application, just set Orientation in OnNavigatedTo/OnNavigatedFrom.

private async Task InitializeAsync()
{
    this.cameraPreviewImageSource = new CameraPreviewImageSource();

    DeviceInformationCollection devices = await Windows.Devices.Enumeration.DeviceInformation.FindAllAsync(Windows.Devices.Enumeration.DeviceClass.VideoCapture);
    String backCameraId = devices.FirstOrDefault(x => x.EnclosureLocation != null && x.EnclosureLocation.Panel == Windows.Devices.Enumeration.Panel.Back).Id;
    await cameraPreviewImageSource.InitializeAsync(backCameraId);

    VideoEncodingProperties properties = await this.cameraPreviewImageSource.StartPreviewAsync();

    double width = 1280;
    double height = 720;

    this.writeableBitmap = new WriteableBitmap( (int)height, (int)width );
    this.capturePreview.Source = this.writeableBitmap;
    var effect = new FilterEffect(m_cameraPreviewImageSource);
    effect.Filters = new IFilter[] { new RotationFilter(90) };

    this.writeableBitmapRenderer = new WriteableBitmapRenderer(effect);
    this.jpegRenderer = new JpegRenderer();

    this.cameraPreviewImageSource.PreviewFrameAvailable += OnPreviewFrameAvailable;
}


protected override void OnNavigatedTo(NavigationEventArgs e)
{
    m_displayOrientations = DisplayInformation.AutoRotationPreferences;
    DisplayInformation.AutoRotationPreferences = DisplayOrientations.Portrait;
    NavigationHelper.OnNavigatedTo(e);
}

protected override void OnNavigatedFrom(NavigationEventArgs e)
{
    DisplayInformation.AutoRotationPreferences = m_displayOrientations;
    NavigationHelper.OnNavigatedFrom(e);
}

Upvotes: 2

David Božjak
David Božjak

Reputation: 17617

Since you are using the Nokia Imaging SDK to achieve this, have you tried adding a RotateFilter in your rendering chain and rotate it when needed?

Your chain will then be: CameraPreviewSource -> FilterEffect [ rotateFilter] -> WriteableBitmapRenderer.

Upvotes: 0

Related Questions