This question related to two properties of ImagePicker attribute. They are: AllowEditing and UseThumbnailResult.

• AllowEditing
  Description: Gets or sets a value indicating whether the image picker should allow editing.
  Default value: true
• UseThumbnailResult
  Description: Gets or sets a value indicating whether the image picker should use the thumbnail image or the full-size image for the source of the image view.
  Default value: true

When AllowEditing is enabled, the "Crop App" will run right after image selected (either by taking photo using camera or choose image from gallery). The cropped image will be processed further to create the thumbnail image. Hence, there will be no thumbnail image when AllowEditing is disabled.

The UseThumbnailResult works as follow: when enabled, the ImageData and ThumbnailImageData will use to the thumbnail result (ImageData and ThumbnailImageData will have same value, the thumbnail byte array.
In order to obtain the original size photo, simply set this property to false. The ImageData holds the original image byte array while the thumbnail byte array stored in ThumbnailImageData.

Scenario 1:

... In ImagePicker.Form I have the following:

[ImagePicker(ImageResultMode = ImageResultMode.Both, ActivateCommand = "ActivateImagePickerCommand", PickerResultCommand = "FinishImagePickerCommand", AllowEditing = false)]

This settings says that AllowEditing is disabled (no crop app means no thumbnail image) and UseThumbnailResult is enabled (by default. ImageData and ThumbnailImageData returns same result, null.).

... I see that it is "null" (screenshot scenario1). "Choose From Gallery" returns the same result.

This seems to be a bug. I need the ImageData and the ThumbnailImageData for further processing. Please, fix.

You can disable UseThumbnailResult to retrieve the byte array of the original image (ImageData). In my opinion, this is not bug. Since AllowEditing is disabled, the image doesn't processed further (to create thumbnail image).

Scenario 2:

Almost the same as above. But now I want to allow editing of the taken picture (AllowEditing = true).

... I see that ImageData and ThumbnailImageData have the same size (screenshot scenario2). "Choose From Gallery" returns the same result.

This seems to be a bug. I need the original sized photo in ImageData not the ThumbnailImageData. Please, fix.

This settings says: AllowEditing and UseThumbnailResult are both enabled. Selected image will be processed further to create the thumbnail image. However, ImageData and ThumbnailImageData have same result because UseThumbnailResult is enabled.

For me it is not a bug. Please disable UseThumbnailResult to get the original sized photo in ImageData and get the smaller size image in ThumbnailImageData.

Please feel free to let us know if you have different thoughts.

Hello Yudi,

Thank you for the explanation. It works as you described it.

Thomas

Hello Yudi,

Sorry, I closed this issue to early. This is still open.

Additional questions:

- How can I translate the context menu of the ImagePicker (Select Image, Take Photo, Choose From Gallery, Delete Photo)

- How can I translate the text below the ImagePicker image (edit, add photo)?

Thanks,

Thomas

Thank you for the explanation. It works as you described it.

Glad to hear that the explanation helps.

By the way, calling the "Crop App" mostly fails with "Image could not be loaded" error message. Please, fix, too.

With AllowEditing enabled, calling the "Crop App" from ImagePicker doesn't causing error in my local end. For your information, Crosslight 5.0.5000.626-experimental was used in my test.

Please feel free to let me know if you find anything that I might miss during my attempt in order to reproduce the reported problem.

Sorry, I closed this issue to early. This is still open.

No problem, Thomas. We can keep this thread active until all your questions responded.

- How can I translate the context menu of the ImagePicker (Select Image, Take Photo, Choose From Gallery, Delete Photo)

- How can I translate the text below the ImagePicker image (edit, add photo)?

I will need to discuss this with Crosslight development team. I will get back to you as soon as possible.

Hello Yudi,

did you already discuss with the team how to do the translations?

Thanks,

Thomas

Sorry for the delay in sending this.

How can I translate the context menu of the ImagePicker (Select Image, Take Photo, Choose From Gallery, Delete Photo)

The context menu of the ImagePicker are localizable. Set the resource with following name:

• SelectImage
• TakePhoto
• ChooseFromGallery
• DeleteImage

For example:

<resources>
  <string name="SelectImage">Sélectionner l\'image</string>
  <string name="TakePhoto">Prendre une photo</string>
  <string name="ChooseFromGallery">Choisir parmi la galerie</string>
  <string name="DeleteImage">Supprimer la photo</string>
</resources>

will result like following.

Hope this helps.

Hello Yudi,

the localization of the menu works on Android as you described. Thank you.

How can I translate the text below the image? In your screenshot from the last post it is "edit". In other cases it can be "add photo".

I am doing the app on iOS, too. How can I translate the menu and the text below the image on iOS?

Can I do it via standard iOS localization (https://developer.xamarin.com/guides/ios/advanced_topics/localization_and_internationalization/) with the same keys as on Android?

Thanks,

Thomas

How can I translate the text below the image? In your screenshot from the last post it is "edit". In other cases it can be "add photo".

AddCaption and EditCaption properties of ImageAttribute class are the one that you looking for.

• AddCaption: Gets or sets the caption displayed when the image is not set yet.
• EditCaption: Gets or sets the caption displayed when the image is set.

Example:

public class BasicSection
{
    [Editor(EditorType.Image)]
	[Image(Height = 83, Width = 80, Placeholder = "photo.png", Frame = "frame.png", AddCaption = "Foto hinzufügen", EditCaption = "Foto bearbeiten")]
	[ImagePicker(ImageResultMode = ImageResultMode.Both, ActivateCommand = "ActivateImagePickerCommand", PickerResultCommand = "FinishImagePickerCommand", AllowEditing = false)]
    public byte[] ProfilePicture;

    ...
}

You can also utilize AddCaptionKey and/or EditCaptionKey if the text is taken from resources.

Hello Yudi,

AddCaption and EditCaption works on Android and iOS.

However under iOS I was not able to translate the imagepicker context menu. I tried with standard iOS localization (.lproj folder and Localizable.strings) and used the keys given above but it failed.

Please, provide a localization sample for the imagepicker context menu under iOS.

Thanks,

Thomas

Any updates about how to translate under iOS?

Unfortunately it hasn't been supported for iOS platform.

CROS-1141 has been submitted to Crosslight development team regarding this, to localize ImagePicker context menu under iOS platform. I will keep this thread updated when nightly-build/hotfix is ready to be evaluated.

What about CROS-1141? When will the translation finally be available?