Ui System

UI System?

No, it's not a replacement for Unity's native UI systems. There are enough of those already!

It's a way to have click/touch and hover type interactions with on-screen TPT tiles and can be used to add interactivity to tiles. But there's no UI builder - you have to lay out and configure everything manually.

Generally, you create a UI-Capable tile by implementing the ITpUiControl interface. However, it's recommended that you try to use the suppled UI tile varieties if possible or use those as base classes.

The tiles are controlled by messages: the easiest way to use this is to use the TpInputActionToTile component.

ItpUiControl has two main functions:

Setting values is done with one method implementation: SetValue(object value, bool withNotify = true)

You convert the object into whatever your tile requires.

Getting values is done with several implementations for various formats: int, bool, object, string, or Char.

A control can use the AcceptsClicks and AcceptsHover to control what sort of messages it gets.

For example, a control that normally accepts clicks can temporarily return false from the AcceptsClicks property if it is still executing an effect such as a tween which hasn't completed yet. A second click can be inhibited until the effect is complete.

AcceptsHover should only be true if you want to get Hover messages: these are very frequent since they're continually sent while the mouse or other pointer is moving.

SupportedEffects returns a flags enum that specifies various types of effects such as BumpSize, BumpColor, etc. Return a value which describes which effects your tile actually implements.

RunEffect is used to execute an effect. You can add duration, Vector3, and/or Color endpoint values to use for tweening or color changes.

UI Tiles

UiButton

This is the simplest UI element, implementing a momentary button.

UiAnimButton

This hoverable button animates when hovered or clicked.

UiToggleButton

This implements a toggle button.

UiRadioButton

This implements a Radio button and a Radio Button Set. Use Tags or the Zone to create a Radio Button Set.

UiHoverZone

This implements a hoverable but not clickable zone. It does nothing on its own.

An example can be see in the TileUi demo: the unwieldly-named UiHoverTileZoneToPromptString_TileZoneAction : TpTileZoneAction pokes a tooltip to an array of ascii characters when a UiPromptHoverZone (subclass of UiHoverZone) area is hovered-over.

UiAsciiChar

This implements display of a single, non-editable, ASCII character from a sprite set.

Normally you'd only care about the character value and you'd be inputting characters to SetValue and returning them (probably never need to) from GetCharValue.

But what if you want a string? That's next.

UiAsciiString

Similar to UiHoverZone, this doesn't do anything visual. You use the Zone Editing feature of all TilePlus tiles to set up a zone which includes any number of UiAsciiChar tiles with optional simple justification and wrapping. You write a string to the UiAsciiString tile and it distributes it to the Char tiles.

This tile is only a zone. Arrange a seres of UiAsciiCharTiles in a rectangular array (1 col and N rows, or 1 row and N columns or N columns and M rows) and add a UiAsciiStringTile.

Using the AsciiStringTile's Zone controls, draw a zone around the array of AsciiCharTiles. This is easy to do using Painter or Tile+Brush.

Now the AsciiStringTile is a controller for all of the AsciiChar tiles.

At runtime, write strings to the AsciiStringTile and it'll treat the AsciiCharTiles as a group and place the string characters in the proper locations, with simple left, center, or right justification.

The array of tiles can be a horizontal row, a vertical column, or a box.

This tile assumes that the ASCII char tiles are on the same tilemap.

ITpUiControl


public interface ITpUiControl                                                    
{                                                                                
    /// <summary>                                                                
    /// Set c# object Value                                                      
    /// </summary>                                                               
    /// <param name="value">c# object (or boxed UnityEngine.Object) value</param>
    /// <param name="withNotify">permit notification if appropriate</param>      
    void SetValue(object value, bool withNotify = true);                         
                                                                                 
    /// <summary>                                                                
    /// Run an effect on the control, if implemented                             
    /// </summary>                                                               
    /// <param name="effectType">Value from UiEffect enum</param>                
    /// <param name="duration">duration of the effect.</param>                   
    /// <param name = "endPoint" >endpoint for V3 type effects</param>           
    /// <param name = "endColor" >endpoint for Color type effects</param>        
    /// <returns>false if unimplemented.</returns>                               
    bool RunEffect(UiEffect effectType,                                          
                   float    duration,                                            
                   Vector3? endPoint = null,                                     
                   Color?   endColor = null);                                    
                                                                                 
    /// <summary>                                                                
    /// Returns a value from the FLAGS enum UiEffect,                            
    /// shows the controls effect capabilities.                                  
    /// </summary>                                                               
    UiEffect SupportedEffects { get; }                                           
                                                                                 
    /// <summary>                                                                
    /// Get integer Value                                                        
    /// </summary>                                                               
    int GetIntValue { get; }                                                     
                                                                                 
    /// <summary>                                                                
    /// Get bool Value                                                           
    /// </summary>                                                               
    bool GetBoolValue { get; }                                                   
                                                                                 
    /// <summary>                                                                
    /// Get c# object Value                                                      
    /// </summary>                                                               
    object GetValue { get; }                                                     
                                                                                 
    /// <summary>                                                                
    /// Get string value                                                         
    /// </summary>                                                               
    string GetStringValue { get; }                                               
                                                                                 
    /// <summary>                                                                
    /// Get value as a character.                                                
    /// </summary>                                                               
    char GetCharValue { get; }                                                   
                                                                                 
    /// <summary>                                                                
    /// Does this tile accept clicks?                                            
    /// </summary>                                                               
    bool AcceptsClicks { get; }                                                  
                                                                                 
    /// <summary>                                                                
    /// Does this tile accept hover?                                             
    /// </summary>                                                               
    bool AcceptsHover { get; }                                                   
                                                                                 
                                                                                 
}