Level: Intermediate, Version: FM 12 or later

Graph Management + Conditional Icons

Recently I received a dual-technique FileMaker 12 demo from Eden Morris. Here’s what he had to say about technique #1:

In the Relationships Graph I show the use of colored labels to indicate where record creation, cascade deletes, and sorted relationships are enabled. Looking at the graph it easily shows that I can create customers from a company table but that they don’t cascade delete, you can create invoices and invoice lines from a project and the invoices and their lines cascade delete, and that the invoice lines are sorted.

1-27-2013 11-50-00 PM

It’s an elegant way to display this info (but for some reason, it makes me crave jelly beans).

Now on to the public-facing portion of the demo and technique #2. I imagine most FileMaker developers would use an unstored calculated container field to achieve this two-state icon effect…

1-31-2013 11-39-47 PM

…but that’s not what’s going on here. If we pop into layout mode, it appears that a couple of overlaid images have had a bit of conditional formatting judiciously applied to make one or both of them disappear (by “filling” them with no fill), like so:

1-28-2013 12-24-39 AM

But if you’ve ever tried to apply conditional formatting to an image, you know that some sort of trickery is at work here, because you can’t apply conditional formatting directly to images. The trick turns to to be to create a text block containing nothing but a space, and then to set the background fill of the text block as an image:


…and now you can apply conditional formatting as you see fit. This is a great example of lateral thinking, and refusing to take “no” for an answer. I said it last year when I reviewed Eden’s SQL Builder, and I’m going to say it again now: “Very nicely done Mr. Morris.”

14 thoughts on “Graph Management + Conditional Icons”

  1. This is yet an amazing technique from your site Kevin! This use of pictures can make our layouts speak to the users brain quicker, as colors and pictures are more quickly distinguished than letters or words.

    Be consistent and clear as you use colors! Thanks again.

  2. Thanks to Eden for the information and to you Kevin for publishing. I’ve been using this technique for portal highlighting. I hadn’t thought about using it for icon visibility.

    I’d like to be able to do something like this for the hover state for buttons. Say that I have a black icon when the button is in normal state, I’d like to use a white icon for the hover state and I don’t think it can be done if the graphic is in a field.

    I can use a graphic as a background for the button but I only want part of the button to have the icon and use FileMaker’s design surface to style the button.

  3. I love the color coding idea for the relationship graph functionality but I think it might just be simpler to use the color schema for the table occurrences themselves. Even if you were using different colors to identify specific tables, you could reserve the coding colors and still intersperse the normal coloring system with coded TOs.

    The Conditional formatting for graphics is brilliant.

  4. Love the idea for the relationship graph and hope it is one of those ideas that FileMaker Inc. may consider in a future release. I have to say that I stopped reading the post as soon as it mentioned an overlapping layout object feature. I have a damaged goods mindset with that technique when trying to troubleshoot systems that overused the technique in the past.

  5. I like the conditionally formatted icon trick. It is an interesting way to solve this technique. But, apart from the saving of a container field and it’s related calc, are there other benefits to this technique?
    It seems like you are still needing to fire off the calculation engine (the CF calc). Data transfer would seem to be the same (you need to move both icons…yes, admittedly rather small). Or…would it be less transfer, because if you put the icons directly on the layout, does FM ‘know’ they are the same and just repeat them internally after transferring it once? Or does it still have to transfer each one? (I am thinking of a hosted solution.) I would guess that using a container it would transfer each one; it probably doesn’t know/track what the contents of a container are.
    These are all rather nit-picky questions about a rather tiny amount of data. The calculation (which still has to fire in either setup) is probably the more time consuming function.

    — J

    1. I view it as another tool for the tool kit, which could come in handy at some point. For instance, if you use the Separation Model.

    2. For container fields, FileMaker knows that the it stores the exact same file (for the same container field of course). You can test it with the remote storage. If you have a container field in a record, and duplicate the record, the file will not be duplicated.

  6. The conditional formatting idea is beautiful in its simplicity – well done the developer! I have just the system where this will work very well.

  7. Thanks, for sharing this. As far as the Graph is concerned, filemakerstandards.com actually has a similar approach to Eden Morris for “labeling” the Graph. I think it would be very helpful to have Eden Morris come into the discussion of setting the standards and best practices in professional database development using FM.

    As far as the conditional formatting for icons, I also use this technique for visual confirmations in my solutions, and point to Matt Petrowsky’s recent video on doing this using a text block with a “background” image, though I’ve done it with fields and set the font size to be like 500pts.

    Thanks for all of the great stuff you publish to other FM dev’s, like me I appreciate it very much.

    – – Scott

  8. Hmm. This technique seems to work with the merge field, <>. Not sure if there is an advantage for one over the other.

    1. One could also use the button tool to create a “do nothing” button, set the background image, apply the custom formatting, then via the Inspector remove the style, set the fill to clear, and the line width to none.

  9. These days I don’t see any point in working image icons anymore. Just use an icon font and you can enjoy all the benefits of conditional formating, mouseover, etc as clean and lightweight as possible.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.