CODEWITHSUNDEEP
xamarinxamarin.forms
Elly
Elly

Reputation: 11

How to save the final photo in Forms.Image to local in xamarin forms

I'm making an app for android with Xamarin forms where the user would select a photo from their library, add a White border to make it a square, then save it. I'm stuck at the saving part, can't figure it out

I am using the normal Xamarin.Forms.Image control

 <Image HorizontalOptions="CenterAndExpand" 
                         VerticalOptions="Center" 
                         BackgroundColor="Transparent"
                         Grid.Column="0" 
                         Grid.Row="0"
                         x:Name="imgViewer"/>

this is how I select the photo 


 async void tbAdd_Activated(object sender, System.EventArgs e)
 {
     var file = await CrossFilePicker.Current.PickFile();
     if (file != null)
     {
         imgViewer.Source = ImageSource.FromFile(file.FilePath);
         imgViewer.BackgroundColor = Color.White;
     }
  }

But then I have a save button to save that final image with the border to the camera roll but I have no idea how to save it, I've searched everywhere but can't seem to find!

Anyone knows how to do that ?

Upvotes: 1

Views: 951

Answers (2)

AbbyWang - MSFT
AbbyWang - MSFT

Reputation: 650

You can save the image by the following code:

void save_Activated(object sender, System.EventArgs e)
{
    if (file != null)
    {
        byte[] imageBytes;
        var FileImage = new Image();

        string base64;
        using (var fs = new FileStream(file.FilePath, FileMode.Open, FileAccess.Read))
        {
            var buffer = new byte[fs.Length];
            fs.Read(buffer, 0, (int)fs.Length);
            base64 = Convert.ToBase64String(buffer);
        }

        imageBytes = Convert.FromBase64String(base64); 

        File.WriteAllBytes(filename, imageBytes);

    }

So the full code is like this:

    string documentsFolder;
    string filename;
    FileData file;
    ImageSource imageSource;

    public MainPage()
    {
        InitializeComponent();
        documentsFolder = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
        filename = Path.Combine(documentsFolder, "myfile.jpg");
    }

    async void tbAdd_Activated(object sender, System.EventArgs e)
    {
        file = await CrossFilePicker.Current.PickFile();
        if (file != null)
        {
            imgViewer.Source = ImageSource.FromFile(file.FilePath);
            imgViewer.BackgroundColor = Color.White;
            imageSource = imgViewer.Source;
        }
    }

    void save_Activated(object sender, System.EventArgs e)
    {
        if (file != null)
        {
            byte[] imageBytes;
            var FileImage = new Image();

            string base64;
            using (var fs = new FileStream(file.FilePath, FileMode.Open, FileAccess.Read))
            {
                var buffer = new byte[fs.Length];
                fs.Read(buffer, 0, (int)fs.Length);
                base64 = Convert.ToBase64String(buffer);
            }

            imageBytes = Convert.FromBase64String(base64); 

            File.WriteAllBytes(filename, imageBytes);

        }
    }

And the xamal is:

<Button Text="AddImage" Clicked="tbAdd_Activated">
</Button>
<Button Text="SaveImage" Clicked="save_Activated">
</Button>
<Image HorizontalOptions="CenterAndExpand" 
                 VerticalOptions="Center" 
                 BackgroundColor="Transparent"
                 Grid.Column="0" 
                 Grid.Row="0"
                 x:Name="imgViewer"/>

Upvotes: 0

Pooja Kamath
Pooja Kamath

Reputation: 1298

You will have to specific codes in iOS and android to save the images and Also add required permissions in iOS by adding this key to info.Plist file

<key>NSPhotoLibraryAddUsageDescription</key>
<string>$(PRODUCT_NAME)</string>

Android : 

MediaStore.Images.Media.InsertImage(Application.Context.ContentResolver, [YourFileName],
System.IO.Path.GetFileName([YourFileName]), string.Empty);

iOS : 

var imageSource = CGImageSource.FromUrl(NSUrl.FromFilename( [YourFileName]));
UIImage.FromImage(imageSource.CreateImage(0, null), 1, imageOrientation)
.SaveToPhotosAlbum((image, error) => { // handle success & error here... });

You can check this link for more info.

Upvotes: 2

Related Questions