{"id":8764,"date":"2015-06-23T06:10:38","date_gmt":"2015-06-23T13:10:38","guid":{"rendered":"http:\/\/www.seedcode.com\/?p=8764"},"modified":"2015-06-23T06:10:38","modified_gmt":"2015-06-23T13:10:38","slug":"filemaker-14-navigation-button-bars","status":"publish","type":"post","link":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/","title":{"rendered":"FileMaker 14 Navigation with Button Bars"},"content":{"rendered":"<p>Here\u2019s a FileMaker 14 navigation sidebar that uses the new button bar object to dynamically stay in sync with\u00a0the layouts in your file. It also uses a slide control for a cool animated show\/hide effect, and you can option-click the \u201chide\u201d arrow for a compacted icon-only version. This technique uses only native FileMaker functionality, no plugins, custom functions or web viewers. And you don&#8217;t even need a script trigger on every layout; it&#8217;s very simple.<\/p>\n<p>Navigation systems are one of those things that can get very complicated as you try to build something you&#8217;ll never need to mess with again. In contrast, this is a simple system that looks great and keeps your code easy to work with.<\/p>\n<div class=\"lightbox\">\n<figure id=\"attachment_8771\" aria-describedby=\"caption-attachment-8771\" style=\"width: 150px\" class=\"wp-caption alignright\"><a href=\"http:\/\/www.seedcode.com\/wp-content\/uploads\/2015\/06\/image.png\"><img decoding=\"async\" class=\"wp-image-8771 size-thumbnail\" src=\"http:\/\/www.seedcode.com\/wp-content\/uploads\/2015\/06\/image-150x150.png\" alt=\"Button bars in FileMaker 14\" width=\"150\" height=\"150\" \/><\/a><figcaption id=\"caption-attachment-8771\" class=\"wp-caption-text\">Button bars in FileMaker 14<\/figcaption><\/figure>\n<\/div>\n<p><strong>How it works:<\/strong> the script that opens and closes the sidebar builds a list of your layout names and those are reflected in the sidebar, as are changes to the layout sort order.\u00a0And since FileMaker&#8217;s\u00a0design functions like LayoutNames respect access privileges, this sidebar\u00a0only show layouts the logged in user is allowed to see.<\/p>\n<p>Animations here are an updated and improved version of what we were working on\u00a0<a href=\"http:\/\/www.seedcode.com\/filemaker-13-animated-slide-panels\/\">here<\/a> in FileMaker 13.<\/p>\n<p><strong>Example file:<\/strong> download the example file &#8220;Navigation Sidebar&#8221; in the lower half of our <a href=\"http:\/\/www.seedcode.com\/downloads\/\">downloads<\/a> page.<\/p>\n<p>[ba-youtubeflex videoid=&#8221;SD1BtyJ17y0&#8243;]<\/p>\n<p style=\"text-align: center;\">[ba-button link=&#8221;\/newsletter-signup\/&#8221; color=&#8221;Yellow&#8221; target=&#8221;self&#8221;]Want more? Subscribe to\u00a0SeedCode\u00a0for more example files.[\/ba-button]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here\u2019s a FileMaker 14 navigation sidebar that uses the new button bar object to dynamically stay in sync with\u00a0the layouts in your file. It also uses a slide control for a cool animated show\/hide effect, and you can option-click the \u201chide\u201d arrow for a compacted icon-only version. This technique uses only native FileMaker functionality, no plugins, custom functions or web viewers. And you don&#8217;t even need a script trigger on every layout; it&#8217;s very simple. Navigation systems are one of those things that can get very complicated as you try to build something you&#8217;ll never need to mess with again. In contrast, this is a simple system that looks great and keeps your code easy to work with. How it works: the script that opens and closes the sidebar builds a list of your layout names and those are reflected in the sidebar, as are changes to the layout sort order.\u00a0And since FileMaker&#8217;s\u00a0design functions like LayoutNames respect access privileges, this sidebar\u00a0only show layouts the logged in user is allowed to see. Animations here are an updated and improved version of what we were working on\u00a0here in FileMaker 13. Example file: download the example file &#8220;Navigation Sidebar&#8221; in the lower half of our downloads page. [ba-youtubeflex videoid=&#8221;SD1BtyJ17y0&#8243;] [ba-button link=&#8221;\/newsletter-signup\/&#8221; color=&#8221;Yellow&#8221; target=&#8221;self&#8221;]Want more? Subscribe to\u00a0SeedCode\u00a0for more example files.[\/ba-button]<\/p>\n","protected":false},"author":2,"featured_media":8770,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[11],"class_list":["post-8764","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-interface-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>FileMaker 14 Navigation: animation &amp; button bars - SeedCode<\/title>\n<meta name=\"description\" content=\"A simple FileMaker 14 navigation bar that stays in sync as you add &amp; remove layouts. Very simple with nice animations. Free, unlocked example file provided\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"FileMaker 14 Navigation: animation &amp; button bars - SeedCode\" \/>\n<meta property=\"og:description\" content=\"A simple FileMaker 14 navigation bar that stays in sync as you add &amp; remove layouts. Very simple with nice animations. Free, unlocked example file provided\" \/>\n<meta property=\"og:url\" content=\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\" \/>\n<meta property=\"og:site_name\" content=\"SeedCode\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/seedcoder\" \/>\n<meta property=\"article:published_time\" content=\"2015-06-23T13:10:38+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png\" \/>\n\t<meta property=\"og:image:width\" content=\"109\" \/>\n\t<meta property=\"og:image:height\" content=\"110\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"jeffalmquist\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dayback\" \/>\n<meta name=\"twitter:site\" content=\"@dayback\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"jeffalmquist\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\"},\"author\":{\"name\":\"jeffalmquist\",\"@id\":\"https:\/\/seedcode.com\/#\/schema\/person\/e038c04c4091d558cd79fa44d0199ff6\"},\"headline\":\"FileMaker 14 Navigation with Button Bars\",\"datePublished\":\"2015-06-23T13:10:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\"},\"wordCount\":251,\"commentCount\":30,\"publisher\":{\"@id\":\"https:\/\/seedcode.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png\",\"keywords\":[\"Interface Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\",\"url\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\",\"name\":\"FileMaker 14 Navigation: animation & button bars - SeedCode\",\"isPartOf\":{\"@id\":\"https:\/\/seedcode.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png\",\"datePublished\":\"2015-06-23T13:10:38+00:00\",\"description\":\"A simple FileMaker 14 navigation bar that stays in sync as you add & remove layouts. Very simple with nice animations. Free, unlocked example file provided\",\"breadcrumb\":{\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage\",\"url\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png\",\"contentUrl\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png\",\"width\":109,\"height\":110},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/seedcode.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"FileMaker 14 Navigation with Button Bars\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/seedcode.com\/#website\",\"url\":\"https:\/\/seedcode.com\/\",\"name\":\"SeedCode\",\"description\":\"Build the Software You&#039;ve Always Wanted\",\"publisher\":{\"@id\":\"https:\/\/seedcode.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/seedcode.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/seedcode.com\/#organization\",\"name\":\"SeedCode\",\"url\":\"https:\/\/seedcode.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seedcode.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2022\/12\/SeedCodeLogo.png\",\"contentUrl\":\"https:\/\/seedcode.com\/wp-content\/uploads\/2022\/12\/SeedCodeLogo.png\",\"width\":595,\"height\":189,\"caption\":\"SeedCode\"},\"image\":{\"@id\":\"https:\/\/seedcode.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/seedcoder\",\"https:\/\/x.com\/dayback\",\"https:\/\/www.linkedin.com\/company\/seedcode\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/seedcode.com\/#\/schema\/person\/e038c04c4091d558cd79fa44d0199ff6\",\"name\":\"jeffalmquist\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seedcode.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g\",\"caption\":\"jeffalmquist\"},\"url\":\"https:\/\/seedcode.com\/author\/jeffalmquist\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"FileMaker 14 Navigation: animation & button bars - SeedCode","description":"A simple FileMaker 14 navigation bar that stays in sync as you add & remove layouts. Very simple with nice animations. Free, unlocked example file provided","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/","og_locale":"en_US","og_type":"article","og_title":"FileMaker 14 Navigation: animation & button bars - SeedCode","og_description":"A simple FileMaker 14 navigation bar that stays in sync as you add & remove layouts. Very simple with nice animations. Free, unlocked example file provided","og_url":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/","og_site_name":"SeedCode","article_publisher":"https:\/\/www.facebook.com\/seedcoder","article_published_time":"2015-06-23T13:10:38+00:00","og_image":[{"width":109,"height":110,"url":"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png","type":"image\/png"}],"author":"jeffalmquist","twitter_card":"summary_large_image","twitter_creator":"@dayback","twitter_site":"@dayback","twitter_misc":{"Written by":"jeffalmquist","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#article","isPartOf":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/"},"author":{"name":"jeffalmquist","@id":"https:\/\/seedcode.com\/#\/schema\/person\/e038c04c4091d558cd79fa44d0199ff6"},"headline":"FileMaker 14 Navigation with Button Bars","datePublished":"2015-06-23T13:10:38+00:00","mainEntityOfPage":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/"},"wordCount":251,"commentCount":30,"publisher":{"@id":"https:\/\/seedcode.com\/#organization"},"image":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage"},"thumbnailUrl":"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png","keywords":["Interface Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/","url":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/","name":"FileMaker 14 Navigation: animation & button bars - SeedCode","isPartOf":{"@id":"https:\/\/seedcode.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage"},"image":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage"},"thumbnailUrl":"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png","datePublished":"2015-06-23T13:10:38+00:00","description":"A simple FileMaker 14 navigation bar that stays in sync as you add & remove layouts. Very simple with nice animations. Free, unlocked example file provided","breadcrumb":{"@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#primaryimage","url":"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png","contentUrl":"https:\/\/seedcode.com\/wp-content\/uploads\/2015\/06\/navver.png","width":109,"height":110},{"@type":"BreadcrumbList","@id":"https:\/\/seedcode.com\/filemaker-14-navigation-button-bars\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/seedcode.com\/"},{"@type":"ListItem","position":2,"name":"FileMaker 14 Navigation with Button Bars"}]},{"@type":"WebSite","@id":"https:\/\/seedcode.com\/#website","url":"https:\/\/seedcode.com\/","name":"SeedCode","description":"Build the Software You&#039;ve Always Wanted","publisher":{"@id":"https:\/\/seedcode.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/seedcode.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/seedcode.com\/#organization","name":"SeedCode","url":"https:\/\/seedcode.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seedcode.com\/#\/schema\/logo\/image\/","url":"https:\/\/seedcode.com\/wp-content\/uploads\/2022\/12\/SeedCodeLogo.png","contentUrl":"https:\/\/seedcode.com\/wp-content\/uploads\/2022\/12\/SeedCodeLogo.png","width":595,"height":189,"caption":"SeedCode"},"image":{"@id":"https:\/\/seedcode.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/seedcoder","https:\/\/x.com\/dayback","https:\/\/www.linkedin.com\/company\/seedcode\/"]},{"@type":"Person","@id":"https:\/\/seedcode.com\/#\/schema\/person\/e038c04c4091d558cd79fa44d0199ff6","name":"jeffalmquist","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seedcode.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/?s=96&d=mm&r=g","caption":"jeffalmquist"},"url":"https:\/\/seedcode.com\/author\/jeffalmquist\/"}]}},"_links":{"self":[{"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/posts\/8764","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/comments?post=8764"}],"version-history":[{"count":0,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/posts\/8764\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/media\/8770"}],"wp:attachment":[{"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/media?parent=8764"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/categories?post=8764"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/seedcode.com\/wp-json\/wp\/v2\/tags?post=8764"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}