How to Automatically Resize Images

Resizing your images is a beneficial practice that helps maintain a consistent image size and reduces the amount of storage space used in your app.

Use Case

If you have a form view where users can upload images from their smartphones, you may have noticed that some of the uploaded images are excessively large and are occupying a significant amount of storage space.

Requirements

For this scenario, you will need an Image field type in your app. You can learn more on the image field type here.

If this your first time creating an app, you'll need to know some basics about adding tables, fields, pages, and views. You can start by reading our Builder Basics section. 

Other good resources can be found in our About Your Database and Working With Pages sections of the knowledge base.

Steps

1.  Select the Table with the Image Field

In the Data section of the Builder, select the table that contains the Image field that you want to resize. If the image field doesn't already exist, create a new one.

2.  Edit the Image Field Settings

Click on the more options icon (the "..." icon) and then, click on the settings to open the field editor.

With the field settings open, check the "Resize Image" checkbox. This will allow you to select the dimensions to resize the images with either a web friendly size or a custom size.

Resize Image: If checked, this will automatically resize images on upload.

• Web friendly: Resizes the image to a web friendly size with a maximum width and height of 1500px.

• Custom: Allows you to define a custom width and height.

Thumbnails

It is also possible to create different sized thumbnails (smaller versions of an image) to be used throughout your app without needing to resize your original image. You can learn more on creating thumbnails here.