Receive UI events in Blueprint
The React side of the events channel: React sends a typed event, any BP listening on that name receives it.
End-to-end example: a Reload button
React side
tsx
import { useUnrealBridge } from 'unreal-react-bridge';
export function ReloadButton() {
const { send } = useUnrealBridge();
return (
<button onClick={() => send('ui:reload:click', { weapon: 'pistol', ammo: 15 })}>
Reload
</button>
);
}UE side
- Add a React Bridge Receiver component to any actor.
- Set
EventNameto the React-side name, e.g.ui:reload:click. - Bind
OnReceived(JsonData : String):
text
ReactBridgeReceiver (component)
EventName: "ui:reload:click"
Event On Received (JsonData : String)
├─ Print String JsonData
└─ Parse JSON → drive gameplayPayload format
JsonData arrives as whatever the JS side passed as send's second arg, serialised verbatim. Parse it with the built-in Parse JSON BP nodes or a small helper.
Notes
- One Receiver fires once per matching event from any registered HUD layer; v1 has no per-source filter.
- Stale components are skipped automatically.
Reference: ReactBridgeReceiver.