Skip to content

Step 3: Interact Component

BavGames edited this page Jan 11, 2026 · 11 revisions

Interact Component

image

All features are tied to the Interact Component, so the first step is to add the Interact Component to your character.

To add the Interact Component, open your character’s Blueprint, go to the Components panel, click Add, and type Interact into the search bar.

Select the Interact Component from the list and add it to your character.

image

Now, right-click inside your character’s Event Graph and type “Possessed” into the search bar. Select the Event Possessed node.

If you connect this logic to Event Begin Play, it may not work correctly after respawn events. The safest and most reliable method is to start the setup from Event Possessed.

image

Now drag the Interact Component into the Event Graph and call the Set Owner Character function from it.

image

Connect the function you just called to the Event Possessed node.

image

To set up your interaction key, go to your character’s Event Graph, right-click, and search for F Keyboard (or any key you prefer). Then select the event for the key you want to use.

image

Drag the Interact Component into the Event Graph again, then search for Interact Action in the function list and select it.

image

Finally, connect the Interact Action function to the key event.

image

The component setup is now ready. Now let’s configure the component settings.


Tip

Component Settings

Click on the Interact Component once from your character’s Components panel.

image

In the right-side Details panel, locate the Interact System category and find the Interact Widget Class section. Search for WBP_HUD_Interact, select the widget that appears, and save your blueprint.

Your Interact Component is now fully set up and ready to use.

image

If you wish, you can adjust the other settings to fit your needs:

  • Trace Distance (600): The interaction range.
  • Trace Interval: Interaction update frequency (recommended: 0.12).
  • Trace Channel: The collision channel used for detecting interactable actors. If you have a custom channel, you may select it as well.

If you want to visualize the interaction system, you can enable Debug Trace.


Tip

Settings for actors you want to make interactable

To make an actor interactable, open the blueprint of your actor and click the Class Settings button.

image

In the Details panel that appears, locate the Interfaces section. Under Implemented Interfaces, click Add, then type InteractInterface into the search box. Select the InteractInterface from the results.

image

Under the Functions section on the left side of your actor’s blueprint, a new Interfaces category will appear containing the functions of the Interaction System.

  • Yellow functions are event functions that will be triggered by the system.
  • Gray functions are callable functions that provide information to the system.
image

The first thing you need to do is double-click the Can Interact function and enable the interaction state.

image

Now, double-click the Get Interact Display Info function so you can fill in the actor’s interaction data.

First, drag off from the Return Value pin and create a Make Interact Display Info node. (You can also right-click anywhere in the graph and create it manually.)

image

If your actor is an inventory item, you can pull its inventory data here and connect it to the fields.

You can assign an item icon; if there is no item icon, you can also use a key icon instead — the visual design is entirely up to you. You can also set the item name and a short description about the item.

If you set the Interact Type to “Press”, the actor will use a quick interaction. If you set the Interact Type to “Hold”, WBP_HUD_Interact will detect this and automatically enable a progress bar for the interaction.

image

Now let’s move on to the Events. If you double-click the yellow events, they will automatically be added to your Event Graph.

  • Interact Event → This is the counterpart of the “Interact Action” function you connected on your character.
  • On Focus Start → Fires when the player looks at the actor.
  • On Focus End → Fires when the player stops looking at the actor.

You can use these however you want depending on your game design.

Important (Multiplayer Note): On Focus Start and On Focus End are only triggered for the local player. They do not send information to the server. If you need the server to know when focus starts/ends, you must call a Multicast or Server RPC yourself.

The Interact Event, however, is triggered on the server.

Now you can drag your actor into the level and start testing it.

image

Tag-Based Interaction System

The tag-based interaction system allows you to define separate interactions for each Component (e.g. Mesh, Button, Panel) within a single Actor.

When this system is enabled (CanUseTag = true):

  • Interaction does not work at the Actor level, but is driven by the Tag on the hit Component.
  • Only Component Tags that start with the defined TagPrefix (e.g. btn_) are considered.

If no valid Tag is found:

  • Focus is not started
  • Focus end is not triggered
  • Interact is not executed
  • The old (Actor-based) interaction system does not act as a fallback

This allows:

  • Elevator buttons
  • Vehicle doors
  • Control panels
  • Multi-part interactive objects

to exist as a single Actor while each part produces different behaviors.

Summary: When CanUseTag is enabled, interaction is strictly tag-driven. If no Tag is present, the system intentionally produces no interaction.


Note

The plugin includes example actors for all these systems, so you can easily review, test, and adapt them for your own project.

image

Clone this wiki locally