# Image Handling

The use of images as a visual representation of information is crucial in many software applications. Our SDK provides the tools and functionality needed to easily handle images. In this section, we will introduce you to image handling in social.plus, including how to upload and retrieve images in the SDK.

{% hint style="info" %}
Note: The maximum image file size limits are up to 1 GB per post.
{% endhint %}

## Image Data

| Property     | Description                                                                                                                                               |
| ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `fileId`     | Identifier for the uploaded file                                                                                                                          |
| `fileUrl`    | The HTTP web URL for the uploaded file. You can use this `fileUrl` for downloading the image file.                                                        |
| `attributes` | <p>Contains a dictionary with values for <code>name</code>, <code>extension</code>, <code>size</code> & <code>mimeType</code></p><p>of uploaded image</p> |
| `metadata`   | Contains additional metadata dictionary related to uploaded image such as `height`, `width`, `isFullImage` etc.                                           |
| altText      | Contains descriptive text which conveys the meaning and context of an image                                                                               |

## Upload Images

To upload an image to the system, you can use the social.plus Image Upload API provided by the SDK. The API allows you to upload an image to the social.plus server/ The SDK simplifies the process of uploading images by providing pre-built components that you can easily integrate into your application. Additionally, you can add alt text to your images to support accessibility, ensuring that your application is more inclusive for all users.

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/e86988dc5f7ff34aacd55ba9eddc5920>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/amythee/24cc8b78b5e4269f1f29263b6bb9695a>" %}
{% endtab %}

{% tab title="JavaScript" %}
Supported ✅ (please wait while we prepare a real example!)
{% endtab %}

{% tab title="TypeScript" %}
{% embed url="<https://gist.github.com/amythee/0dbd455fc9463de7e8fc56fe485ed4cd#file-createimage-ts>" %}
{% endtab %}

{% tab title="Flutter" %}
{% embed url="<https://gist.github.com/amythee/67d7af32b29baec7988facddc18eec9a>" %}
{% endtab %}
{% endtabs %}

{% hint style="info" %}
Supported image formats are JPG, PNG and cannot exceed 1GB in size.
{% endhint %}

## Retrieve Images

You can retrieve an image from social.plus using the social.plus Image Retrieval API provided by the SDK. The API enables you to retrieve an image from the social.plus server by supplying the image URL. Once an image is uploaded to the server, the image will be automatically transformed into four different sizes for versatile usage. We provided an option to retrieve a specific image size which are:

* **Small**: is used for image thumbnails, with a maximum image size of 160 pixels per dimension. For example, this should be used for small previews in an image gallery that displays a large number of images in a grid.
* **Medium**: is used for standard image display, with a maximum image size of 600 pixels per dimension.
* **Large**: is used for full-screen image display, with a maximum image size of 1500 pixels per dimension.

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/255a6a0688fdff88b3e7118b3591429c>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/fb14de91d40ec2660c9467f943e9e142>" %}
{% endtab %}

{% tab title="JavaScript" %}
Supported ✅ (please wait while we prepare a real example!)
{% endtab %}

{% tab title="TypeScript" %}
{% embed url="<https://gist.github.com/amythee/0353bcbb51a521501e5927587f5cb70e>" %}
{% endtab %}

{% tab title="Flutter" %}
Supported ✅ (please wait while we prepare a real example!)
{% endtab %}
{% endtabs %}

## Update Images Alt text

To enhance accessibility of your images, you can modify the alt text using the Update Image API. This value can be served to screen readers to provide meaningful descriptions of your images to visually impaired users.

Here's how to update an image's alt text:

{% tabs %}
{% tab title="iOS" %}
{% embed url="<https://gist.github.com/amythee/eb11e733e6f19c2775320c8b334a98e7>" %}
{% endtab %}

{% tab title="Android" %}
{% embed url="<https://gist.github.com/amythee/70a0eab1ca028a6982c77297ded75873>" %}
{% endtab %}

{% tab title="TS" %}
{% embed url="<https://gist.github.com/amythee/726b58103cec982e26323d62f3126cf3>" %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.social.plus/social-plus-sdk/core-concepts/files-images-and-videos/image-handling.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.