ORK Framework Logo - RPG Editor for Unity
  • Features
  • Showcase
  • Guide
    • Documentation
    • Tutorials
    • API
  • ORK 2
    • Tutorials
    • Plugins
    • API
  • Support
  • Forum
  • Get ORK

2D RPG Quickstart

  • START 2D RPG Quickstart
  • 01 Initial Setup
  • 02 Player Setup
  • 03 Music & Scenes
  • 04 UI System Setup
  • 05 UI Boxes
  • 06 Flying Texts
  • 07 Status Values
  • 08 Status Effects
  • 09 First Abilities
  • 10 Fighter Setup
  • 11 First Enemies & Battle AI
  • 12 Battle System Setup
  • 13 Animating Battle Start and End
  • 14 Random Battles
  • 15 Animating Actions
  • 16 Player Battle HUD
  • 17 Elemental Attacks
  • 18 Animating More Actions
  • 19 Inventory & Loot
  • 20 Equipment
  • 21 Loot, Start Equipment & Viewers
  • 22 Magic Abilities
  • 23 Caster Setup
  • 24 More Enemies
  • 25 Start Menu & Save Games
  • 26 Menu Screens
  • 27 Interactions
  • 28 Item Collectors
  • END 2D RPG Quickstart

3D RPG Quickstart

  • START 3D RPG Quickstart
  • 01 Initial Setup
  • 02 Player Setup
  • 03 Music & Scenes
  • 04 UI System Setup
  • 05 UI Boxes
  • 06 Flying Texts
  • 07 Status Values
  • 08 Status Effects
  • 09 First Abilities
  • 10 Fighter Setup
  • 11 First Enemies & Battle AI
  • 12 Battle System Setup
  • 13 Animating Battle Start and End
  • 14 Random Battles
  • 15 Animating Actions
  • 16 Player Battle HUD
  • 17 Elemental Attacks
  • 18 Animating More Actions
  • 19 Inventory & Loot
  • 20 Equipment
  • 21 Loot, Start Equipment & Viewers
  • 22 Magic Abilities
  • 23 Caster Setup
  • 24 More Enemies
  • 25 Start Menu & Save Games
  • 26 Menu Screens
  • 27 Interactions
  • 28 Item Collectors
  • END 3D RPG Quickstart

Status System Setup

  • START Status System Setup
  • 01 Status Values
  • 02 Status Development
  • 03 Attack/Defence Modifiers
  • 04 Status Effects
  • 05 Formulas
  • 06 Ability & Item Types
  • 07 Abilities Part 1: Attacks
  • 08 Abilities Part 2: Support & Sabotage
  • 09 Abilities Part 3: Elemental Magic
  • 10 Items
  • 11 Equipment Part 1: Slots & Slot Set Templates
  • 12 Equipment Part 2: Weapons
  • 12.5 (Optional) Equipment Part 2.5: Weapons
  • 13 Equipment Part 3: Shields, Armor & Accessories
  • 13.5 (Optional) Equipment Part 3.5: Shields, Armor & Accessories
  • 14 Equipment Part 4: Available Equipment Templates
  • 15 Loot
  • 16 Battle AIs
  • 17 Combatants Part 1: General Settings
  • 18 Combatants Part 2: Players
  • 19 Combatants Part 3: Enemies
  • 20 Combatant Groups
  • END Status System Setup

