System Default Images

This Q&A forum allows users to post and respond to "How Do I Do ....." questions. Please do not use to report (suspected) errors - you must use your regional help desk for this. The information contained in this forum has not been validated by LANSA and, as such, LANSA cannot guarantee the accuracy of the information.
Post Reply
dhunt
Posts: 31
Joined: Fri Feb 08, 2019 3:06 am

System Default Images

Post by dhunt » Wed Jun 26, 2019 1:48 am

How do i change the default images below?

Can i use:

#CustomTheme.AddImageName Usesymbolicname(EXPAND_DOWN) Actualimagename("fa-chevron-down")
Annotation 2019-06-20 154701.jpg
Annotation 2019-06-20 154701.jpg (900 Bytes) Viewed 254 times
Annotation 2019-06-20 154825.jpg
Annotation 2019-06-20 154825.jpg (882 Bytes) Viewed 254 times
Annotation 2019-06-25 105329.jpg
Annotation 2019-06-25 105329.jpg (1.52 KiB) Viewed 254 times

MarkD
Posts: 606
Joined: Wed Dec 02, 2015 9:56 am

Re: System Default Images

Post by MarkD » Thu Jun 27, 2019 9:15 am

Yes,

As at EPC142057 level all VLF-ONE all theme objects, whether shipped, or created as custom, start with this base set of symbolic image names:

Code: Select all

