3. Crea una cartera con botones de ingreso y compra

Objetivo: Crear una cartera que cambie al pulsar botones.

Antes de empezar: El primer cálculo y el tratamiento básico de errores. Usaremos un componente Normal.

La idea que vas a utilizar

Wallet conserva el estado. El widget lo lee y muestra. Can Afford compara; Try Subtract realiza el cambio después de comprobarlo.

Predice antes de ejecutar

Desde 1000, produce 25 y compra por 100. ¿Qué saldo aparecerá? ¿Se recuperará tras reiniciar Play?

Construye y comprueba

Crearás una interfaz UMG con botones para producir recursos y comprar. Cada operación actualizará el saldo y mostrará si la compra se ha podido realizar.

Preparar el actor propietario

1. En Blueprints crea otro Actor llamado BP_MiCartera. Ábrelo.
2. En Components pulsa Add y busca Scientific Number Value Component. Nombra el componente Wallet. Arrástralo al Event Graph como Get.
3. Desde su referencia añade Try Set Value; asegúrate de que Target está conectado a Wallet.
4. Añade Make Scientific Number con Base 1000, Exponent 0 y conéctalo a New Value. Conecta BeginPlay a Try Set Value. Añade Branch con su Return Value. Resultado esperado: True y Out Error = No Error. El valor 1000 × 10^0 se normaliza a Base 1, Exponent 3; normalizar no es un error.
5. La rama False es el manejo de un posible fallo, no el resultado esperado con 1000. Conecta False a Print Scientific Number Error, Out Error a Error y Context = Inicializar Wallet. En True continúa con la interfaz. No continúes por False con un saldo que no se inicializó.

Crear los botones y el texto

1. En la carpeta UI: botón derecho → User Interface → Widget Blueprint. Usa User Widget y nómbralo WBP_MiCartera.
2. Ábrelo en Designer. Añade un Canvas Panel si no tiene raíz. Añade dentro un Vertical Box, céntralo con el preset de anclas y activa Size to Content si necesitas ajustar su tamaño.
3. Dentro de Vertical Box añade un Text Block llamado TXT_Saldo. Activa Is Variable. Dale un tamaño legible, por ejemplo 28.
4. Añade otro Text Block, TXT_Estado, con Is Variable activado. Será el lugar para mostrar el rechazo de una compra.
5. Añade dos Button, llamados BTN_Producir y BTN_Comprar. Pon dentro un Text Block con Producir +25 y Comprar −100 respectivamente.
6. En Graph crea una variable Cartera, de tipo BP_MiCartera → Object Reference. Activa Instance Editable y Expose on Spawn. Compila el widget.

Mostrar el widget

1. Vuelve a BP_MiCartera. Desde la rama True de la inicialización añade Create Widget, Class WBP_MiCartera.
2. Conecta Get Player Controller a Owning Player. En el pin Cartera del Create Widget conecta Self.
3. Si no aparece Cartera, comprueba Expose on Spawn, compila el widget y usa Refresh Node o vuelve a crear Create Widget.
4. Conecta Return Value del Create Widget a Add to Viewport.
5. Usa Set Input Mode Game and UI, con Get Player Controller conectado al pin Player Controller y el widget creado en In Widget to Focus. En el Player Controller establece Show Mouse Cursor = true.
6. No pongas un segundo Set Value al final: la cartera debe conservar el saldo a través de los clics.

Leer el saldo desde la interfaz

1. Abre WBP_MiCartera, pestaña Graph. Crea una función llamada ActualizarSaldo.
2. Arrastra Cartera como Get. Desde ella obtén Wallet. Desde Wallet añade Get Value.
3. Conecta el valor a To Fixed String, Decimal Places 2. Conecta el texto a Set Text (Text) cuyo Target sea TXT_Saldo. Unreal puede insertar la conversión String → Text.
4. Conecta la entrada blanca de la función a To Fixed String y de ahí a Set Text. Compila.
5. En EventGraph conecta Event Construct → ActualizarSaldo. La referencia Cartera ya se entrega al crear el widget.

Programar los botones

1. En Designer selecciona BTN_Producir. En Details → Events pulsa + OnClicked. Unreal abre su evento en Graph.
2. Desde Cartera → Wallet llama a Try Add, Amount = Make Scientific Number 25. Conecta OnClicked al nodo y después a Branch con Return Value.
3. En True limpia TXT_Estado con Set Text vacío y llama a ActualizarSaldo. En False muestra un mensaje de fallo y revisa Out Error. No simules el saldo cambiando solo el texto.
4. Crea OnClicked de BTN_Comprar. Obtén Wallet → Get Value y conecta el resultado a Can Afford, Resources Available. Price = Make Scientific Number 100.
5. Conecta OnClicked a Branch con el resultado de Can Afford. En False, conecta Print Scientific Number Error: Out Error → Error, Context = Comprar y No Error Message = Saldo insuficiente. Con saldo 25 y precio 100, Can Afford devuelve False / No Error y el Print muestra Comprar: Saldo insuficiente. Un error real tiene prioridad sobre No Error Message. Mantén este Print en la rama False: si se ejecuta también al tener éxito, imprimirá igualmente el texto alternativo. Para un mensaje en el widget, actualiza además TXT_Estado; Print es solo de desarrollo. Can Afford compara saldo y precio, no ejecuta ni simula la resta.
6. Obtén la referencia Cartera → Wallet y arrastra desde su pin azul de objeto para buscar Try Subtract. Es un método de Scientific Number Value Component (Normal): al buscar desde el cable blanco del Branch, el menú contextual puede no mostrarlo. Conecta Wallet a Target, True → ejecución de Try Subtract, y Make Scientific Number 100 a Amount. Comprueba Return Value con otro Branch; solo tras éxito limpia el estado y llama a ActualizarSaldo. No sustituyas esto por Try Add con -100 mientras Idle esté activo: el número negativo se rechaza al construirlo; Try Subtract recibe el precio positivo.
7. Compila ambos assets y guarda. En el nivel elimina solo la instancia de BP_MiNumero que colocaste, o desactiva su prueba; no borres el asset. Coloca una única instancia de BP_MiCartera.
8. Ejecuta y haz clic dentro del juego. Debes tener dos botones y un saldo inicial de 1000.00.

Usa tu cartera

Lo que haces tú	Lo que debería ocurrir
Pulsa Producir una vez	1025.00
Después pulsa Comprar una vez	925.00
Detén Play y vuelve a ejecutarlo	1000.00: esta cartera aún no guarda partida
Compra diez veces desde 1000	0.00
Compra una vez más	Sigue 0.00 y aparece Saldo insuficiente
Produce cuatro veces y compra	Vuelve a 0.00 y desaparece el mensaje anterior
Añade breakpoint a Try Subtract	Ves la llamada del botón y el componente que cambia

Para adaptar la interfaz a tu juego, puedes mantener el botón de compra activo y explicar el rechazo en TXT_Estado, o desactivarlo cuando no haya saldo suficiente. Comprueba el saldo al ejecutar la compra aunque el botón ya refleje su disponibilidad.

Comprueba tu razonamiento

Ver la explicación

Queda 925. Al reiniciar se inicializa a 1000 porque todavía no hemos añadido guardado.

Ahora prueba tú: Intenta comprar con saldo insuficiente y comprueba tanto el mensaje como el valor de Wallet.

Puedes continuar cuando: el saldo cambia en el componente, la interfaz lo refleja y el rechazo conserva el valor anterior.