Xamarin Forms:在 IOS 中达到 UI 时,相机图片向左旋转

Xamarin Forms: Camera picture is left rotated when comes to UI in IOS

IOS 相机拍摄的照片在 UI 中显示时向左旋转。

我已经遇到过此类问题并已通过 解决。但在这种情况下,我只将 image path 保存到列表中。

相机代码:

public async void OpenMyCamera()
        {
            try
            {
                List<string> images = new List<string>();
                await CrossMedia.Current.Initialize();

                if (!CrossMedia.Current.IsCameraAvailable || !CrossMedia.Current.IsTakePhotoSupported)
                {
                    await DisplayAlert("Alert", "No camera available.", "Ok");
                    return;
                }

                _mediaFile = await CrossMedia.Current.TakePhotoAsync(new Plugin.Media.Abstractions.StoreCameraMediaOptions
                {
                    Directory = "Sample",
                    Name = "test.jpg",
                    AllowCropping = true
                });

                if (_mediaFile == null)
                    return;

                //Saving only the path to list.
                images.Add(_mediaFile.Path);

                MessagingCenter.Send<App, List<string>>((App)Xamarin.Forms.Application.Current, "ImagesSelected", images);

            }
            catch (Exception ex)
            {
                System.Diagnostics.Debug.WriteLine("Exception:>" + ex);
            }
        }

我正在使用 FlowListView 使用以下代码显示图片。

MessagingCenter.Subscribe<App, List<string>>((App)Xamarin.Forms.Application.Current, "ImagesSelected", (s, images) =>
                {
                    for (int i = 0; i < images.Count; i++)
                    {
                        _images.Add(images[i]);
                        _images = new ObservableCollection<string>(_images.Distinct());
                        listItems.FlowItemsSource = _images;
                    }
                });
            }

这个问题的解决方案是什么?

解法:

更新:

此问题已解决 here

而且 MediaPlugin 上还有 discussions GitHub

当您将AllowCropping设置为true时,这似乎是一个已知问题,检查图像的exif数据您会发现编辑后的图像已旋转90度。如果您还没有使用过图像的 metadata,请尝试关闭它以修复它:

var _mediaFile = await Plugin.Media.CrossMedia.Current.TakePhotoAsync(new Plugin.Media.Abstractions.StoreCameraMediaOptions
{
    Directory = "Sample",
    Name = "test.jpg",
    AllowCropping = true,
    SaveMetaData = false
});

以前的答案

假设您在拍照后得到 MediaFile

MediaFile file = await CrossMedia.Current.TakePhotoAsync(new Plugin.Media.Abstractions.StoreCameraMediaOptions
            {
                Directory = "Sample",
                Name = "test.jpg"
            });

然后将MediaFile转成imageSource:

使用GetStreamWithImageRotatedForExternalStorage将帮助您解决问题 图像在 iOS.

中拍照后旋转
ImageSource source = ImageSource.FromStream(() =>
            {
                return file.GetStreamWithImageRotatedForExternalStorage();
            });

然后将此 source 添加到您的 imageSource 列表中:

imageSourceList.Add(source);

假设有一个模型有一个 属性 来源:

public class myModel
    {
        public ImageSource source { get; set; }
    }

最后,您可以创建myModel的列表,将images设置为FlowItemsSource,举个例子(假设有3张照片):

 var images = new List<myModel>();
 var a = new myModel {source = imageSourceList(0) };
 var b = new myModel {source = imageSourceList(1) };
 var c = new myModel {source = imageSourceList(2) };

 images.Add(a);
 images.Add(b);
 images.Add(c);

 myList.FlowItemsSource = images;

在xaml中绑定soucre:

<flv:FlowListView FlowColumnCount="3" SeparatorVisibility="None" HasUnevenRows="false" x:Name="myList">

    <flv:FlowListView.FlowColumnTemplate>
        <DataTemplate>
            <Image Source="{Binding source}" />
        </DataTemplate>
    </flv:FlowListView.FlowColumnTemplate>

</flv:FlowListView>