3D RPG Playground

  • START 3D RPG Playground
  • 01 Player Setup
  • 02 Start Menu
  • 03 First Interaction
  • 04 Music
  • 05 Areas
  • 06 Collecting Items
  • 07 Displaying Equipment
  • 08 Combatant Prefabs, Icons & Portraits
  • 09 Combatant Animations
  • 10 Camera Positions
  • ANIM 01 Battle Start/End Schematics
  • ANIM 02 Use, Cast & Camera
  • ANIM 03 Abilities & Items
  • ANIM 04 Physical Attacks
  • ANIM 05 Special Actions
  • BATTLE 01 Battle Menu
  • BATTLE 02 Prepare for Battle
  • TURN 01 Turn Based Setup
  • TURN 02 Turn Order HUD
  • ATB 01 Active Time Setup
  • ATB 02 Cast Times
  • ATB 03 Timebar HUD
  • BATTLE 03 The First Battle
  • BATTLE 04 Hunting Move AI
  • BATTLE 05 Spawning Combatants
  • 11 Save Games
  • MENU 01 UI Boxes
  • MENU 02 Template HUDs
  • MENU 03 Overview Menu
  • MENU 04 Menu Screens
  • 12 Shop
  • BATTLE 06 Random Battles
  • DUNGEON 01 Enter the Dungeon
  • DUNGEON 02 The Trapdoor
  • DUNGEON 03 Enemies on Level 1 & 2
  • DUNGEON 04 Traps on Level 3
  • DUNGEON 05 Going Deeper
  • 13 Bestiary (+MENU+ANIM)
  • QUEST 01 Hunting Quests (+MENU)
  • QUEST 02 Guard NPC
  • QUEST 03 Forest Ruin Cheese
  • QUEST 04 Witch NPC with Cheese
  • QUEST 05 Quest Mark HUDs
  • 14 Research Trees (+MENU)
  • CRAFT 01 Crafting Materials
  • CRAFT 02 Crafting Recipes
  • CRAFT 03 Crafting Menu
  • CRAFT 04 Crafting Proficiency & Critical Crafting
  • CRAFT 05 Materials Loot
  • 15 Changing Choice Dialogue
  • 16 Follow Me!
  • BATTLE 07 Sequence Loot Dialogue

3D Action RPG

  • START 3D Action RPG
  • 01 Status System Setup
  • 02 Player Setup
  • 03 Player Weapon
  • 04 Player Attacks
  • 05 Enemy: Chomper
  • 06 Chomper Attack
  • 07 Hit & Death
  • 08 HUDs
  • 09 Rolling on the Floor
  • 10 Enemy: Spitter
  • 11 Spit Attack
  • 12 Potion
  • 13 Grenade
  • 14 Item HUD
  • 15 Enemy: Grenadier
  • 16 Grenadier Melee Attacks
  • 17 Grenadier Flamethrower
  • 18 Item Drops
  • END 3D Action RPG

2D Grid Battle RPG

  • START 2D Grid Battle RPG
  • 01 Player Setup
  • 02 Prefab & Music Setup
  • 03 Randomizing Combatants
  • 04 UI Setup
  • 05 Battle Start, End & Phase Schematics
  • 06 Battle System Setup
  • 07 Battle Grid Setup
  • 08 Grid Move
  • 09 Forest Battle Grid
  • 10 Battle AI
  • 11 Ability Ranges
  • 12 Death & Use Schematics
  • 13 Attack Schematic
  • 14 Shoot Schematics
  • 15 Battle Selection Interaction
  • END 2D Grid Battle RPG

Schematics

  • Simple Start Schematic
  • Battle Start Schematic
  • Battle End Schematic
  • Moving to Target and Back
  • Animating a Base Attack
  • Animating a Magic Ability
  • Grid Movement
  • Open and Close UI Animations
  • Flying Text Mover

UI Setups

  • Unity UI: Initial Setup
  • Unity UI: TextMesh Pro Setup
  • Unity UI: UI Box
  • Unity UI: Flying Text
  • Unity UI: Dragging Notification
  • Unity UI: Canvas with Screen Space Camera
  • Unity UI: Interaction HUD
  • Unity UI: Simple Player HUD
  • Unity UI: Quest HUD
  • Unity UI: Shortcuts HUD
  • Unity UI: Currency HUD
  • Unity UI: Tooltip HUD
  • Unity UI: Control HUD
  • Unity UI: Attack Modifiers
  • Unity UI: Defence Modifiers

Gameplay Bits

  • Combining Input Origins
  • Combining Status Value Flying Texts
  • Fun With Flying Text
  • HUD Effects With Conditional Schematics
  • Inventory Containers
  • Multi Interaction Controllers
  • World Space HUD
  • World Space Dialogue
  • Home
  • Guide
  • Tutorials
  • 3D RPG Quickstart
  • 06 Flying Texts

