Get Image source from Image after uploading

Question

I am currently following walk through on how to upload an image from a phone's photo gallery link here to allow users to upload an image to my application which they can set as their profile picture. I am able to get an image from the phone's gallery however when I try and save, I cannot retrieve the image source from the xaml .

Below is the xaml for the image and the button that the user clicks on to upload an image.

                <Button Text="Pick a Profile Image"
                        Clicked="OnPictureButton_Clicked"
                        Grid.Column="0"></Button>
                <Image Source="{Binding Employee.ProfilePicture}"
                        Grid.Column="1"
                        x:Name="profilePicture"
                        Grid.RowSpan="2"
                        WidthRequest="200"></Image>

Here is the corresponding c# code:

    private async void OnPictureButton_Clicked(object sender, EventArgs e)
    {
        (sender as Button).IsEnabled = false;

        // _stream is a private global variable
        // Allow the user to view images on the phone
        _stream = await DependencyService.Get<IPhotoPickerService>().GetImageStreamASync();

        // If they select an image, set it as the source for profilePicture
        if (_stream != null)
        {
            profilePicture.Source = ImageSource.FromStream(() => _stream);
        }

        (sender as Button).IsEnabled = true;

    }

    private async void Clicked_EmployeeSaved(object sender, EventArgs e)
    {
        var data = (EmployeeFull)BindingContext;
        var uploadedPicture = profilePicture.Source;    // Should be uploaded image

        // Testing how to get the source for the image (Can disregard for question)
        Bitmap bitmap = BitmapFactory.DecodeStream(_stream);
        MemoryStream ms = new MemoryStream();

        bitmap.Compress(Bitmap.CompressFormat.Jpeg, 100, ms);

        byte[] byteArray;

        byteArray = ms.ToArray();

    }

Now, I know that once the user selects an image from the gallery on their device, the stream closes and so I will be unable to access it later on in the code, like I have tried in the second function shown.

However, I am unable to retrieve the name of the image that I have selected to upload. On the screen, the user is able to see this image as I have set the selected image as the source for the profilePicture tag but when I try and get that source when the user clicks 'save', it shows an ImageSource` object, not a string which I expected.

Is there another way I can get the uploaded image's name?

Answer 1

If you are sure the ImageSource is a stream, you can use a cast ImageSource to StreamImageSource, and then get the stream from that.

Example:

var imageStreamSource = (StreamImageSource)profilePicture.Source;
Stream actualStream = await imageStreamSource.Stream(new CancellationToken());