Four Js Development Tools Forum

Discussions by product => Genero BDL => Topic started by: Nuno T. on February 22, 2018, 10:35:56 pm



Title: Background image
Post by: Nuno T. on February 22, 2018, 10:35:56 pm
Hi all,

Is there a way to define an image in background window, layout grid ...

And in a button its possible to put an image in top and text in bottom  ?


Thanks very mutch in adance.
Nuno


Title: Re: Background image
Post by: Reuben B. on February 23, 2018, 12:09:08 am
I'll pre-empt by saying we can only do what the native front-end allows.  So if the native front-end doesn't allow it, then we can't do it either using native widgets.

Quote
Is there a way to define an image in background window, layout grid ...
With regards backgroundImages, this was deprecated in version 2.50 http://4js.com/online_documentation/fjs-fgl-manual-html/#fgl-topics/c_fgl_Migrate_to_250_presentation_styles.html, prior to that the documentation had an entry in common style attributes for backgroundImage http://4js.com/online_documentation/fjs-fgl-manual-html/#fgl-topics/r_fgl_presentation_styles_common_style_attributes.html after backgroundColor, and if you look up 2.40 documentation or earlier it will be there.

You may find that the deprecated behaviour is still there and functional, a quick test with
Code
  1. <Style name="*">
  2.      <StyleAttribute name="backgroundImage" value="http://4js.com/wp-content/uploads/2015/05/logo_4Js_2014_CMYK_seul-300x92.png" />
  3.  </Style>
will show you where it applies (replace * with Window, Grid, Edit, or style selector etc to narrow down), but like any deprecated behaviour it is a case of use at your own risk.  You may find that what works with Windows does not work with Mac, or a Windows update might stop it working etc.

For GBC, you can always use customisation with CSS and background-image property.


Quote
And in a button its possible to put an image in top and text in bottom  ?

Does the native UI allow this?  if it allows this consistently across the front-ends we support, expect to see a value here http://4js.com/online_documentation/fjs-fgl-manual-html/#fgl-topics/r_fgl_presentation_styles_button_style_attributes.html

If you want non-native buttons, then what you can do is use Clickable Images, an IMAGE with an ACTION attribute (some examples https://github.com/FourjsGenero/ex_clickable_image)

Hope that helps,

Reuben