En esta sección, aprenderás a crear un menú personalizado para mostrarlo en el dispositivo Diálogo emergente.
Sigue estos pasos para crear un menú personalizado:
- Crea un blueprint de widget que sea una variante de diálogo modal con el nombre WBP_Dialog_One_Button_Intro.
- Añade primero el widget Caja de tamaño y luego el widget Superposición como hijo. La caja de tamaño proporciona un panel en el que colocar el widget Superposición.
- En el panel Detalles del widget Superposición, aplica la siguiente configuración.
Opción Valor Explicación Relleno 0.0, 0.0, 0.0, 40.0 Esto añadirá un relleno de 40 píxeles a la parte inferior del widget. Alineación horizontal Alineación centrada horizontal Esto hace que el widget se alinee en el centro de la pantalla. Alineación vertical Alineación vertical inferior Esto hace que el widget se alinee en la parte inferior de la pantalla. - En el panel Detalles del widget Imagen, aplica la siguiente configuración.
Opción Valor Explicación Alineación horizontal Relleno horizontal El widget ocupará todo el espacio que pueda. Alineación vertical Relleno vertical El widget ocupará todo el espacio que pueda. Tono AE4200FF Hex sRGB Color para el fondo. Dibujar como Cuadro redondeado Esto hace que la imagen tenga las esquinas redondeadas. Visibilidad No admite prueba de posicionamiento (a sí mismo) Solo el botón en sí debe poder seleccionarse en la interfaz de usuario. - En el panel Detalles del widget Botón UEFN - Silencio, aplica la siguiente configuración.
Opción Valor Explicación Anchura mínima 300 Configura la anchura del botón. Altura mínima 48 Configura la altura del botón. Alineación horizontal Relleno horizontal El widget ocupará todo el espacio que pueda. Alineación vertical Relleno vertical El widget ocupará todo el espacio que pueda. Visibilidad Visible El botón debe poder seleccionarse en la interfaz de usuario. Texto Ninguno Deja en blanco el ajuste Texto porque estamos utilizando un bloque de texto para crear el texto personalizado. - En el panel Detalles del widget Bloque de texto UEFN, aplica la siguiente configuración.
Opción Valor Explicación Alineación horizontal Alineación centrada horizontal Esto hace que el widget se alinee en el centro del contenedor. Alineación vertical Alineación centrada vertical Esto hace que el widget se alinee en el centro del contenedor. Texto Texto del botón 1 Texto del marcador de posición. La vista de vinculaciones sustituirá el texto aquí por el texto de la configuración del dispositivo Diálogo emergente. Visibilidad No admite prueba de posicionamiento (a sí mismo) No queremos que el texto oculte el botón de la interacción del usuario. - Haz clic en Vista de vinculaciones en el editor de widgets.
- Añade la siguiente vinculación al widget Botón de UEFN - Silencioso.
- Cambia la dirección de la vinculación a Una vía al modelo de vista.
- Ajusta el lado izquierdo a la función de conversión Obtener respuesta - Botón 1.
- Configura el lado derecho como CreativeModalDialogViewmodel > Respuesta.
- En Campo, elige Botón UEFN - Silencio > Evento de clic.
- Añade la siguiente vinculación al widget Bloque de texto de UEFN.
- Cambia la dirección de la vinculación a Una vía al widget.
- Establece el lado izquierdo como Bloque de texto UEFN > Texto.
- Configura el lado derecho como CreativeModalDialogViewmodel > Botón 01 - Texto principal.
- Guarda y haz clic en Compilar en el blueprint de widget.
Añadirás este widget personalizado a un dispositivo Diálogo emergente más adelante en el paso 5 de este tutorial.