Share via


Estructura de la aplicación de base de datos del cliente

Las aplicaciones complejas de línea de negocio suelen tener muchas páginas y características y una gran cantidad de líneas de código. Por este motivo, es de vital importancia diseñar la aplicación en torno a una estructura predecible. Hay varios patrones de diseño de aplicaciones que son adecuados para aplicaciones empresariales, pero todos se basan en el objetivo de facilitar la comprensión y el trabajo de una aplicación a gran escala.

Aunque el tutorial de base de datos customer presenta una aplicación de página única por motivos de simplicidad, implementa el patrón de diseño de la aplicación Model-View-ViewModel (MVVM) para mostrar estas ideas en acción. Como su nombre indica, el patrón de diseño de MVVM separa la lógica de la aplicación principal en tres categorías:

  • Los modelos son las clases que contienen los datos de la aplicación.
  • Las vistas son la interfaz de usuario de cualquier página determinada.
  • ViewModels proporciona la lógica de la aplicación. Esto puede incluir el control de acciones de usuario desde la vista o la administración de interacciones con los modelos.

Aunque esta aplicación no es un ejemplo perfecto y arquetípico de MVVM, muestra los principios principales de separación de preocupaciones en acción. Echa un vistazo a la aplicación aquí.

Estructura de la aplicación

Después de abrir la aplicación, empiece examinando el Explorador de soluciones. Algunos de los elementos que ves deberían estar familiarizados si has trabajado con una aplicación para UWP antes, pero también verás una colección de carpetas que contienen los elementos de componente de la aplicación.

Punto de partida de la aplicación en el Explorador de soluciones

Vistas

Toda la interfaz de usuario de la aplicación se define en la carpeta Vistas. Dado que nuestro tutorial es una aplicación de página única en este momento, esto significa que solo hay una vista : CustomerListPage. Tiene marcado de interfaz de usuario XAML y código subyacente xaml.cs: estos dos archivos constituyen una vista. Agregará elementos de interfaz de usuario a CustomerListPage.xaml.

Nota

Es posible que observe que esta aplicación no tiene un MainPage. Esto se debe a que especificamos en App.xaml.cs que la aplicación debe iniciar CustomerListPage al iniciarse.

ViewModels

Aunque esta aplicación solo tiene una vista, tiene dos ViewModels. ¿Por qué ocurre esto?

CustomerListPageViewModel.cs es un viewModel estándar en el patrón MVVM. Es donde se encuentra la lógica fundamental de la página de la aplicación y la página con la que trabajará más en el tutorial. Cada acción de interfaz de usuario realizada por el usuario se pasa a través de la vista a este ViewModel para su procesamiento.

Sin embargo, CustomerViewModel.cs no está asociado a ninguna vista específica. En su lugar, asocia un concepto de programación (que se han editado las propiedades) con los datos contenidos en el modelo de un cliente individual.

Modelos

Esta aplicación contiene tres modelos, que almacenan los datos de la aplicación y proporcionan interfaces para interactuar con el repositorio. Aunque estas son partes críticas de la aplicación, no son algo que se va a editar directamente en el tutorial.

Lo más importante es Customer.cs, que describe la estructura de datos customer que va a usar en el tutorial.

Nota

En el tutorial se omiten las propiedades Email y Phone del objeto Customer. Si quieres ir más allá de lo que se presenta aquí, agregar estas dos propiedades a la interfaz de usuario de la aplicación es un buen primer paso.

Repositorio

La carpeta Repository contiene clases que construyen e interactúan con la base de datos SQLite local. En el tutorial, la base de datos SQLite se presenta tal y como está. Aunque agregará código a CustomerListPageViewModel.cs para llamar a métodos definidos por estas clases, no tendrá que realizar ningún cambio para configurarlos.

Para obtener más información sobre SQLite en UWP, consulta este artículo.

Si prueba la sección "Ir más allá" del tutorial, aquí es donde creará una clase para conectarse a la base de datos REST remota. También implementará la interfaz ICustomerRepository definida en la sección Modelos, pero tendrá un aspecto muy diferente al de su homólogo de SQLite.

Otros elementos

Como es habitual para las aplicaciones para UWP, el comportamiento de inicio de la aplicación se define en la clase App.xaml.cs . La mayoría del código aquí es el código predeterminado para cualquier aplicación para UWP. Pero ya hemos realizado algunos pequeños cambios:

  • Hemos especificado que la aplicación debe mostrar CustomerListPage al iniciarse.
  • Hemos creado un objeto Repository, que contendrá el origen de datos que estamos usando.
  • Hemos agregado un método SQLiteDatabase , que inicializa la base de datos local y la establece como el repositorio especificado.

Si prueba la sección "Ir más allá", agregará un método similar para inicializar un objeto rest Respository. Dado que hemos separado nuestros problemas y estamos usando la misma interfaz definida para las operaciones DE SQLite y REST, este será el único código existente que tendrá que cambiar para usar REST en lugar de SQLite en la aplicación.

Pasos siguientes

Si ya ha completado el tutorial, puede consultar la aplicación de ejemplo completa para ver cómo se implementan estas características a mayor escala.

De lo contrario, ahora que sabe por qué todo es donde está, debe volver al tutorial y trabajar con la estructura que acabamos de tratar.