Difference between revisions of "UI Buttons"

From GiderosMobile
 
(4 intermediate revisions by the same user not shown)
Line 2: Line 2:
  
 
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.
 +
 +
'''DESKTOPS, MOBILE & HTML5 COMPATIBLE THEY ARE!'''
  
 
'''note''': you may have to provide your own assets (fonts, gfx, …)
 
'''note''': you may have to provide your own assets (fonts, gfx, …)
  
'''desktops, mobiles and web compatible!'''
+
=== Button '''[[Button_class]]''' ===
 +
This is the base of all Gideros buttons.
  
=== Button ===
+
{{#widget:GApp|app=ButtonDemo1.GApp|width=300|height=180}}
'''[[Button_class]]'''
 
  
This is the base of all Gideros buttons.
 
  
{{#widget:GApp|app=ButtonDemo1.GApp|width=480|height=320}}
+
=== Button Text '''[[ButtonText_class]]''' ===
 +
This is almost the same as '''Button''' but with some text you can add.
  
=== Button: Toggle ===
 
'''[[ButtonToggle_class]]'''
 
  
A button you can toggle on and off.
+
=== Button Disabled '''[[ButtonDisabled_class]]''' ===
 +
This is the same as '''Button''' but with a Disabled state.
  
{{#widget:GApp|app=ButtonToggleDemo1.GApp|width=480|height=320}}
+
{{#widget:GApp|app=ButtonDisabledDemo1.GApp|width=300|height=180}}
  
=== Button Monster ===
 
'''[[ButtonMonster_class]]'''
 
'''PS: need Gideros ''luashader'' Library for now'''
 
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=480|height=320}}
+
=== Button Toggle '''[[ButtonToggle_class]]''' ===
 +
A button you can toggle on and off.
  
=== Button Beast ===
+
{{#widget:GApp|app=ButtonToggleDemo1.GApp|width=320|height=180}}
'''[[ButtonBeast_class]]'''
 
'''PS: need Gideros ''luashader'' Library for now'''
 
This is like the ButtonMonster but without tooltip and without integrated keyboard navigation.
 
  
{{#widget:GApp|app=ButtonBeastDemo1.GApp|width=480|height=320}}
 
  
=== Button: Disabled ===
+
=== Button Monster '''[[ButtonMonster_class]]''' ===
'''[[ButtonDisabled_class]]'''
+
This button has a lot: mouse and keyboard navigation, hover, tooltip, sound, ... It may look scary but it is a nice monster ;-)
 
 
This is the same as '''Button''' but with a Disabled state.
 
  
=== Button: Text ===
+
{{#widget:GApp|app=ButtonMonsterDemo2x.GApp|width=320|height=180}}
Please follow this link: '''[[button_text_class]]'''
 
  
=== Button: Hover Image Text ===
 
Please follow this link: '''[[button_hover_image_text_class]]'''
 
  
=== Button: Image Text HUDD ===
+
=== Button Beast '''[[ButtonBeast_class]]''' ===
Please follow this link: '''[[button_image_text_HUDD_class]]'''
+
This is like the '''Button Monster''' but without tooltip and without integrated keyboard navigation.
  
=== Button: Pixel Image Text Tooltip Up Down Disabled Hover (PITTUDDH) ===
+
{{#widget:GApp|app=ButtonBeastDemo1.GApp|width=320|height=180}}
Please follow this link: '''[[ButtonPITTUDDH_class]]'''
 
  
  
 
{{GIDEROS IMPORTANT LINKS}}
 
{{GIDEROS IMPORTANT LINKS}}

Latest revision as of 20: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.