Tutorial 301:

New in 16

Tutorial 301: Lesson 2

Card Style Window

Easier “Popups” with the Card Style window

Developers have long used the New Window script step to create their own alert and dialog boxes within scripts, if a simple text dialog was insufficient. However, invoking a new window means you have to manage that window: do you lock users out of other actions? Might a user close the window without completing the requested dialog? Managing exceptions takes some effort.

The new Card Style window simplifies this process. This window type is supported by the New Window script step, and it is modal to its parent window — meaning users must interact with the Card Style window before they can interact with the parent window. Unlike other modal windows, however, users can interact with other windows in the app, so the app doesn’t feel “locked.”

Card Style windows essentially show a separate layout as a pop-up, which means your “dialog” can be based on any table in your app. It no longer has to share the same context as its parent window. It also allows you to “dim” the parent window behind it, providing an aesthetic common in many contemporary app interfaces.

Why is this important?

  • In one easy step you can create windows that are automatically sized, placed appropriately on the main screen, and allow for a more controlled user experience.
  • The look of the Card Style window, with the parent window dimmed behind it, mimics other modal windows in other apps. Using this common visual language makes it clear to the user how to interact with the window. 
  • You can now use windows as dialogs in your FileMaker app for both desktop users and FileMaker Go users.

Video

Using Cards

Learn how cards work in contrast to other window styles, and create a custom layout to be used as an alert dialog presented as a card.

In this video, you will:

  • Compare Card Style to other window styles: understand when to use cards over other window styles in your script
  • Create a new layout: set up an “alert” layout 
  • Modify a script: conditionally show the Card window alert
  • Dim the parent window: use this option to make the Card stand out in front of the parent window
  • Test Cards on FileMaker Go: see how they work for mobile users

Related Resource

Create a new window using cards. Learn More >