xamarin.forms get byte array from imagesource - image

I have svg xml that i can convert to ImageSource or FileImageSource by using XamSVG library in the PCL project of my xamarin.forms.
I want to convert the ImageSource / FileImageSource to byte array (to get the bitmap).
Is this possible ?

ImageSource doesn't expose any mechanism to retrieve the original image source. Instead, you will need to manually keep a reference to the original source you use to create the image.

I've found the solution.
StreamImageSource streamImageSource = (StreamImageSource) some image source...
System.Threading.CancellationToken cancellationToken = System.Threading.CancellationToken.None;
Task<Stream> task = streamImageSource.Stream(cancellationToken);
Stream stream = task.Result;

Another solution:
public static byte[] ReadFully(Stream input)
{
using (MemoryStream ms = new MemoryStream())
{
input.CopyTo(ms);
return ms.ToArray();
}
}
Stream and MemoryStream are System.IO classes.
Then use it like this:
byte[] TargetImageByte = ReadFully(_data.Source);
_data.source is MediaFile type.

Related

Byte Image Rotation in .Net Core

I've an IFormFile image file (from postman as form data), which I convert into byte array. Before converting it into byte array, I want to rotate it into its actual position (if user input image as 90°(right). I'm implementing web api in asp.net core 2.0.
byte[] ImageBytes = Utils.ConvertFileToByteArray(model.Image);
public static byte[] ConvertFileToByteArray(IFormFile file)
{
using (var memoryStream = new MemoryStream())
{
file.CopyTo(memoryStream);
return memoryStream.ToArray();
}
}
Any help, Thanks in advance.
In my project I need to crop and resize the images users upload. And I am using a fantastic library called ImageSharp from Six Labors. You can use its image processor to do the transformation such as Resize, Crop, Skew, Rotate and more!
Install via NuGet
I am actually using their nightly build through MyGet.
Visual Studio -> Tools -> Options -> NuGet Package Manager -> Package Sources
Hit the "Plus" button to add a new package resource
I typed "ImageSharp Nightly" as the name and put "https://www.myget.org/F/sixlabors/api/v3/index.json" as the source url.
On Browse, search "SixLabors.ImageSharp" (In my case I also need "SixLabors.ImageSharp.Drawing" but in your case you might only need to core library. Always refer back to their documentations).
Crop & Resize
using SixLabors.ImageSharp;
using SixLabors.ImageSharp.Formats;
using SixLabors.ImageSharp.Processing;
using SixLabors.ImageSharp.Processing.Transforms;
using SixLabors.Primitives;
using System.IO;
namespace DL.SO.Project.Services.ImageProcessing.ImageSharp
{
public CropAndResizeResult CropAndResize(byte[] originalImage,
int offsetX, int offsetY, int croppedWidth, int croppedHeight,
int finalWidth, int finalHeight) : IImageProcessingService
{
IImageFormat format;
using (var image = Image.Load(originalImage, out format))
{
image.Mutate(x => x
// There is .Rotate() you can call for your case
.Crop(new Rectangle(offsetX, offsetY, croppedWidth, croppedHeight))
.Resize(finalWidth, finalHeight));
using (var output = new MemoryStream())
{
image.Save(output, format);
// This is just my custom class. But see you can easily
// get the processed image byte[] using the ToArray() method.
return new CropAndResizeResult
{
ImageExtension = format.Name,
CroppedImage = output.ToArray()
};
}
}
}
}
Hope this helps you - from a big fan of ImageSharp library!
Magick.NET, The ImageMagick wrapper for .Net Core can be used for many file manipulations, see https://github.com/dlemstra/Magick.NET
byte[] byt = System.IO.File.ReadAllBytes(filePath);
System.IO.MemoryStream ms = new System.IO.MemoryStream(byt);
using (Image img = Image.FromStream(ms))
{
RotateFlipType r = angle == 90 ? RotateFlipType.Rotate90FlipNone : RotateFlipType.Rotate270FlipNone;
img.RotateFlip(r);
img.Save(filePath);
}
Using your existing code you can do the following

Xamarin [RestSharp] + [Xam.Plugin.Media] upload model containing image

I'm trying to upload an image from xamarin.forms and using restsharp for api service.
RestRequest uploadPostRestRequest = new RestRequest("post/create/", Method.POST);
uploadPostRestRequest.AddJsonBody(uploadPostRequest);
and this is my model UploadPostRequest
public class UploadPostRequest
{
public string content;
public byte[] image;
}
Question - Is it right to set image type as byte[]?
Would server accept this or would restsharp manage it?
If RestSharp has a nice control with this, can I just put MediaFile from Xam.Plugin.Media so I can upload it right over?
Xam.Plugin.Media is used for picking images from mobile device.
Too many options, so, that's why I'm looking for good advice.
Has anyone experienced this same issue before? please help.
For additional info, I cant use System.IO.File, Xamarin.Forms wont let me use it.
When the Xam.Plugin.Media finish loading the media either from the Camera or from the Library it returns a MediaFile. This object can be converter to a byte array with something like this:
byte[] byteArray;
using (var memoryStream = new MemoryStream ())
{
mediaFile.GetStream ().CopyTo (memoryStream);
mediaFile.Dispose ();
byteArray = memoryStream.ToArray ();
}
Now you have the byte array you just need to pass it to the method that will upload the image to your backend.

Send an image rather than a link