06 Flying Texts

Table of Contents
  • Flying Text Prefab
    • Horizontal Layout Group
    • Content Size Fitter
    • Image Size
    • Fitting the Text
    • Create Prefab
  • Flying Text Mover Schematic
    • Change UI Offset
    • Change UI Color
    • Wait
    • Change UI Color
  • Flying Text Setup
    • Flying Text Settings
      • Default Flying Text Positions
    • Save Changes

In this tutorial we’ll set up a flying text prefab.

Flying texts are used to display things like damage numbers or other status changes on screen, at the position of the combatant they affect.

You can learn more about them in this Makinom documentation. You can also find a more detailed tutorial on flying texts here.

We’ll set up:

  • flying text prefab
  • flying text mover schematic
  • default flying text settings

Let’s get to it!

Flying Text Prefab #

As before, we can create a ready-to-use setup using the scene hierarchy’s context menu: Makinum > UI > Flying Text (Sprite + TextMeshPro)

This creates a simple flying text game object with an icon and text, horizontally arranged.

Horizontal Layout Group #

With the root Flying Text game object selected, we’ll adjust some layout settings in the Horizontal Layout Group component.

  • Padding
    Set to Left=0, Right=0, Top=0, Bottom=0.

Content Size Fitter #

We’ll adjust the width of the flying text to the displayed content to keep it centered.

Add a Content Size Fitter component to the Flying Text game object using the component menu.

  • Horizontal Fit
    Select Preferred Size.

Image Size #

Select the Flying Text > Image child object, we’ll change the size of the Rect Transform to better fith with the text.

  • Width
    Set to 50.
  • Height
    Set to 50.

Fitting the Text #

Next, select the Flying Text > Text child object, we also need a Content Size Fitter component on the text to make it adjust it’s size.

Add a Content Size Fitter component using the component menu.

  • Horizontal Fit
    Select Preferred Size.
  • Vertical Fit
    Select Preferred Size.

Create Prefab #

Create a prefab out of the Flying Text game object by dragging it into the project view.

Remove the game object from the canvas.

Flying Text Mover Schematic #

Like with the UI boxes, we’ll use a schematic to animate flying texts. You can also check out more detailed tutorials with different setups and downloadable schematics here.

As before, the flying text is available using local selected data via the selected key ui.

Open the Makinom editor and navigate to Schematics. We’ll move the flying text upwards, fade it in and fade it out after some time.

Change UI Offset #

Add Node > UI > Change UI Offset

This node is used to set or fade the offset of UI elements (e.g. flying texts, UI boxes or HUDs).

We’ll move it upwards in screen space and continue the schematic without waiting for the movement to finish – i.e. the move will happen in the background while we use other nodes.

  • Vector 3 Type (Offset)
    Select Value > Value.
  • Value (Offset)
    Set to X=0, Y=100, Z=0.
  • Fade
    Enable this setting.
  • Wait
    Disable this setting.
  • Time
    Select Value > Value.
    Set the value to 3.
  • Interpolation
    Select Linear.
  • Data Key
    Set to ui.
  • Data Origin
    Select Local.

Change UI Color #

Add Node > UI > Change UI Color

We’ll do a short fade in (alpha value), but without waiting for it.

  • Fade
    Select Fade.
  • Wait
    Disable this setting.
  • Time
    Select Value > Value.
    Set the value to 0.25.
  • Interpolation
    Select Linear.
  • Fade Alpha
    Enable this setting.
  • Fade Red/Gree/Blue
    Disable these settings.
  • Start Color
    Select a color with no alpha value (A=0).
  • End Color
    Select a color with full alpha value (A=255 or 1, depending on your color picker).
  • Data Key
    Set to ui.
  • Data Origin
    Select Local.

Wait #

Add Node > Base > Wait

