{{ wiki.title }}
{{ wiki.title }}
Plugins of Sp8iky
  1. RPG Essentials
    1. Chat
      1. Info
      2. 1. Setup
      3. 2. Create a Channel and send your first Message
      4. 3. Receive Logs
      5. 4. Mute other Players
      6. 5. Use Commands
      7. 6. Send your first Private Message
      8. 7. Send your first Global Message
      9. 8. Warn other Players
      10. 9. Chat Area with Interaction Component
      11. 10. Guild Channel with Guild Component
    2. Interaction
      1. Info
      2. 1. Setup
      3. 2. Create Custom Interactable Actors
      4. 3. Create Custom Areas
      5. 4. If not using SP8_InteractableActor
      6. 5. If not using SP8_Area
    3. Currency
      1. Info
      2. 1. Setup
      3. 2. Create your first Currency
      4. 3. Create a Currency Converter
      5. 4. Create Widget
      6. 5. Pick up Currency with Interaction Component
    4. Inventory
      1. Info
      2. 1. Setup
      3. 2. Consumable Item
      4. 3. Equipment and Costume
      5. 4. Max Inventory Size
      6. 5. Enhancement
      7. 6. Enhancement with Interaction Component
      8. 7. Pick up Item with Interaction Component
    5. Stats
      1. Info
      2. 1. Setup
      3. 2. Level
      4. 3. Stats
      5. 4. Custom Stats
      6. 5. Create Widget for Level, XP and Custom Stats
      7. 6. Create Stat Change Area with Interaction Component
      8. 7. Use Potion with Inventory Component
    6. Guild
      1. Info
      2. 1. Setup
      3. 2. Create your first Guild
      4. 3. Level
      5. 4. Roles
      6. 5. Invite Players
      7. 6. Applicate for a Guild
      8. 7. Members
    7. Shop
      1. Info
      2. 1. Setup
      3. 2. Create a Shop
      4. 3. Global Shops
      5. 4. Use Shop with the Interaction Component
    8. Crafter
      1. Info
      2. 1. Setup
      3. 2. Create a Crafter
      4. 3. Global Crafter
      5. 4. Use Crafter with the Interaction Component
      6. 5. Unlock Crafting Recipe with the Inventory Component
    9. Player Shop
      1. Info
      2. 1. Setup
      3. 2. Create Shop Actor with Interaction Component
      4. 3. Create Shop with Inventory Component
      5. 4. Storage
    10. Other
      1. Example Map
      2. GameState
      3. Player
        1. With Player Template
          1. SP8_PlayerTemplate
        2. Without PlayerTemplate
      4. SP8_GameState_Listener
      5. BPI
        1. SP8_BPI_AddItemToInventory
        2. SP8_BPI_RemoveItemFromInventory
        3. SP8_BPI_AddCurrency
        4. SP8_BPI_ReduceCurrency
        5. SP8_BPI_GetPlayerLevel
        6. SP8_BPI_GameState_Listener
      6. Logging
        1. SP8_Logging_FunctionLibrary
      7. Items
        1. SP8_Item_FunctionLibrary
        2. Add own Variables to the Item
5. Create Widget for Level, XP and Custom Stats {{ currentPage ? currentPage.title : "" }}

Now we will create a simpel Widget, which Displays following:

  • Health (Red Bar)

  • Health with Potion (Light Red Bar inside Health Bar)

  • Mana (Blue Bar)

  • Mana with Potion (Light Blue Bar inside Mana Bar)

  • Stamina (Yellow Bar)

  • Stamina with Potion (Light Yellow Bar inside Stamina Bar)

  • Level (As Number)

  • XP (Black Bar)

1. First of all we need to add all Stats and Custom Stats, as well setup the Level.

Look into those Tutorials:

I will create everything like in the Tutorial.

For Stamina i will use the Gameplay Tag Stats.Secondary.Stamina.

2. Now we will create a new Widget and add following to it:

  • Overlay with 2 Progress Bars on top of each other.

    • The first one will be the Health Bar with Potion - Make the Fill Color light red

    • The second one, which should be on top of the first one, is going to be the Health Bar - Make it red.

  • Do the same with the Mana and Stamina Bar, just in the correct Colors.

  • Create a Text Widget for the Level.

  • Create another Progress Bar for the Level and make the Fill Color Black.

