Take, select and save photos to device

using actions

The following tutorial will show you how to use the "Take a Photo" and "Save Image to Device" actions. You could also use the Camera Block 

Install the Tutorial App: Save Photo

1. Select or take a Photo : Take a Photo Action

To take a photo we use the action "Take a Photo".

The "Take a Photo" action will make the device prompt a user to either take a picture or select a photo from the device's gallery.

In this Action we define a key/variable in the field "Selected Photo Key" to store the photo that the user selects or captures. That variable saves the path to the photo file on your device so we can grab it later.


2. Display a photo

In order to do display a photo we need an Image Block

That Image Block needs to point to the file which contains the photo we just selected.

If we want to upload a photo to a REST service (like Cloud Collection) we must use a Block, not a file as a parameter. For that reason, we save that Block as a Custom Block.

In the 'Configuration' tab of the Image Block, name the block to turn it into a custom block.

In this example we named the block : Captured Image.

Then click on "Image Source" to bring up the dialog to select an image.


In the Image Source, Select 'Data Source' as an Image Source.


When in Data Source, select "Expression" and then the pencil to bring up a screen (shown below) where we can access the key/variable we just created in the Tap Action "Select a Photo"

3. Select Photo Done EVENT

In the view that has the Action "Take a Photo" we go to Edit View -> Events. 

There we see the Actions "Select Photo Done" and "Select Photo Cancel". Here put an Action "Switch to Another View" and we switch to a view we  created using the custom image block. We can also put a pop-up alert that tells the user that that taking the photo was a success.

5. Save Image to Device : Save Image to Device Action

We then go to the Custom Image Bock we created and go to the Events tab and add a tap Action "Save Image to Device".

In the From Block field, we point to the Custom Image block that contains our key/variable (this is the same block for which we are defining the tap Action).


6. App Level Event

We then go to Edit App/Events and there we can add an Action to "Image Save Success" and "Image Save Failure" events. Here we put the Action "Show Alert Popup" so we can test and also alert the user that the action succeeded or failed. We can also stack any other action we may need here.


Learn More

    - Tutorial App: Save Photo into Cloud Collection