# Simple Onchain Interactable

{% hint style="warning" %}
First make sure your [Players can Connect their Wallet](https://cryptonauts.gitbook.io/cryptonauts-docs/auth/wallet), you are [Casting to the Player principal to the Game Instance](https://cryptonauts.gitbook.io/cryptonauts-docs/auth/casting-to-game-instance), you are aware of the [Player TX UI/UX](https://cryptonauts.gitbook.io/cryptonauts-docs/tx/ux), and you also have a [Simple Onchain Widget](https://cryptonauts.gitbook.io/cryptonauts-docs/tx/simple-onchain-widget)
{% endhint %}

To enable players to invoke a Transaction on the Stacks blockchain, via your UE5 based game, the [Player should have their Wallet Connected](https://cryptonauts.gitbook.io/cryptonauts-docs/auth/wallet) and you've [Cast the Player Principal](https://cryptonauts.gitbook.io/cryptonauts-docs/auth/casting-to-game-instance) (with server authority assuming you are developing a multiplayer game) to the Player State through the Game Instance and Player Controller.\
\
You are going to need to have Simple Interactable Actor for the player to interact with and open our UMG Widget (in our demo video case we open the `WB_Nakamoto1_Interactable`  widget, however for Documentation we will open the [`WB_Simple_Onchain_Widget`](https://cryptonauts.gitbook.io/cryptonauts-docs/tx/simple-onchain-widget) )

{% hint style="warning" %}
Note: In our demo video we open the UMG Widget upon pressing "E" with our interactable actor, but for the purpose of documentation we will be simplifying the approach, so you can integrate the call with any custom event you want.  We will be using a simple "Begin Overlap" Event.
{% endhint %}

Lets create a new Blue Print Actor, named `Simple_Onchain_Interactable` Add a simple Cube (scale of 1,1,1) component, and Box collision component (with scale of 2,2,2 so it surrounds our cube). Like the screenshot below.&#x20;

<figure><img src="https://873068673-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhHL6KhJKtaBfJbxztqID%2Fuploads%2Fgn5Pq2tCFdbx3xcMNU0D%2Fimage.png?alt=media&#x26;token=bacdb2c9-a5df-4cf1-92c0-a86b007722d8" alt=""><figcaption></figcaption></figure>

<p align="center"><em>(our Cube material glows purple, the Orange wireframe Box around it is the Box collision boundary)</em></p>

Select the Box component (left side), then scroll down on the Details panel (right side). \
Then click the + Button next to the "On Component Begin Overlap"

<figure><img src="https://873068673-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhHL6KhJKtaBfJbxztqID%2Fuploads%2F2duzQ6q4u8lU5qR6B2RP%2Fimage.png?alt=media&#x26;token=057f6dcf-704a-4615-8826-03dca1596d00" alt=""><figcaption></figcaption></figure>

We are now updating the Event Graph of the `Simple_Onchain_Interactable` so when a player overlaps with the collision Box of our Cube actor we will open our `WB_Simple_Onchain_Widget`  \
\
On Overlap Event, we use the "Cast to BP\_PlayerCharacter" node, so we can then "As BP\_PlayerCharacter" get our Player State and Player Controller. This is to ensure the accurate player is presented with the `WB_Simple_Onchain_Widget` UMG widget via the "Create Widget" node.

<figure><img src="https://873068673-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhHL6KhJKtaBfJbxztqID%2Fuploads%2FV7Ei4D6nx9X7y8zgE8ji%2Fimage.png?alt=media&#x26;token=6d2c46b1-6ae6-4d7f-9010-56025775337c" alt=""><figcaption></figcaption></figure>

Place the new `Simple_Onchain_Interactable` Actor from your content drawer into your Game Level. &#x20;

<figure><img src="https://873068673-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhHL6KhJKtaBfJbxztqID%2Fuploads%2FxW14ySxvpV1lR2w1advF%2Fimage.png?alt=media&#x26;token=270bb69a-9b62-4daa-8eb2-e5ea4898e21e" alt=""><figcaption></figcaption></figure>

<p align="center"><em>(Our new Simple_Onchain_Interactable is the Purple Cube)</em></p>

To test, you will need to start at your Main Menu, so you can actually connect your wallet first. \
Then load into your Game level. \
Then walk up to the new `Simple_Onchain_Interactable` actor to trigger the Box collision on Overlap Event and open our `WB_Simple_Onchain_Widget`

<figure><img src="https://873068673-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhHL6KhJKtaBfJbxztqID%2Fuploads%2FPajUzOyL7jMwuhQr6Cv2%2Fimage.png?alt=media&#x26;token=0578d768-d6ee-4b8f-8fd6-d4b042b1f287" alt=""><figcaption></figcaption></figure>

<p align="center">(On overlap of <code>Simple_Onchain_Interactable</code> actor, you should see the <code>WB_Simple_Onchain_Widget</code>)</p>

Once presented with the `WB_Simple_Onchain_Widget` the user can click the `Send` button, which will invoke the on Button click Event handling execution, as explained in the [Simple Onchain Widget](https://cryptonauts.gitbook.io/cryptonauts-docs/tx/simple-onchain-widget).\
Which opens the users Browser and Wallet to Confirm the transaction.&#x20;
