Difference between revisions of "UI Buttons"

From GiderosMobile
 
(12 intermediate revisions by the same user not shown)
Line 3: Line 3:
 
Here you will find various resources to help you create buttons in Gideros Studio.
 
Here you will find various resources to help you create buttons in Gideros Studio.
  
'''note''': you may have to provide your own assets (fonts, gfx, …).
+
'''DESKTOPS, MOBILE & HTML5 COMPATIBLE THEY ARE!'''
  
'''note2''':
+
'''note''': you may have to provide your own assets (fonts, gfx, …)
* '''P''' = button with a Pixel
 
* '''I''' = button with an Image
 
* '''T''' = button with a Text
 
* '''T''' = button with a tooltip
 
* '''U''' = button Up state
 
* '''D''' = button Down state
 
* '''D''' = button Disabled state
 
* '''H''' = button Hover
 
  
=== Button: Simple ===
+
=== Button '''[[Button_class]]''' ===
Please follow this link: '''[[simple_button_class]]'''
+
This is the base of all Gideros buttons.
  
=== Button: Simple with Up, Down and Disabled state (UDD) ===
+
{{#widget:GApp|app=ButtonDemo1.GApp|width=300|height=180}}
Please follow this link: '''[[simple_buttonudd_class]]'''
 
  
=== Button: Text ===
 
Please follow this link: '''[[button_text_class]]'''
 
  
=== Button: Toggle ===
+
=== Button Text '''[[ButtonText_class]]''' ===
Please follow this link: '''[[ButtonToggle_class]]'''
+
This is almost the same as '''Button''' but with some text you can add.
  
=== Button: Hover Image Text ===
 
Please follow this link: '''[[button_hover_image_text_class]]'''
 
  
=== Button: Image Text HUDD ===
+
=== Button Disabled '''[[ButtonDisabled_class]]''' ===
Please follow this link: '''[[button_image_text_HUDD_class]]'''
+
This is the same as '''Button''' but with a Disabled state.
  
=== Button: Pixel Image Text Tooltip Up Down Disabled Hover (PITTUDDH) ===
+
{{#widget:GApp|app=ButtonDisabledDemo1.GApp|width=300|height=180}}
Please follow this link: '''[[ButtonPITTUDDH_class]]'''
+
 
 +
 
 +
=== Button Toggle '''[[ButtonToggle_class]]''' ===
 +
A button you can toggle on and off.
 +
 
 +
{{#widget:GApp|app=ButtonToggleDemo1.GApp|width=320|height=180}}
 +
 
 +
 
 +
=== Button Monster '''[[ButtonMonster_class]]''' ===
 +
This button has a lot: mouse and keyboard navigation, hover, tooltip, sound, ... It may look scary but it is a nice monster ;-)
 +
 
 +
{{#widget:GApp|app=ButtonMonsterDemo2x.GApp|width=320|height=180}}
 +
 
 +
 
 +
=== Button Beast '''[[ButtonBeast_class]]''' ===
 +
This is like the '''Button Monster''' but without tooltip and without integrated keyboard navigation.
 +
 
 +
{{#widget:GApp|app=ButtonBeastDemo1.GApp|width=320|height=180}}
  
  
 
{{GIDEROS IMPORTANT LINKS}}
 
{{GIDEROS IMPORTANT LINKS}}

Latest revision as of 19:44, 1 December 2023

Here you will find various resources to help you create buttons in Gideros Studio.

DESKTOPS, MOBILE & HTML5 COMPATIBLE THEY ARE!

note: you may have to provide your own assets (fonts, gfx, …)

Button Button_class

This is the base of all Gideros buttons.


Button Text ButtonText_class

This is almost the same as Button but with some text you can add.


Button Disabled ButtonDisabled_class

This is the same as Button but with a Disabled state.


Button Toggle ButtonToggle_class

A button you can toggle on and off.


Button Monster ButtonMonster_class

This button has a lot: mouse and keyboard navigation, hover, tooltip, sound, ... It may look scary but it is a nice monster ;-)


Button Beast ButtonBeast_class

This is like the Button Monster but without tooltip and without integrated keyboard navigation.