Jump to content
michael3785

Tweaking tab control height

Recommended Posts

I have avery big solution that was built in FM7 originally and it needs a UI overhaul. So, no themes are as good as they are I am rolling up my sleeves and putting together a reference design. have been looking around at design templates to lift (speaking frankly) and I like the FM Starting Point design. However there are a few things I need to tweak that I can't readily see how to do it in Inspector. The main one is the height of the tabs in the tab controls. They are too high for my layouts. As far I can see I either have to hack the CSS somehow or I have to use a conditional fomatting workaround, set the text size really small to reduce the height of the tab, then conditional format the text back up to the correct size, which is a bit yuck, seeing as I have lots of tabs.

Any advice much appreciated. Many thanks.

Share this post


Link to post
Share on other sites

I would think hacking the CSS is the worse idea.   I don't quite understand this part:

On 7/4/2017 at 11:23 AM, michael3785 said:

 So, no themes are as good as they are.. 

If you dig a little deeper into FMSP you'll see changing the tabs is easy.  Go into layout mode, click on a tab control, open up the inspector palette on the styles tab.  You'll see the very large tab controls on the Contacts layout listed with the style of Default.  Try changing it to Alternate Tab Control.  This styling for the tab control is attached to a custom theme.  You can go through and change themes (on a copy first).  Go through all themes until you see the elements you like-Tab controls, scroll bars, etc.  Then save them as a new style to attach to your custom theme.

But more importantly if you're coming from FM7 to 16, research Themes and Styles on the forums and blogs.  You really should create a new custom theme, and style all objects and save to the custom theme.

You can also create tab panels with no labels, and use the button bar to mimic labels, where selecting a button changes the tab panels.

Share this post


Link to post
Share on other sites
On 7/4/2017 at 8:23 AM, michael3785 said:

have avery big solution that was built in FM7 originally and it needs a UI overhaul

This doesn't sound like you are using FM Starting Point, rather instead, a file you developed in FileMaker Pro yourself?

Quote

looking around at design templates to lift (speaking frankly) and I like the FM Starting Point design

I sent you a Private Message, please read it first.

Share this post


Link to post
Share on other sites

Hi, I'm Nick Hunter developer at RCC who designed the new FMSP.

There's only one way to tweak Tab Control height. 

There is 2 type of Tabs: 

  • The Tab Control in Themes for Desktop
  • Tab control in Themes for Touch.

Tabs for Desktop are "thin" when tabs for touch are twice as big.

How to transfer thick tabs control from a Touch Theme to a desktop theme?

1- Create a layout with the theme of your choice for Touch.

595d744424c79_ScreenShot2017-07-06at2_20_21AM.thumb.png.544e7d044980fc1df919f8c46fd95569.png

2 - Create a Tab Control

3 - Copy the Tab Control Tab from the theme for touch.

595d7302e3703_ScreenShot2017-07-06at2_12_40AM.thumb.png.eb3dce5e21eebe8c05a71a38366152b4.png

 

4 - Go to the layout with the theme for Desktop

5 - Create a Tab Control 

6 - Paste the style to the Tab Control... The tab becomes like the one for Touch.

595d74ac0bf30_ScreenShot2017-07-06at2_21_30AM.thumb.png.01c53704eccd6d2de0f4895a35c08303.png

7- Save a new Style... and Voilà.

595d73db4d596_ScreenShot2017-07-06at2_13_32AM.thumb.png.7f51c1aec66546b17453dd24ff7f3bec.png

You have now both Tab Control in the same layout.

595d73ea1eb56_ScreenShot2017-07-06at2_18_06AM.thumb.png.8cf891f6d3c47b8eb3fa51b1ede16f01.png

 

 

 

Screen Shot 2017-07-06 at 2.13.24 AM.png

  • Like 1

Share this post


Link to post
Share on other sites

Hi Nick

Many thanks for your explanation. That worked perfectly :)

I copied the smaller tab control from the other layout over to my working one and created a new style based on it.

Thanks very much

Michael

 

Share this post


Link to post
Share on other sites

Here is a link that discussed this same thing. The answer here https://community.filemaker.com/message/79268#79268 might be of help.

 
Quote

 

DavidJondreau  Apr 23, 2012 12:52 PM (in response to jgalt)

Set the font size to get the tab height you want. Then set conditional formatting on the tabs to a calc = 1 and set your desired label font size.


 

I used calc as Self = 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


×

Important Information

By using this site, you agree to our Terms of Use.