✒️SAP BTPFIORI / La utilización de los controles en la UI Por Claudia Monsalve Lopez
SAP BTPFIORI La utilización de los controles en la UI

La utilizacion de los controles UI
Tipos de controles de interfaz de usuario
- Simple Controls
- Value Holders
- Layouts
- Complex Controls
- UX3 Controls
Controles para escritorio sap.ui-namespace
- El nombre de control: sap.m.Table
- El control de metadatos: Es un objeto interno que define las propiedades, agregaciones, asociaciones y eventos del control. Esto permite al framework (y a ti como desarrolladora) saber cómo usar el control, qué atributos tiene, cómo se renderiza y cómo interactúa con otros controles.
- Los elementos: sap.ui.core.Element es la clase base de sap.ui.core.Control
- Los metodos: en los controles SAPUI5 son funciones que te permiten interactuar, modificar o recuperar información del control en tiempo de ejecución. Estos métodos son parte de la API pública del control, y cada tipo de control hereda métodos desde sus clases base (como sap.ui.core.Control, sap.ui.core.Element, etc.) o define los suyos propios.
La clase base para todos los controles es sap.ui.core.Control
La creacion de una tabla usando un control de SAPUI5: Api sap.m.Table
Data Binding: El Data Binding (enlace de datos) es un mecanismo que conecta los datos del modelo con la interfaz de usuario (UI) de forma automática y bidireccional o unidireccional. Gracias a esto, puedes vincular datos de un backend, archivo JSON, OData, etc., a controles UI5 como listas, formularios, tablas, etc.
La creacion de un modelo con un archivo JSON local: es una forma de cargar datos desde un archivo .json externo y usarlos dentro de la interfaz de usuario (UI) para mostrarlos, editarlos o procesarlo.
El modelo se usa
- en el archivo manifest.json
- LoadData
La vinculacion del modelo a la vista
- El data binding
- El two-way-binding
Niveles
- A inivel de app (core): el modelo estara disponible desde cualquier punto de la app
- A nivel de vista: solo disponibles en una vista determinada
- A nivel Control: Se asigna de manera exclusiva a un control
Propiedades de los controles
- El atributo id: identificacion para un elemento HTML
- El atributo value: especifica el valor de un elemento
- El atributo class: se usa para asignar una o más clases CSS a un control o elemento, con el fin de aplicar estilos personalizados.
- El atributo placeholder: se usa para mostrar un texto guía dentro de un campo de entrada, antes de que el usuario escriba algo. Es muy útil para indicar qué tipo de información se espera que el usuario ingrese.
- El atributo showSuggestion: para habilitar la funcionalidad de autocompletado, es decir, mostrar una lista de sugerencias mientras el usuario escribe en el campo.
- El atributo Suggestionitems: se utiliza en el control sap.m.Input para definir una lista de sugerencias estáticas o basadas en un modelo, que se mostrarán cuando el usuario empiece a escribir
Control select: es un menú desplegable (dropdown) que permite al usuario elegir un valor de una lista de opciones predefinidas.
| items | Lista de opciones (de tipo sap.ui.core.Item) |
| selectedKey | Clave del ítem seleccionado |
| change | Evento al cambiar de opción |
| enabled | Si el control está activo o no |
| value | Texto del ítem seleccionado (solo lectura) |
- Control Label
- Control Button
- Iconos de controles
- Lo eventos
- Los filtros
El contexto y los mensajes
- El contexto en SAPUI5 se refiere al objeto de datos al que está enlazado un control, dentro de una estructura de datos más grande (modelo). Esto permite que cada control sepa qué parte del modelo debe mostrar o modificar.
- Los mensajes son objetos que informan al usuario sobre el estado del sistema, validaciones, errores, advertencias, etc. Se gestionan a través del MessageManager y el MessagePopover o MessageToast.
 
 
 
Sobre el autor
Publicación académica de Claudia Bibiana Monsalve Lopez, en su ámbito de estudios para la Carrera Consultor SAP BTP Fiori.
Claudia Bibiana Monsalve Lopez
Profesión: Ingeniera Informatica - Colombia - Legajo: XF24Z
✒️Autor de: 109 Publicaciones Académicas
🎓Egresado de los módulos:
Certificación Académica de Claudia Monsalve







Disponibilidad Laboral: FullTime


