If (#uSystem.UIMaterialDesign)
#COM_OWNER.AddImageName Usesymbolicname(CLOSE) Actualimagename("close") Actualimagesource(G)
#COM_OWNER.AddImageName Usesymbolicname(UP_ARROW) Actualimagename("arrow_upward") Actualimagesource(G)
#COM_OWNER.AddImageName Usesymbolicname(DOWN_ARROW) Actualimagename("arrow_downward") Actualimagesource(G)
#COM_OWNER.AddImageName Usesymbolicname(LEFT) Actualimagename("arrow_back") Actualimagesource(G)
#COM_OWNER.AddImageName Usesymbolicname(RIGHT) Actualimagename("arrow_forward") Actualimagesource(G)
Else
#COM_OWNER.AddImageName Usesymbolicname(CLOSE) Actualimagename(CLOSE_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(UP_ARROW) Actualimagename(go_up_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(DOWN_ARROW) Actualimagename(go_down_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(LEFT) Actualimagename(GO_LEFT_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(RIGHT) Actualimagename(GO_RIGHT_Outline.png)
Endif

#COM_OWNER.AddImageName Usesymbolicname(MAXIMIZE) Actualimagename(MAXIMIZE_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(MINIMIZE) Actualimagename(MINIMIZE_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(SETTINGS) Actualimagename("settings") Actualimagesource(G) /* Google - so case sensitive */
#COM_OWNER.AddImageName Usesymbolicname(PIN) Actualimagename(PIN_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(RESTORE) Actualimagename(RESTORE_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(LEFTCIRCLED) Actualimagename(left_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(RIGHTCIRCLED) Actualimagename(right_outline.png)

#COM_OWNER.AddImageName Usesymbolicname(UP) Actualimagename(GO_UP_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(DOWN) Actualimagename(GO_DOWN_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(WIDTH) Actualimagename(horizontal_double_headed_arrow_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(HEIGHT) Actualimagename(vertical_double_headed_arrow_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(MORE) Actualimagename(MORE_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(ARRANGE) Actualimagename("menu") Actualimagesource(G) /* Google - so case sensitive */
#COM_OWNER.AddImageName Usesymbolicname(HELP) Actualimagename("help") Actualimagesource(G) /* Google - so case sensitive */

#COM_OWNER.AddImageName Usesymbolicname(DATE) Actualimagename(DATE_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(TIME) Actualimagename(TIME_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(USER) Actualimagename(USER_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(LANGUAGE) Actualimagename(LANGUAGE_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(TICK) Actualimagename(GO_TICK_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(CROSS) Actualimagename(CROSS_Outline.png)
#COM_OWNER.AddImageName Usesymbolicname(LIST) Actualimagename(LIST_Outline.png)

#COM_OWNER.AddImageName Usesymbolicname(MOREDETAILS) Actualimagename(more_details_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(LESSDETAILS) Actualimagename(less_details_outline.png)

#COM_OWNER.AddImageName Usesymbolicname(COLLAPSE_UP) Actualimagename(collapse_up_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(EXPAND_DOWN) Actualimagename(expand_down_outline.png)

#COM_OWNER.AddImageName Usesymbolicname(SORT) Actualimagename(sort_outline.png)

#COM_OWNER.AddImageName Usesymbolicname(ASCEND_ORDER) Actualimagename(ascending_order_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(DESCEND_ORDER) Actualimagename(descending_order_outline.png)
*
* originally view_column_google.png. but this does not work
#COM_OWNER.AddImageName Usesymbolicname(VIEW_COLUMN) Actualimagename(organize_outline.png)


#COM_OWNER.AddImageName Usesymbolicname(add) Actualimagename(add_outline.png)
#COM_OWNER.AddImageName Usesymbolicname(cancel) Actualimagename(cancel_outline.png)


#COM_OWNER.AddImageName Usesymbolicname(TREE_EXPAND) Actualimagename(expand_outlined.png)
#COM_OWNER.AddImageName Usesymbolicname(TREE_CONTRACT) Actualimagename(contract_set_outlined.png)

#COM_OWNER.AddImageName Usesymbolicname(SEARCH_FILLED) Actualimagename(search.png)
#COM_OWNER.AddImageName Usesymbolicname(CLOSE_FILLED) Actualimagename(close.png)

#COM_OWNER.AddImageName Usesymbolicname(EYE) Actualimagename(VISIBILITY_GOOGLE.PNG)

#COM_OWNER.AddImageName Usesymbolicname(ARROWALLDIRECTION) Actualimagename(OPEN_WITH_GOOGLE.PNG)

#COM_OWNER.AddImageName Usesymbolicname(MOREVERTICAL) Actualimagename("more_vert") Actualimagesource(G) /* Google - so case sensitive */
#COM_OWNER.AddImageName Usesymbolicname(MOREHORIZONTAL) Actualimagename("more_horiz") Actualimagesource(G) /* Google - so case sensitive */
#COM_OWNER.AddImageName Usesymbolicname(SEARCH) Actualimagename("search") Actualimagesource(G) /* Google - so case sensitive */

#COM_OWNER.AddImageName Usesymbolicname(THEME) Actualimagename("style") Actualimagesource(G) /* Google - so case sensitive */

#COM_OWNER.AddImageName Usesymbolicname(chevron_left) Actualimagename("chevron_left") Actualimagesource(G) /* Google - so case sensitive */
#COM_OWNER.AddImageName Usesymbolicname(chevron_right) Actualimagename("chevron_right") Actualimagesource(G) /* Google - so case sensitive */

#COM_OWNER.AddImageName Usesymbolicname(chevron-down) Actualimagename("expand_down_outline.png")
#COM_OWNER.AddImageName Usesymbolicname(chevron-right) Actualimagename("expand_outline.png")
#COM_OWNER.AddImageName Usesymbolicname(chevron-left) Actualimagename("collapse_outline.png")
#COM_OWNER.AddImageName Usesymbolicname(chevron-up) Actualimagename("collapse_up_outline.png")
So you can override / replace any of these as you like.

The issue may be that you cannot tell which symbolic name is used where - in which case ask on this forum.

dhunt
Posts: 31
Joined: Fri Feb 08, 2019 3:06 am

Re: System Default Images

Post by dhunt » Fri Jun 28, 2019 2:52 am

which one is for the top slider and left slider?

MarkD
Posts: 606
Joined: Wed Dec 02, 2015 9:56 am

Re: System Default Images

Post by MarkD » Fri Jun 28, 2019 9:50 am

If you mean something that has ancestor VF_AC028O, then they don't use those generic symbolic image names.

Each slider specifies its own images directly via properties named:

Code: Select all

Define_Pty Name(uCloseIconName) Get(Get_uCloseIconName)
Define_Pty Name(uDockIconName) Get(Get_uDockIconName)
Define_Pty Name(uImageName) Get(Get_uImageName)

By default the property getter routines do this, based on the slider's location:

Code: Select all

* ---------------------------------------------------------------------------------
Ptyroutine Name(Get_uCloseIconName)
Define_Map For(*OUTPUT) Class(#VF_ELSYMNAME) Name(#ReturnIconName)
Case (#AttachedtoEdge)
When (= TOP)
#ReturnIconName := up_arrow_Outline.png
When (= BOTTOM)
#ReturnIconName := down-arrow_Outline.png
When (= LEFT)
#ReturnIconName := left_Outline.png
When (= RIGHT)
#ReturnIconName := right_Outline.png
Otherwise
#ReturnIconName := Unknown
Endcase

Endroutine

* ---------------------------------------------------------------------------------
Ptyroutine Name(Get_uDockIconName)
Define_Map For(*OUTPUT) Class(#VF_ELSYMNAME) Name(#ReturnIconName)

#ReturnIconName := pin_outline.png

Endroutine


* ---------------------------------------------------------------------------------
Ptyroutine Name(Get_uImageName)
Define_Map For(*OUTPUT) Class(#VF_ELSYMNAME) Name(#ReturnImageName)

Case (#AttachedtoEdge)
When (= TOP)
#ReturnImageName := expand_down_Outline.png
When (= BOTTOM)
#ReturnImageName := collapse_up_Outline.png
When (= LEFT)
#ReturnImageName := expand_Outline.png
When (= RIGHT)
#ReturnImageName := collapse_Outline.png
Otherwise
#ReturnImageName := Unknown
Endcase

Endroutine
So in your slider you just *REDEFINE the property getter routine to return whatever image name you want to use.

Something like this:

Code: Select all

Begin_Com Role(*EXTENDS #VF_ac028O)

Ptyroutine Name(Get_uImageName) Options(*REDEFINE)
#RETURNIMAGENAME := "MYIMAGE.png"
Endroutine

End_Com

dhunt
Posts: 31
Joined: Fri Feb 08, 2019 3:06 am

Re: System Default Images

Post by dhunt » Sat Jun 29, 2019 1:16 am

Thats perfect but how do i use the font awesome or material design images with it?

Like this: #ReturnImageName := fa-chevron-down ?

MarkD
Posts: 606
Joined: Wed Dec 02, 2015 9:56 am

Re: System Default Images

Post by MarkD » Sat Jun 29, 2019 10:25 am

There's an additional property:

Code: Select all

Define_Pty Name(uImageSource) Get(Get_uImageSource)
 
Ptyroutine Name(Get_uImageSource)
Define_Map For(*OUTPUT) Class(#VF_ELStat) Name(#ReturnImageSource)

#ReturnImageSource := T

Endroutine
Where T= Themed image - the ones that ship with VLF-ONE.

Redefine that to return G (Google material design) or F (Font Awesome).

This means all 3 images must come from Themed, Google or Font Awesome - you can't mix them up.

Also, Google and Font Awesome names are case sensitive so they normally need to be quoted.

dhunt
Posts: 31
Joined: Fri Feb 08, 2019 3:06 am

Re: System Default Images

Post by dhunt » Tue Jul 02, 2019 7:08 am

Thanks Mark, worked great but when i used F it didn't show the icons. if i used G it does for font awesome icons.

MarkD
Posts: 606
Joined: Wed Dec 02, 2015 9:56 am

Re: System Default Images

Post by MarkD » Tue Jul 02, 2019 8:35 am

Are you using names prefixed "fa-xxxxxxxxxxx".

If yes, try removing the "fa-" prefix.

e.g. #ReturnImageName := "fa-chevron-down" becomes #ReturnImageName := "chevron-down"

Post Reply