The Support Group Blog

How to manage and customize images in FileMaker

How To Manage and Customize Images in FileMaker

Image features are pretty common within FileMaker apps. We've had the ability to store images and other types of files in container fields for quite a while. Usually, we leverage that capability to build image modules for our clients. Having developed several of these myself, I can tell you that users generally want to be able to do at least three things:

  • Save the images in FileMaker
  • View a thumbnail of the image
  • Customize the size of the image

Of course, there are different ways to accomplish these requirements efficiently.

Oftentimes developers will build the functionality to enlarge an image into FileMaker itself. Basically, they'll create a separate layout or a popover where the container field takes up the entire screen. The problem with this technique is that FileMaker's native features don't have a lot of control or flexibility as far as how that image is displayed. Users can’t zoom, resize or rotate the image and saving it can be cumbersome. Plus, there's the overhead of creating another layout and writing the script to navigate to and from that layout within the app.

We have a simple solution that will allow users to manage and customize images in FileMaker. Hard to believe it's a script with just two script steps. The basic idea is to export the image to FileMaker’s temporary folder and then open it with the system's default image viewing program. Let’s walk through this a little. Here's what a medium-sized thumbnail looks like in one of our solutions:

How to manage and customize images in FileMaker schreenshot1

We’ve overlaid an icon on top of the container field at the bottom right. Clicking that icon will run the following script:

How to manage and customize images in FileMaker schreenshot2

The first step is to set a variable that we'll use to specify where the image will be exported and what its filename will be when it's saved. The location is set by the FileMaker function Get ( TemporaryPath ), which will return the temporary path of the FileMaker application for the workstation you're using. We use the GetContainerAttribute function to find the original name of the image that is stored and use that as the filename just to keep things consistent.

Where: Get ( TemporaryPath )

What: GetContainerAttribute ( image::file ; “fileName” )

The second step is to export the field contents of the container field to the file path you specified in the variable above.

How to manage and customize images in FileMaker schreenshot3

For the "Specify target field option," select the container field you want to export. For "Specify output file," fill in the variable you created in step one. And then here’s the piece that makes all of this work, make sure you check the “Automatically open file” checkbox before you click "OK" in the Specify Output File dialog box.

How to manage and customize images in FileMaker schreenshot4

That’s it! This script will export the image into the Temporary folder on the user's computer and open it up in the specified default image viewer.

We hope you find this tip helpful. We're full of FileMaker tips and tricks. Find more development tips, including how to move data from repeating fields.

Keep me posted 

This article is also posted on FileMakerProGurus.com.

Share this entry
1 replies
BrowseMode

Sign up to receive news and information about the FileMaker platform and other custom app development tools.

Keep me posted

Most Popular

Developer Resources

News, Tips & Tricks and Demos

Archives