I'm using the Microsoft Bot Framework with Cognitive Services to generate images from a source image that the user uploads via the bot. I'm using C#.
The Cognitive Services API returns a byte[] or a Stream representing the treated image.
How can I send that image directly to my user? All the docs and samples seem to point to me having to host the image as a publically addressable URL and send a link. I can do this but I'd rather not.
Does anyone know how to simple return the image, kind of like the Caption Bot does?
You should be able to use something like this:
var message = activity.CreateReply("");
message.Type = "message";
message.Attachments = new List<Attachment>();
var webClient = new WebClient();
byte[] imageBytes = webClient.DownloadData("https://placeholdit.imgix.net/~text?txtsize=35&txt=image-data&w=120&h=120");
string url = "data:image/png;base64," + Convert.ToBase64String(imageBytes)
message.Attachments.Add(new Attachment { ContentUrl = url, ContentType = "image/png" });
await _client.Conversations.ReplyToActivityAsync(message);
The image source of HTML image elements can be a data URI that contains the image directly rather than a URL for downloading the image. The following overloaded functions will take any valid image and encode it as a JPEG data URI string that may be provided directly to the src property of HTML elements to display the image. If you know ahead of time the format of the image returned, then you might be able to save some processing by not re-encoding the image as JPEG by just returning the image encoded as base 64 with the appropriate image data URI prefix.
public string ImageToBase64(System.IO.Stream stream)
{
// Create bitmap from stream
using (System.Drawing.Bitmap bitmap = System.Drawing.Bitmap.FromStream(stream) as System.Drawing.Bitmap)
{
// Save to memory stream as jpeg to set known format. Could also use PNG with changes to bitmap save
// and returned data prefix below
byte[] outputBytes = null;
using (System.IO.MemoryStream outputStream = new System.IO.MemoryStream())
{
bitmap.Save(outputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
outputBytes = outputStream.ToArray();
}
// Encoded image byte array and prepend proper prefix for image data. Result can be used as HTML image source directly
string output = string.Format("data:image/jpeg;base64,{0}", Convert.ToBase64String(outputBytes));
return output;
}
}
public string ImageToBase64(byte[] bytes)
{
using (System.IO.MemoryStream inputStream = new System.IO.MemoryStream())
{
inputStream.Write(bytes, 0, bytes.Length);
return ImageToBase64(inputStream);
}
}

Image caching from a HttpClient response

I am developing a WP 8.1 app, which contains a ListView. In each ListView items there are some text and a picture. The pictures come from a Http GET request, which I have to bind to the xaml. I have got a solution for it earlier, but I have some performance problem with it. The ListView can contain same picture multiple times, so the GetImage task is called multiple times for the the same picture as well. On a WiFi connection it is not a big problem, but with poor connection it is.
The other thing what I would like to implement is the image caching. I don't know where is the best place to store pictures while the app is running. I should store approximately 10-40 pieces pictures, and the image sizes are between 3 and 20 KB. Due to these images are not necessary after closing the application, I think I can store them in the memory, not in the storage folder.
So, what I want: download every images at once and store them while the app is running.
Here is the code what I use to download images:
public class WebPathToImageConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
if (value == null) return null;
return new TaskCompletionNotifier<BitmapImage>(GetImage((string)value));
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{ throw new NotImplementedException(); }
private async Task<BitmapImage> GetImage(string emailaddress)
{
ApplicationDataContainer localSettings = ApplicationData.Current.LocalSettings;
Uri uri = new Uri((string)localSettings.Values["Server"] + "Image/Downloadavatar?EmailAddress=" + emailaddress + "&Size=NORMAL");
HttpClient webCLient = new HttpClient();
IInputStream responseStream = await webCLient.GetInputStreamAsync(uri);
MemoryStream memoryStream = new MemoryStream();
Stream stream = responseStream.AsStreamForRead();
await stream.CopyToAsync(memoryStream);
memoryStream.Position = 0;
BitmapImage bitmap = new BitmapImage();
await bitmap.SetSourceAsync(memoryStream.AsRandomAccessStream());
return bitmap;
}
}
Well I asked a similar question on regards of how to work with caching data downloading and performing them in parallel.
Take a look at the answer here: Task caching when performing Tasks in parallel with WhenAll
So in short your GetImage should go in a list that holds the tasks instead of the result.

How to convert rad controls to images in silverlight

I'm using rad controls(charts and gridview) for developing an application,which i need to export the controls(each) into image.I have tried each control converting them into bytes format and send to webservice and converting them to images but sometime sending the byte data to service throws an error.Is any other way to convert each control into image.I have tried another way like.
Stream fileStream = File.OpenRead(#"\\HARAVEER-PC\TempImages\FlashPivot.png");
//PART 2 - use the stream to write the file output.
productChart.ExportToImage(fileStream, new Telerik.Windows.Media.Imaging.PngBitmapEncoder());
fileStream.Close();
It throwing me an error like cannot access to the folder TempImages.I have given sharing permissions to everyone but it doesn't access the folder.
Any solution is much appreciated.
private BitmapImage CreateChartImages()
{
Guid photoID = System.Guid.NewGuid();
string photolocation = #"D:\Temp\" + photoID.ToString() + ".jpg";
BitmapImage bi = new BitmapImage(new Uri(photolocation, UriKind.Absolute));
using (MemoryStream ms = new MemoryStream())
{
radChart.ExportToImage(ms, new PngBitmapEncoder());
bi.SetSource(ms);
}
return bi;
}

Resources