Visor de rayos

Lightning Viewer es una aplicación que recibe datos de rayos simulados de WebSocket y los muestra en un mapa en tiempo real. Presenta una interfaz de usuario que se adapta bien a las pantallas de móviles, tabletas y ordenadores de sobremesa, tanto en orientación horizontal como vertical. Los relámpagos aparecen como iconos en el mapa, y otra capa muestra la distancia y la hora del último relámpago. Estas capas de datos se pueden ocultar y mostrar con interruptores a los que se accede pulsando el botón de capas del mapa. También hay un conmutador para cambiar entre tipos de mapa y un botón que centra el mapa en la ubicación del usuario.

Ejecutar el ejemplo

Para ejecutar el ejemplo desde Qt Creatorabra el modo Welcome y seleccione el ejemplo de Examples. Para más información, consulte Qt Creator: Tutorial: Construir y ejecutar.

Estructura de la aplicación y clases relevantes

Esta aplicación sigue el patrón Modelo-Vista-Controlador (MVC). La clase LightningItemModel sirve como modelo. Almacena una lista de objetos LightningItemData y proporciona métodos para insertar nuevos datos y obtener información sobre las últimas huelgas. La vista se define en varios componentes QML que muestran los datos y la interfaz de usuario y gestionan la interacción con el usuario. La clase Controller gestiona el flujo de datos entre LightningItemModel y los componentes QML. La clase LightningProvider abre una conexión WebSocket con un servidor en línea del que recibe un mensaje JSON por cada rayo simulado. Analiza los mensajes y transmite los datos a LightningItemModel a través de una señal conectada a una ranura de Controller:

connect(m_provider.get(), &LightningProvider::dataReady, this, &Controller::onDataReceived);

Cada relámpago está representado por una estructura LightningItemData. Contiene la fecha y hora, la latitud y la longitud del rayo, así como métodos que devuelven la distancia y la dirección desde la ubicación del usuario proporcionada en QGeoCoordinate. La estructura LastStrikeInfo contiene información sobre el último rayo.

LightningView.qml es la vista principal de la aplicación. Se encarga de mostrar el mapa y los datos sobre rayos a través del componente MapView.qml, y los controles del usuario a través del componente ActionsLayer.qml.

MapView.qml maneja el zoom y la panorámica del mapa. Utiliza un PositionSource para obtener la ubicación actual del usuario y un Map para mostrar el mapa. Además, incluye un LightningMapLayer.qml para mostrar los datos sobre rayos y un DistanceTimeLayer.qml para mostrar información sobre el último rayo.

ActionsLayer.qml proporciona un botón para volver a centrar el mapa y un control de cambio personalizado, SwitchMap.qml, para pasar de un tipo de mapa a otro. También incluye un botón de capas de mapa que revela los conmutadores de capas de mapa. Estos conmutadores se definen en MapLayersItem.qml. En orientación horizontal aparecen junto al botón de capas del mapa, mientras que en orientación horizontal se sitúan en un Drawer definido en MapLayersDrawer.qml.

Fuente de datos de rayos

La aplicación recibe datos de rayos simulados de un servidor mantenido por Qt. El servidor proporciona una API WebSocket que acepta conexiones en la siguiente URL:

wss://ewea0y4bn0.execute-api.eu-north-1.amazonaws.com/production/

Tras conectarse al servidor, la aplicación activa la alimentación de datos en directo enviando el siguiente mensaje JSON al servidor:

"{\"action\": \"simulatelightningdata\"}"

Archivos fuente

Proyecto de ejemplo @ code.qt.io