UI - Popups and Notifications: Difference between revisions
(Created page with "== Overview == A page detailing the different types of Notifications at your disposal, and best practises to ensure they look great in game. For UI Lua API see: [[UI_Lua_API]...") |
|||
(6 intermediate revisions by the same user not shown) | |||
Line 4: | Line 4: | ||
For UI Lua API see: [[UI_Lua_API]] | For UI Lua API see: [[UI_Lua_API]] | ||
== Popup - Progress Bar == | == Hint == | ||
[[File:Hint Example.png|thumb|Hint Example]] | |||
<syntaxhighlight source lang="lua">UI.ShowHint(message, timeout)</syntaxhighlight> | |||
Location: Small text bottom right of screen. | |||
== Notification - Generic == | |||
[[File:Notification Example.png|thumb|Generic and Download Notifications, right of screen.]] | |||
<syntaxhighlight source lang="lua">UI.ShowNotification(NotificationType.generic, header, message, timeout)</syntaxhighlight> | |||
Location: stacks right of screen from top. | |||
== Notification - Download == | |||
<syntaxhighlight source lang="lua">UI.ShowNotification(NotificationType.download, header, message, timeout)</syntaxhighlight> | |||
Location: stacks right of screen from top. | |||
== Popup - Generic == | |||
[[File:Popup.progress.png|thumb|Pop Up with Progress Bar]] | |||
<syntaxhighlight source lang="lua">UI.ShowPopup(PopupType.generic, header, message, timeout)</syntaxhighlight> | |||
Location: Centre of screen | |||
== Popup - With Progress Bar == | |||
<syntaxhighlight source lang="lua">UI.ShowPopup(PopupType.progress, header, message, timeout)</syntaxhighlight> | <syntaxhighlight source lang="lua">UI.ShowPopup(PopupType.progress, header, message, timeout)</syntaxhighlight> | ||
Contains an animating progress bar. | |||
Location: Centre of screen | |||
Use Case: In the Off Grid main campaign, we use these popups to simulate installations and the transmitting of data. | |||
It's a way we like to enrich the lore and world building. | |||
== Popup Menu == | |||
<syntaxhighlight source lang="lua">UI.ShowPopupMenu(table)</syntaxhighlight> | |||
== Modal - Small == | |||
[[File:Modal Example Small.png|thumb|Modal Example Small]] | |||
<syntaxhighlight source lang="lua">modalName = { | |||
messageType = "small", | |||
header = "modal header string", | |||
message = "modal body string", | |||
confirmText = "confirm",</syntaxhighlight> | |||
There are various ways to call a modal, in the example above we are setting the modal up and will later call it with UI.ShowModalMessage(modalName) | |||
== Modal - Large == | |||
PLEASE NOTE: Images added to modals Should be a maximum of '''634 x 356'''. | |||
[[File:Modal Example Large.png|thumb|Modal Example Large]] | |||
<syntaxhighlight source lang="lua">modalName = { | |||
messageType = "large", | |||
header = "modal header string", | |||
message = "modal body string", | |||
imagePath = "img.png" | |||
confirmText = "confirm",</syntaxhighlight> | |||
There are various ways to call a modal, in the example above we are setting the modal up and will later call it with UI.ShowModalMessage(modalName) | |||
To include an image in a large modal you must place it within the Level folder of your project: /Content/Graphics/img.png |
Latest revision as of 14:21, 10 September 2024
Overview
A page detailing the different types of Notifications at your disposal, and best practises to ensure they look great in game.
For UI Lua API see: UI_Lua_API
Hint
UI.ShowHint(message, timeout)
Location: Small text bottom right of screen.
Notification - Generic
UI.ShowNotification(NotificationType.generic, header, message, timeout)
Location: stacks right of screen from top.
Notification - Download
UI.ShowNotification(NotificationType.download, header, message, timeout)
Location: stacks right of screen from top.
Popup - Generic
UI.ShowPopup(PopupType.generic, header, message, timeout)
Location: Centre of screen
Popup - With Progress Bar
UI.ShowPopup(PopupType.progress, header, message, timeout)
Contains an animating progress bar. Location: Centre of screen
Use Case: In the Off Grid main campaign, we use these popups to simulate installations and the transmitting of data.
It's a way we like to enrich the lore and world building.
Popup Menu
UI.ShowPopupMenu(table)
Modal - Small
modalName = { messageType = "small", header = "modal header string", message = "modal body string", confirmText = "confirm",
There are various ways to call a modal, in the example above we are setting the modal up and will later call it with UI.ShowModalMessage(modalName)
Modal - Large
PLEASE NOTE: Images added to modals Should be a maximum of 634 x 356.
modalName = { messageType = "large", header = "modal header string", message = "modal body string", imagePath = "img.png" confirmText = "confirm",
There are various ways to call a modal, in the example above we are setting the modal up and will later call it with UI.ShowModalMessage(modalName)
To include an image in a large modal you must place it within the Level folder of your project: /Content/Graphics/img.png