We’ll now wait – in total we want the flying text to be visible for 3 seconds (matching the movement), but we also need some time to fade out the text.

  • Time
    Select Value > Value.
    Set the value to 2.75.

Change UI Color #

Add Node > UI > Change UI Color

Just like before, but with reversed colors. Best just copy the previous Change UI Color node and adjust it.

This time we wait for the fade to complete.

  • Wait
    Enable this setting.
    We should wait the 0.25 seconds defined by Time.
  • Start Color
    Select a color with full alpha value (A=255 or 1, depending on your color picker).
  • End Color
    Select a color with no alpha value (A=0).

And that’s it for the schematic. Click on Save Schematic to save it, e.g. as FlyingTextMover.

We’ll use this schematic in later tutorials when setting up actual flying texts (e.g. for status value changes).

Flying Text Setup #

We’ll now set up the basic flying text settings in the editor.

Open the Makinom editor and navigate to UI > UI Settings.

Flying Text Settings #

  • UI Prefab
    Select the Flying Text prefab we just created.
    Individual flying texts can optionally use their own prefab, e.g. for a different setup.
  • Create Object Type
    Select None.
    We’ll stick with this default setup, just note that you can use this to have actual game objects in the world created to position a flying text.
    This allows you to set up things like physics-based flying texts, see this tutorial for some examples.
  • Follow World Position
    Enable this setting (default setup).
    Flying texts will follow the position of the game object they’re displayed for, e.g. a combatant’s damage numbers will follow the combatant on position changes.

Default Flying Text Positions #

These settings handle how flying texts are positioned on screen, based on the game object they’re displayed for.

We’ll set up multiple positions for cases where more than 1 flying text is displayed at the same time, e.g. an attack that deals damage and adds a status effect. Otherwise, the flying texts would overlap, making it hard to read them.

  • Use In Order
    Enable this setting.
    The positions will be used in the order they’re defined instead of a random position from the defined settings.
  • Reset Order
    Enable this setting.
    The order is reset after a defined time, this is useful for only using the additional positions when multiple flying texts are displayed in a short time.
  • Reset After
    Set to 0.5.
    The order is reset after 0.5 seconds, i.e. we’ll mainly use the other positions for actions adding multiple flying texts at once.

The already added Position 0 will simply display the flying text at the position of the game object without any offset. You can also add random offsets to the position if you want.

Click on Add Position and change the settings of the newly added Position 1.

  • Position
    Set to X=0, Y=-0.5, Z=0.
    I.e. the 2nd flying text will be a bit lower than the first.

Click on Add Position again and change the settings of the newly added Position 2.

  • Position
    Set to X=0, Y=-1, Z=0.

That should be enough to keep flying texts from overlapping in our small game.

Save Changes #

And that’s it for now.

Save the changes using the Save Settings button at the bottom of the editor.

 

Next, we’ll get to the bones of our game – the status system.

Share This Article :
  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
Updated on March 9, 2023
Table of Contents
  • Flying Text Prefab
    • Horizontal Layout Group
    • Content Size Fitter
    • Image Size
    • Fitting the Text
    • Create Prefab
  • Flying Text Mover Schematic
    • Change UI Offset
    • Change UI Color
    • Wait
    • Change UI Color
  • Flying Text Setup
    • Flying Text Settings
      • Default Flying Text Positions
    • Save Changes
Sitemap
  • Features
  • Showcase
  • Guide
    • Documentation
    • Tutorials
    • API
  • ORK 2 Hub
    • Tutorials
    • Plugins
    • API
  • Support
  • Forum
  • Get ORK
  • Contact
  • Blog
  • Makinom
  • gamingislove.com
Categories
  • News (60)
  • ORK 2 (137)
    • Tutorial (137)
      • Game tutorial (50)
      • Gameplay (32)
      • How-to (55)
  • Release (130)
Search

© 2015 Gaming is Love e.U.

Disclosure: This site may contain affiliate links, which means I may receive a commission if you click a link and purchase something that I have recommended. While clicking these links won’t cost you any money, they will help me fund my development projects while recommending great assets!