If you are not sure how to set this up, you can look inside the SP8_WBP_CustomStatsAndLevel Widget, which can be found inside the Directory RPG_Essentials / Example / Widgets.

3. Switch to the Event Graph and create following Functions

  • Dispatcher_XP_Changed: Will be called, if the XP of the Player changes.

  • Dispatcher_LevelChanged: Will be called, if the Level of the Player changes.

  • Dispatcher_CustomStatChanged: Will be called, if a Custom Stat changes.

  • Dispatcher_CustomStatWithPotionChanged: Will be called, if a Custom Stat with Potion changes.

Also add a new Variable called StatComponent and set the Type to SP8_StatComponent.

[Optional] Go to Class Defaults and set the Visiblity to Hidden, so it will not be displayed at the start and will show up, if we initialize the Widget.

4. We will start with the Function Dispatcher_XP_Changed:

  • The Input should contain following Variables:

    • CurrentXP [Integer]: What’s the current XP of the Player.

    • MaxXP [Integer]: What’s the XP needed for the next Level.

  • Inside the Function, we have to check if the current XP is bigger then 0.

    • If yes, we can devide the Current XP with the Max XP and call the Function SetPercent on the XP Bar. In Percent can be set with the Value from the deviding.

      • To make the divide output pin to float, do a right click on it and click To Float.

    • If no, we can simple set the Function SetPercent on the XP Bar to 0.

If this Function is going to be called, the XP Bar should be setting it’s Value to the correct Percentage.

For example if the Current XP is 100 and the Max XP is 1000, the Bar will be filled by 10%.

5. The next Function will be Dispatcher_LevelChanged:

  • The Input should contain Level [Integer]: Will be the current Level of the Player.

  • Inside the Function we can simple call SetText on the Level Text Widget and connect the Level with the InText Variable.

If this Function is going to be called, the Level Text will Display the current Level.

6. And the next will be Dispatcher_CustomStatChanged and Dispatcher_CustomStatWithPotionChanged.

In Both functions we will do almost the same:

  • As Input we need following:

    • With Potion: Stat Type [Gameplay Tag]

    • Without Potion: Stat Type [Gameplay Tag] and Adding Value [Integer]

  • First of all we need to get the current Custom Stat Value:

    • With Potion: Call getCurrentCustomStatWithPotion on the Stat Component with our Input Stat Type.

    • Without Potion: Call getCurrentCustomStat on the Stat Component with out Input Stat Type.

  • Set the output of both Functions to a new local Variable called local_value.

  • Then we need to make a switch on the Stat Type and set for each Stat our Bar (new local variable called local_bar)

    • For Stats.Secondary.Mana put the Mana Bar (With Potion: Mana with Potion Bar).

    • Set all other Stats as well.

  • Like in the Dispatcher_XP_Changed, we need to check now, if our local_value is greater then 0.

    • If yes, call GetStatValue on the Stat Component and divide the local_value with the returned value. Again call SetPercent on the local_bar, with the new Value.

    • If no, just put 0 into SetPercent.

If this Function will be called, the Custom Stat Bar will set the correct Value like the XP Bar.

7. Now we need to set everything on start.

I created the Event Initialized with the Input Stat Component.

  • First of all i will set the Stat Component Variable which we created earlier.

  • After that we have to call following Functions:

    • Dispatcher_CustomStatWithPotionChanged for each Custom Stat.

    • Dispatcher_CustomStatChanged for each Custom Stat.

    • Dispatcher_LevelChanged and as input we need to call getLevel on the Stat Component.

    • Dispatcher_XP_Changed and as input we need to call getMaxXP and getXP on the Stat Component.

  • [Optional] If the Widget is hidden, we want now to show it with the Function SetVisiblity.

  • At the end we need to Bind all Events to the Functions we have created. Bind now those Events from Stat Component to your Widget:

    • CurrentCustomStatChanged

      • Call create Event and set the Function to Dispatcher_CustomStatChanged.

    • CurrentCustomStatWithPotionChanged

      • Call create Event and set the Function to Dispatcher_CustomStatWithPotionChanged.

    • XPChanged

      • Call create Event and set the Function to Dispatcher_XP_Changed.

    • CurrentLevelChanged

      • Call create Event and set the Function to Dispatcher_LevelChanged.

The Event Initialized should be called, when the Stat Component was already initialized.

If you would call it before, you will get wrong Values.

{{{ content }}}