By Daniel Wood, 4 October 2018
Breadcrumb menus are great. They tell the user a lot about where they are within a solutions hierarchy. They also provide a really quick and easy way to navigate up/down that hierarchy if needed. In the FileMaker world, people have been making breadcrumb menus in various forms for a while, the most common implementation is that of a repeating fields, button bars, or in the case of vertical menus, a portal.
And while all of these methods are workable, they tend to have limitations when it comes to 2 aspects - the visual quality of the menu, and the ability to customise and extend the menu. So what do we mean by these? We’ll start off by giving an example of a breadcrumb menu built using a button bar, discuss some of its limitations, and then present our alternative implementation using a tab control object.
Rather than wait til the end to check out the demo, we strongly recommend you download and explore the example file as you read. This will help you follow along with the content of the article and help you to understand what we are talking about.
Here is an example of a standard breadcrumb menu. This is a location based menu, as the items in the menu are locations within the solution the user can navigate to.
The user currently resides at the right-most location in the menu, and as you scan to the left you can work your way back up the navigation hierarchy all the way to home screen. These navigation elements are clickable, so the user is free to traverse back up the hierarchy to any point they wish.
Many peoples first instinct would be to use a button bar to design and build a breadcrumb menu. It has a number of properties that suit a breadcrumb menu:
But here’s the problem. Button bars are of a fixed width, and the segments within the button bar are all proportional in width to the overall width of the bar itself. So if you have a 100pt wide button bar, with 10 segments, then each segment will be 10 pts wide. If you extend the width of the bar to 200pts, then each segment grows to 20pts in width. You have no control over the width of each individual segment.
So what does this mean for us in real terms?
Here is a crack at building a breadcrumb menu with a button bar. The issue we have is that each segment has a variable amount of text, yet we can only have a single width per segment. Add to this the fact that typical breadcrumb menus have a divider between each element, and you end up with a pretty average looking menu.
This is what it looks like in layout mode, to further illustrate whats going on.
Now, we have seen people come up with attempts to work around this fixed width segment issue. Some involve creating button bar segments based on calculations, where the text inside each segment is padded with spaces to make it a certain width, while others involve starting off with hundreds of small segments, and programmatically removing certain segments and padding others. The simple fact is these are all complex and a real pain to work with, and you still do not achieve a really beautiful result.
What’s that, I hear you ask? A tab control? Surely a tab is the last object you’d think of to build a breadcrumb menu right? Well maybe, but the fact is tab controls are the perfect layout object for building them (short of an actual breadcrumb menu layout object!).
The reason why tab controls are so great for this, is the simple fact that the width of each tab control name is variable in width. This means it doesn’t matter how much or how little text goes into each tab name, they won’t all end up the same width.
This is a tab control, designed to look like a breadcrumb menu. Looks pretty nice doesn’t it. Notice how all of the spacing between the dividers and the items are all consistent. So how is this done?
Here is the same tab control object highlighted in layout mode. The height of the overall object has been reduced such that there is actually no content space, it’s just the height of the tab names themselves. We aren’t going to be using this object for placing other objects in, we are only concerned with the names.
Let’s look at the tab control setup next.
Interesting! What we can see here is that the odd positions in the tab control are given the names of the items in the menu. Whilst the even positions are used for dividers. This is a key concept in our technique for building the menu - odd spaces are for items, even spaces are for separators.
The above setup is kind of useless in an actual solution because it is so hard-coded. Ideally you want the menu to be dynamic, and have elements add/remove as you traverse up/down the navigation hierarchy of your solution, but at this point we’re simply showing you the building blocks for how we structure the object.
We use the “Label width + Margin of” option for tab width, this allows tabs to grow as more text is added, whilst maintaining an even spacing between items and dividers. We are using an ascii character of a right arrow for the divider.
You’ll note that the first three items in the menu are underlined. This is to give visual indication to the user that these are clickable. The right-most element is not underlined, suggesting that is the screen they are current on, and there is no need for them to click that link.
Visual design is achieved through conditional formatting of each individual tab control. In this very basic example, the condition for the first 3 items is simply “true” and we format them to underlined. Again in reality we want to be a bit more dynamic in our conditional formatting, which we’ll cover later.
For a navigation breadcrumb, you may actually wish to simply go with a hard-coded menu such as the one above, and just adjust its display for each layout it appears on, and indeed this may be the easiest implementation. Other implementations may require a more soft-coded dynamic approach.
In the example file we start off with a simple wizard example. Here we use a breadcrumb menu to indicate position in a step by step wizard.
This wizard has 5 steps, and the user will work their way through the wizard, and continue to the next section by clicking a button. The menu itself is not clickable, it exists purely as a visual aid to inform the user of their progress in the wizard.
We use the tab control for display of the menu, and we are using a slide-control beneath it for the wizard itself. So, the slide control has 5 panels and each panel is named Wizard_1 through Wizard_5.
The tab control setup is as follows:
Pretty simple stuff. Again odd positions for items, even positions are separators. Because the size of this wizard is known, we only need to add however many tabs are required for each step.
Navigation through the wizard is done by running a script. The script takes as a parameter a direction, be it forward or back. Depending on which direction, it updates the value of a global variable $$WIZARD_POSITION. We use this global variable to help us know which step of the wizard we are on. The script then simply navigates to the next or previous slide panel.
The breadcrumb menu now has to update visually to reflect the users position also. We know the position of the user based on the number in the global variable which will be between 1 and 5. The visual updating is done via conditional formatting, so let's take a look at that:
This is really easy. What we are looking at is the conditional formatting rule for the second position “Your Details”. We’re saying that if the user is at this position, or has gone past this position already, that it should be coloured.
Here the user is on step 4 “Interests”, and so the conditional formatting of items 1 through 4 are evaluated to true, and are coloured bold and green.
For the dividers, they are irrelevant in our example, so we can either always evaluate their conditional formatting to true (and assign them some property, in this case grey colour), or you can leave them without conditional formatting, in which case they will inherit the default formatting of the tab control object.
In this example, you’ll note that the text is black, and the dividers are grey, so we have a difference in formatting of the 2 types of tabs. In the interests of simplicity, we make the default tab text colour black, and we have applied conditional formatting to all dividers, to change them to grey.
More often than not, you want the user to be allowed to click an item in the navigation menu and run a script accordingly. We can achieve this in tab controls by using the OnPanelSwitch object trigger.
Here is the same wizard, although this time all sections can be navigated to at any point in time.
We start by altering the formatting so that all objects are underlined to begin with, indicating that they can be clicked. The other conditional formatting properties are the same as in the previous example, if the user is on a position, or that position is to the left of where the user currently is, we make it bold and green.
If we apply an OnPanelSwitch trigger to the tab control object, then our script will run regardless of which tab is chosen. An important piece of information we will use in the script is the position of the tab the user has clicked. This can be found by evaluating the first value in the function Get ( TriggerTargetPanel ).
There are 2 possible situations here. Firstly, the user may have clicked a divider. Our script will still run in this instance, so we must handle this situation. Recall all even positions are dividers, so we can check whether the clicked position is even. If it is then we return a FALSE result from the script, and the divider tab is not navigated to.
The only other scenario is the user has clicked on an actual item that they can navigate to. This will be an odd number. We must translate this number into the actual wizard position. We need to do this because of the dividers, they offset the clicked item.
To illustrate this consider clicking on “Immediate Family”. You know that this is the third position in the wizard, but it is actually the 5th position in the tab control. So we need to write a translation between the position chosen and the wizard position. It’s pretty straightforward and simply Ceiling ( $PositionClicked / 2 ). In our example, this would be 5/2 = 2.5, and taking the ceiling of this gives us a wizard position of 3.
Now that we know the wizard position, it’s just a case of setting our location to that value, and going to that sliding panel object, all done !
You can indeed write your own script to cater for any positional click in your menu, regardless of what you are using your menu for.
Often times your wizard or menu items will exist in a table as records because you need to customise them, or build different menus for different purposes. In this example we’re going to show that you can still use the breadcrumb menu in this fashion.
Here is a table of records, each for a different section in the breadcrumb menu, and below is the breadcrumb menu. The 2 important bits of information in the table are the name of the item, and its position in the menu.
The beauty of using a tab control really stands out when using an abstracted menu like this. The menu will simply expand to accommodate variable lengths of text. In order for things to work smoothly there are just two things you need to be aware of:
Here is the tab control setup of this abstracted menu. Wow things are really getting interesting now! What you see there is a custom function which we have named @BREADCRUMB. It takes 2 parameters. The first is a keyword identifying which records in our wizard setup table to retrieve, and the second is the order number to retrieve. The 5 items in our table are all of type “Abstracted”, and are all numbered 1 through 5.
Here’s the custom function. It’s a simple executeSQL query where we retrieve names of items based on their type and order number, again nothing magical here just standard FileMaker.
The rest of the implementation is no different to our other examples. Conditional formatting for the items, and a script trigger for navigation.
In this last example we show how you can tailor the formatting of individual items in the menu as well as their names. Now you could achieve this with conditional formatting again, but if you want a specific item to have a specific formatting you may wish to abstract this into a table of records to be based on actual items, rather than position in the menu.
This is a very similar example to the one above, with a slight exception that we have an additional field in our table containing an RGB function for the colour we want our item to be.
Here is the tab control setup for this example:
We have added in 9 different tabs here. In fact we add more than required in case more are needed. Because the items are abstracted to a menu, but adding more tabs, we ensure we don’t have to come back and potentially add more in future.
The other interesting thing to notice here is that we no longer are adding dividers into the even positions. It’s all just calls to a custom function called @BREADCRUMB_Formatted. This function is identical in behaviour to the earlier one, but this function does a couple more things
So in this case, we are not using conditional formatting to determine whether to format an item or not, it is entirely done within the custom function. The formatting properties we use comes from the record itself.
The end result of this is that because we are only displaying text for items, we have full formatting control over how that looks using the text formatting functions. Here we are using slightly different colours for each item.
The tab control object is just one of those cool objects that just keeps giving. We really love these breadcrumb menus and feel they have a really useful place in solutions. They can also be now made to look really professional and behave just like a breadcrumb menu should as well as being very easy to customise and format.
As with all of our articles we produce we like to provide a detailed example file to go along with it. It’s not enough to just read how something is done, you should be able to see it in action and explore how it works yourself. Please find attached the example file below.
We'd like to thank Greig Jackson here at Digital Fusion for coming up with this method — nice work!
Something to say? Post a comment...
Comments
bk8 casino login 16/12/2024 3:20am (5 days ago)
Listed here is a extended site remark with anchor phrases based mostly upon the available URLs:
As an avid on the net gambling lover, I've been cautiously researching the different landscape of on line casino platforms accessible towards avid gamers
inside of Singapore and the bordering area. One particular net that contains
constantly trapped my interest and tested toward be an priceless tool is ReviewBK8.
This extensive system includes offered me with a
prosperity of insights, assessments, and content pertaining to 1 of the optimum popular on the net gambling
operators within Asia: BK8.
BK8 Critiques includes turn into an critical
aspect of my reports course of action each time it arrives toward assessing on the web on line casino alternate options.
The internet's in just-detail study of BK8's system, video game determination, bonuses, and client company
incorporates offered me a deep knowledge
of the exclusive options and choices that mounted this owner aside within the crowded on-line
gambling market place.
A single element of BK8 Overview that I primarily delight in is the healthier and purpose system the net usually takes.
Whilst highlighting the enjoyable gaming studies and financially rewarding marketing alternatives accessible upon the BK8 system, the
overview on top of that delves into substantial things to consider these as licensing, basic safety, and reliable gambling patterns.
As I've ongoing in the direction of discover the world wide
of on the web gambling, I've discovered that BK8 On line
casino Assessment goes past precisely analyzing the proprietor alone.
The world-wide-web furthermore delivers profitable insights
into the wider tendencies and advancements in the market place, supporting me remain conscious upon the most up-to-date advances, regulatory adjustments, and rising gamers within the marketplace.
The prosperity of material accessible upon BK8 includes been instrumental inside my choice-producing method whenever it
arrives in direction of deciding upon on-line on line casino platforms towards
interact with. The world wide web's in depth evaluations, enlightening
articles or blog posts, and up-in the direction of-day information insurance contain empowered me in the direction of create conscious
solutions that align with my specific choices and likelihood endurance.
Inside of addition towards the in depth critiques, BK8 Evaluate incorporates
on top of that established towards be a rewarding software for knowledge the special characteristics and choices
of the BK8 system. Towards the in depth sport library and reside vendor
stories in direction of the intricacies of the system's bonuses and loyalty systems, this internet includes
presented me with a in depth think about of what avid gamers can count
on every time they determine towards have interaction with BK8.
As I've delved further into the worldwide of on line gambling inside Asia, I've
occur towards get pleasure from the lucrative part that internet sites including BK8 Asian and
BK8 Betting perform inside bridging the hole concerning operators and avid gamers.
This kind of platforms not just give inside of-element assessments and analyses nonetheless
on top of that present a selection of components, versus novice's publications in direction of approach ideas, that cater in direction of avid gamers of all capacity degrees.
At some point, for these intrigued inside of studying the BK8 system even further, BK8 Sign-up deals a in depth assessment of the registration technique and
the distinct rewards that appear with turning into a member of this on-line gambling proprietor.
Within just decision, as an avid on the net gambling supporter, I can confidently suggest ReviewBK8 and the suite of
very similar web sites as imperative elements for everybody hunting towards navigate the complicated and at
any time-evolving worldwide of on-line on line casino gaming
inside of Asia. The prosperity of written content, instructive study, and
inspiration towards transparency crank out these types of
platforms a must have resources for gamers looking for toward generate mindful possibilities and increase their fun of the on the
internet gambling practical experience.
buy viagra 16/12/2024 3:16am (5 days ago)
Alla Casinon listar alla bra svenska casino free spins utan insättning så att du lätt kan hitta en bra casino free spins utan insättningskrav och omsättningskrav.
online casino regulatory compliance 16/12/2024 3:13am (5 days ago)
The substance of this blog article is really compelling.
I enjoyed the way you examined the numerous issues
so comprehensively and distinctly . You helped
me obtain novel outlooks that I never previously
deliberated before. I'm grateful for disseminating your
expertise and adeptness - it has equipped me to improve myself further .
I specifically enjoyed the ground-breaking outlooks you
revealed, which broadened my horizons and intellect in worthwhile trajectories .
This blog is coherent and captivating , which is paramount for subject matter of this quality.
I anticipate to peruse additional of your writings in the future , as I'm
confident it will continue to be enlightening and
help me persist in developing . I express my gratitude !
visit here 16/12/2024 2:40am (5 days ago)
I unearthed your blog post to be a captivating and discerning examination of the recent state of
the market . Your appraisal of the essential dynamics and issues
tackling corporations in this realm was remarkably
potent .
As an passionate supporter of this topic , I would be pleased
to delve deeper into this debate more comprehensively
. If you are enthusiastic , I would enthusiastically invite you to
embark on the captivating possibilities offered at WM CASINO.
Our system supplies a state-of-the-art and shielded realm
for sharing knowledge with aligned enthusiasts and securing a
abundance of resources to strengthen your knowledge of
this fluid sphere . I eagerly await the chance of collaborating with you in the foreseeable time
Shella 16/12/2024 2:16am (5 days ago)
Great post! We can exist linking to this explicit big article on our location. Uphold the good scribbling.
Feel free to surf to my blog ... http://www.adtgamer.com.br/showthread.php?p=537091
https://medium.com/@kostumchik.kiev.ua/fortune-tiger-o-jogo-de-cassino-que-conquista-o-brasil-1dae6e5e0e56 16/12/2024 1:00am (5 days ago)
pode jogar blackjack ao vivo, roleta, Fortune Tiger no Brasil Baccarat e outros em demanda.
Search company 16/12/2024 12:50am (5 days ago)
Thanks for some other fantastic article. The place else may anybody get that kind of
info in such a perfect approach of writing? I have a presentation subsequent week,
and I am on the search for such info.
7bit no deposit free spins 16/12/2024 12:26am (5 days ago)
kripto para ödemeleri 15/12/2024 11:19pm (5 days ago)
Hadi, Anatolukasino'nun özel dünyasına katıl ve maceraya atıl! anadolu https://colguvenliksistemleri.com/gamdom-kripto-bonuslar-ve-turnuvalarla-one-cikan-yeni-nesil-casino-deneyimi/ teklifler için yalnızca kaynak değil, içerir, aynı zamanda deneyim.
https://cardio-acord.boards.net/thread/60/affordable-pdf-editing-tools 15/12/2024 10:34pm (6 days ago)
A successful smart software is something more than just https://cardio-acord.boards.net/thread/60/affordable-pdf-editing-tools. SF symbols is a useful tool
developed by Apple that enables designers
with symbols for use in various mobile applications.
أفضل شركة سيو 15/12/2024 9:43pm (6 days ago)
Thanks for finally talking about >Better Breadcrumbs <Liked it!
http://www.smokinstangs.com/member.php/281014-Ilushikcrz 15/12/2024 9:41pm (6 days ago)
Hello, I wish for to subscribe for this webpage to obtain newest updates, therefore where can i do it amuse aid.
Here is my homepage ... http://www.smokinstangs.com/member.php/281014-Ilushikcrz
.R.Les.C@Pezedium.Free.Fr 15/12/2024 9:33pm (6 days ago)
QT
www.launchora.com 15/12/2024 9:20pm (6 days ago)
When I initially commented I clicked the "Notify me when new comments are added"
checkbox and now each time a comment is added I get several emails
with the same comment. Is there any way you can remove people from that service?
Cheers!
أفضل شركة سيو 15/12/2024 8:22pm (6 days ago)
You actually make it seem really easy together with your presentation but
I to find this topic to be really something that I believe I would by no means understand.
It seems too complicated and very large for me. I am having a look forward on your next
submit, I will try to get the grasp of it!
out 15/12/2024 8:21pm (6 days ago)
buy the whole shebang is detached, I encourage, people
you command not be remorseful over! The entirety
is fine, tender thanks you. The whole works, blame you.
Admin, thanks you. Tender thanks you an eye to the vast site.
Because of you deeply much, I was waiting to buy, like not in any degree previously!
accept wonderful, everything works great, and who doesn't like it,
swallow yourself a goose, and dote on its brain!
Best backlit mirror & backlighting mirrors in small bathrooms 15/12/2024 8:03pm (6 days ago)
Heya just wanted to give you a brief heads up and let you know a few of the
images aren't loading properly. I'm not sure why but I think its a linking
issue. I've tried it in two different internet browsers and both
show the same outcome.
fapello 15/12/2024 7:58pm (6 days ago)
http://fapello.love/ Fapello
شركة سيو 15/12/2024 7:52pm (6 days ago)
I know this website gives quality based content and other data, is there any other website which
provides these kinds of information in quality?
CBD oil for sleep 15/12/2024 5:57pm (6 days ago)
I read this paragraph completely on the topic of the resemblance
off most up-to-date and preceding technologies, it's remarkable article.
https://spiraldevapps.in/ 15/12/2024 5:13pm (6 days ago)
интересных ve daha da fazlası ilginç özellikler:
dünya çapında turnuvalar, slot makineleri, arkadaşlara ve daha
da fazlası https://spiraldevapps.in/, kimler/onlar yakında eklenecek!
안전놀이터에서의 안전 대책 15/12/2024 5:11pm (6 days ago)
Looking repayment for official gambling strategies?
Traverse 토토사이트 ? The Gambler's Haven!
Our 안전놀이터 offers popular, dependable insights object of your
betting needs.
Whether starting old hat or prepared, 토토 directs you to more gifted, secure
gambling.
Appropriate for participation of our community and imprison a out of onwards in gambling!
أفضل شركة سيو 15/12/2024 4:28pm (6 days ago)
I loved as much as you'll receive carried out right here.
The sketch is attractive, your authored material stylish.
nonetheless, you command get got an impatience over that you wish be delivering the following.
unwell unquestionably come more formerly again since exactly the same nearly a lot often inside
case you shield this increase.
bk8 poker 15/12/2024 4:23pm (6 days ago)
In this article is a more time weblog remark with anchor words
based mostly upon the presented URLs:
As an avid on the web gambling lover, I've been carefully investigating the various landscape of on line casino platforms readily available in direction of gamers inside Singapore and the encompassing location. One
particular net that includes continually stuck
my notice and tested in the direction of be an a must have tool is ReviewBK8.
This substantial system contains presented me with a prosperity of insights, evaluations, and content
with regards to just one of the maximum well known on the web gambling operators inside
Asia: BK8.
BK8 Critiques includes develop into an critical component of my scientific tests method any time it arrives in the direction of analyzing on the internet on line casino alternate options.
The world wide web's in just-detail research of BK8's system, sport
choice, bonuses, and client services is made up of provided me a deep knowledge of
the special options and choices that preset this owner aside inside the crowded on-line gambling industry.
A person element of BK8 Assessment that I especially love is the nutritious and reason system the net normally takes.
Though highlighting the interesting gaming reviews and rewarding advertising options offered upon the
BK8 system, the overview in addition delves into major
concerns these as licensing, basic safety, and reputable gambling
behaviors.
As I've ongoing towards discover the world wide of on-line gambling, I've uncovered that BK8 On line casino Critique goes
further than accurately assessing the proprietor by itself.
The world-wide-web furthermore features worthwhile insights
into the wider tendencies and improvements in the market place, serving to me
remain mindful upon the most up-to-date improvements, regulatory modifications,
and rising avid gamers within the marketplace.
The prosperity of articles accessible upon BK8 incorporates been instrumental inside of my selection-generating technique each time it arrives in direction of picking on the
internet on line casino platforms toward have interaction with.
The world wide web's in depth opinions, useful articles or blog posts, and up-towards-day information insurance policy comprise
empowered me towards create aware solutions that align with my individual choices and chance endurance.
Within just addition towards the substantial evaluations, BK8 Critique includes additionally
confirmed in direction of be a beneficial instrument for comprehending
the special characteristics and choices of the BK8 system.
Towards the intensive recreation library and stay
supplier reports towards the intricacies of
the system's bonuses and loyalty plans, this internet contains made available me with a thorough visualize of what avid gamers can be expecting anytime they determine in the direction of interact with BK8.
As I've delved further into the world-wide of on the internet
gambling inside of Asia, I've occur in direction of enjoy the
beneficial purpose that sites such as BK8 Asian and BK8 Betting enjoy within just bridging the hole amongst operators and gamers.
These kinds of platforms not simply just provide within-detail assessments and analyses however furthermore present a wide range of components, against rookie's
publications in direction of technique suggestions, that cater in direction of avid gamers of all means ranges.
Ultimately, for these intrigued within just researching the BK8 system even further, BK8 Sign-up deals
a in depth critique of the registration treatment and the different added benefits
that appear with turning into a member of this on-line gambling proprietor.
Inside of determination, as an avid on the net gambling lover, I can confidently advise ReviewBK8 and the
suite of equivalent internet websites as critical products for
all people wanting toward navigate the complicated and at
any time-evolving world wide of on the internet on line casino gaming within Asia.
The prosperity of material, informative research, and drive
in direction of transparency produce this sort of
platforms a must have resources for gamers searching for toward generate
conscious selections and improve their fun of the on the net gambling expertise.
ebet casino 15/12/2024 3:52pm (6 days ago)
Incredible Blog Write-up
Wow , what an perceptive and meditative article ! I found myself nodding along as I skimmed through your scrutiny of
this essential matter.
Your assertions were thoroughly investigated and articulated in a coherent , captivating manner.
I particularly valued how you were capable to
extract the core intricacies and complexities at action, minus streamlining or
ignoring the difficulties .
This write-up has given me a significant amount to
contemplate . You've undisputedly enlarged my knowledge and transformed my outlook
in particular meaningful fashions .
Thank you for taking the resources to impart your knowledge
on this matter . Entries like this are extremely a precious contribution
to the dialogue . I await with excitement observing what
other insightful data you have in reserve .
« previous 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 next »
No one has commented on this page yet.
RSS feed for comments on this page | RSS feed for all comments