VLF ONE #PRIM_MD.Input caption styling

[pkoopmanpk]

I am looking for a way to change the style of captions on PRIM_MD.Input controls in VLF ONE.

The default style seems to be black (0:0:0) with a 54% transparency, which users find hard to read.

Code: Select all

<div lansahandle="1056" style="... color: rgba(0, 0, 0, 0.54); border-color: rgba(0, 0, 0, 0.12); ...">
<div id="ANALYSID_ID_Text" style="...">Analysis ID</div></div>

The only thing we could find was, changing the font size with #thm.BasePanelBodyStyle.FontSize.

Code: Select all

Begin_Com Role(*EXTENDS #VF_AC033O)

Mthroutine Name(Customize) Options(*REDEFINE)
For Each(#thm) In(#Themes)
* #thm.BaseFormBackgroundandFont.FontSize := 16
#thm.BasePanelBodyStyle.FontSize := 16
Endfor
Endroutine

End_Com

Did someone find a way to change the transparency?

[jyoung]

I would like to know how to do this as well.

I find Theme customization super confusing. Between the ThemeCustomizer(VF_AC033O), VLWeb(PRIM_THM) and the Framework itself, its hard to know which to use and when.

EDIT
You can change the caption color with

capture.png (114.6 KiB) Viewed 14497 times

But I can't figure out how to do it a theme level.

[Donn Delaney]

Hi,

The caption color is applied only when the Input is focused so I don't think will help for this case. The caption color for Inputs currently can not be changed from a Theme.

Looking a bit further it seems the Material Design standards have changed a little. Previously the standard was to use ThemeSecondaryText which is 54% opacity of the TextColor. It now seems that VL Web should be using 60% opacity of the TextColor (https://material.io/design/color/text-l ... ackgrounds)

Maybe this slight darkening is enough to make Captions easier to read?

It is also reasonable that the ThemeSecondaryText can be changed through the Theme and this would allow users to define their own color globally so I suggest you send this to support so it can be fixed\enhanced for the near future.

[MarkD]

VLF-ONE uses ‘extended’ version of the base VL-Web theme.

Some points to (maybe) ease confusion:

• The shipped set of VLF-ONE extended themes is exactly associated the shipped VL-Web set.
So the VLF-ONE theme with symbolic name MATERIALBLUE uses VL-Web’s MaterialDesignBlue theme, the theme with name MATERIALINDIGO uses VL-Web’s MaterialDesignIndigo theme, etc, etc. The VL-Web theme associated with a VLF-ONE extended theme (a VF_SY170O object) can be found in property VLWebApplicationTheme.

• Almost all the control level theming in VLF-ONE based applications comes from the associated VL-Web theme. That means this specific PRIM_MD.Input question is really a general VL-Web question.

• The ‘extended’ part of the VLF-ONE theme is mostly about the color, sizes and spacing used to create higher level compound visual items – things like window menu bars, the movable filter and command handler panes, various borders and edges, how messages are presented, etc. There's also quite a lot of non-visual properties.

• You can create your own custom VLF-ONE extended theme and associate it with a shipped or custom VL-Web theme. To use a custom VL-Web theme you need to set the UseCustomApplicationTheme property in the VLF-ONE extended theme.

• Some potentially useful links:
https://docs.lansa.com/14/en/lansa048/i ... 8_6510.htm
https://docs.lansa.com/14/en/lansa048/i ... 8_6520.htm
https://docs.lansa.com/14/en/lansa048/i ... 8_8345.htm
https://docs.lansa.com/14/en/lansa048/i ... 8_8325.htm

[pkoopmanpk]

Thank you all for your input.

• You can create your own custom VLF-ONE extended theme and associate it with a shipped or custom VL-Web theme. To use a custom VL-Web theme you need to set the UseCustomApplicationTheme property in the VLF-ONE extended theme.

It looks like the caption style settings are hard coded. I couldn't find any way to override it's transparency setting.

[MarkD]

Yes, I think that's what Donn was saying in the his previous post.
It looks like they are locked into the Google Material Design standard.
The standard was very recently changed, possibly because if people having legibility issues like yours.