Xamarin 旋转摄像头拍摄的图像

Question

I'm trying to get an image in skiasharp that's left rotated by 90 degrees to be centered and fit perfectly on the canvas. I've tried 2 ways. My own custom way, and another one that seems like a popular solution but maybe I'm not understanding how it works correctly?

1. My own way.

Here is the code:

SKSurface surf = e.Surface;
SKCanvas canvas = surf.Canvas;
SKSize size = canvasView.CanvasSize;
canvas.Clear();

SKRect rect = SKRect.Create(0.0f, 0.0f, size.Height, size.Width);
canvas.RotateDegrees(85);
canvas.DrawBitmap(m_bm, rect);

"m_bm" is a bitmap that was retrieved in a separate function. That function is:

// Let user take a picture.
var result = await MediaPicker.CapturePhotoAsync(new MediaPickerOptions
{
   Title = "Take a picture"
});

// Save stream.
var stream = await result.OpenReadAsync();

// Create the bitmap.
m_bm = SKBitmap.Decode(stream);

// Set to true because the image will be prepared soon.
m_displayedImage = true;

I only put 85 instead of 90 because I wanted to visually see it getting closer but when I do that, it goes off screen. I'm coming from a game programming background so this is normally solved with getting the width of whatever we're working with (like the player in the game) and adding that to the x position, and boom. But with Xamarin, didn't work. That's my own attempt. Then I hit the internet of course to find help, and a different implementation was given to me.

2. Popular solution .

See here for this popular solution and it's the FIRST answer to this users question. The code I used is SLIGHTLY different because I didn't see the point in returning an image in that users function. Here it is:

        // Save stream.
        var stream = await result.OpenReadAsync();

        using (var bitmap = SKBitmap.Decode(stream))
        {
            var rotated = new SKBitmap(bitmap.Height, bitmap.Width);

            using (var surface = new SKCanvas(rotated))
            {
                surface.Clear();
                surface.Translate(rotated.Height, rotated.Width);
                surface.RotateDegrees(90);
                surface.DrawBitmap(bitmap, 0, 0);
            }
        }

I'm drawing the bitmap with the canvas and I thought that would work because testing it in other code samples it did exactly that, so I definitely am not rotating properly or something?

Answer 1

The link that @Cheesebaron gave me in the reply to the original post ended up working out. But a new issue arises but I'll google that myself. Here's my own code:

namespace BugApp
{


public partial class MainPage : ContentPage
{
    // Save bitmaps for later use.
    static SKBitmap m_bm;
    static SKBitmap m_editedBm;

    // Boolean for displaying the image captured with the camera.
    bool m_displayedImage;
    
    public MainPage()
    {
        // Set to explicit default values to always be in control of the assignments.
        m_bm = null;
        m_editedBm = null;

        // No picture has been taken yet.
        m_displayedImage = false;

        InitializeComponent();
    }

    // Assigned to the button in the xaml page.
    private async void SnapPicture(Object sender, System.EventArgs e)
    {
        // Let user take a picture.
        var result = await MediaPicker.CapturePhotoAsync(new MediaPickerOptions
        {
            Title = "Take a picture"
        });

        // Save stream.
        var stream = await result.OpenReadAsync();

        // Create the bitmap.
        m_bm = SKBitmap.Decode(stream);

        // Get the rotated image.
        m_editedBm = Rotate();

        // Set to true because the image will be prepared soon.
        m_displayedImage = true;
    }

    public static SKBitmap Rotate()
    {
        using (var bitmap = m_bm)
        {
            var rotated = new SKBitmap(bitmap.Height, bitmap.Width);

            using (var surface = new SKCanvas(rotated))
            {
                surface.Translate(bitmap.Width, 0);
                surface.RotateDegrees(90);
                surface.DrawBitmap(bitmap, 0, 0);
            }

            return rotated;
        }
    }

    private void OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs e)
    {
        if(m_bm != null && m_displayedImage == true)
        {
            e.Surface.Canvas.Clear();

            // Draw in a new rect space.
            e.Surface.Canvas.DrawBitmap(m_editedBm, new SKRect(0.0f, 0.0f, 300.0f, 300.0f));

            // ---Testing.
            // e.Surface.Canvas.DrawBitmap(m_editedBm, new SKRect(112, 238, 184, 310), new SKRect(0, 0, 9, 9));
            
            // Avoid having this function launch again for now.
            m_displayedImage = false;
        }
    }
}

}

The main portion of code that matters is the rotate function which was this one here: Link .

Thanks to everyone that replied.