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>
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>