Vídeo: consola de administración de Habr. Le permite regular el karma, calificar y prohibir usuarios.
TL; DR: En este artículo intentaré crear un panel de control cómico de Habr utilizando el entorno de desarrollo de interfaz industrial Webaccess/HMI Designer y el terminal WebOP.
La interfaz hombre-máquina (HMI) es un conjunto de sistemas para la interacción humana con máquinas controladas. Normalmente este término se aplica a sistemas industriales que tienen un operador y un panel de control.
WebOP — terminal industrial autónomo para la creación de interfaces hombre-máquina. Se utiliza para crear paneles de control de producción, sistemas de monitoreo, salas de control, controladores domésticos inteligentes, etc. Admite conexión directa a equipos industriales y puede funcionar como parte de un sistema SCADA.
Terminal WebOP - hardware
El terminal WebOP es un ordenador de bajo consumo basado en un procesador ARM, de una sola carcasa con monitor y pantalla táctil, diseñado para ejecutar un programa con una interfaz gráfica creada en HMI Designer. Dependiendo del modelo, los terminales tienen a bordo varias interfaces industriales: RS-232/422/485, bus CAN para conectar a sistemas automotrices, puerto USB Host para conectar periféricos adicionales, puerto USB Client para conectar el terminal a una computadora, audio entrada y salida de audio, lector de tarjetas MicroSD para memoria no volátil y transferencia de configuraciones.
Los dispositivos se posicionan como un sustituto económico de las PC todo en uno, para tareas que no requieren procesadores potentes ni los recursos de una computadora de escritorio completa. WebOP puede funcionar como un terminal independiente para control y entrada/salida de datos, emparejado con otros WebOP o como parte de un sistema SCADA.
El terminal WebOP puede conectarse directamente a dispositivos industriales.
Refrigeración pasiva y protección IP66
Debido a la baja disipación de calor, algunos modelos WebOP están diseñados completamente sin refrigeración por aire activa. Esto permite montar los dispositivos en áreas sensibles a los niveles de ruido y reduce la cantidad de polvo que ingresa a la carcasa.
El panel frontal está fabricado sin huecos ni juntas, tiene un nivel de protección IP66 y permite la entrada directa de agua a presión.
Panel trasero del terminal WOP-3100T
Memoria no volátil
Para evitar la pérdida de datos, WebOP dispone de 128 KB de memoria no volátil, con la que se puede trabajar del mismo modo que con la RAM. Puede almacenar lecturas de medidores y otros datos críticos. En caso de un corte de energía, los datos se guardarán y restaurarán después de reiniciar.
Actualización remota
El programa que se ejecuta en el terminal se puede actualizar de forma remota a través de una red Ethernet o mediante interfaces serie RS-232/485. Esto simplifica el mantenimiento, ya que elimina la necesidad de desplazarse a todos los terminales para actualizar el software.
Modelos WebOP
Entorno de desarrollo WebAccess/HMI Designer
Fuera de la caja, el terminal WebOP es simplemente una computadora ARM de bajo consumo en la que se puede ejecutar cualquier software, pero el objetivo de esta solución es el entorno de desarrollo de interfaz industrial propietario WebAcess/HMI. El sistema consta de dos componentes:
- Diseñador HMI — entorno para desarrollar interfaces y lógica de programación. Se ejecuta bajo Windows en la computadora del programador. El programa final se compila en un archivo y se transfiere al terminal para su ejecución en tiempo de ejecución. El programa está disponible en ruso.
- Tiempo de ejecución de HMI - tiempo de ejecución para ejecutar el programa compilado en el terminal final. Puede funcionar no sólo en terminales WebOP, sino también en Advantech UNO, MIC y computadoras de escritorio normales. Existen versiones en tiempo de ejecución para Linux, Windows, Windows CE.
Hola mundo - creando un proyecto
Comencemos a crear una interfaz de prueba para nuestro panel de control Habr. Ejecutaré el programa en la terminal.
Crear un nuevo proyecto y elegir una arquitectura.
Seleccionar el protocolo de comunicación a través del cual se cargará el programa compilado en WebOP. En este paso, puede seleccionar una interfaz serie o especificar la dirección IP del terminal.
Interfaz de creación de proyectos. En el lado izquierdo hay un diagrama de árbol de los componentes del futuro programa. Por ahora solo nos interesa el ítem Pantallas, estas son directamente las pantallas con elementos de la interfaz gráfica que se mostrarán en el terminal.
Primero, creemos dos pantallas con el texto "Hola mundo" y la capacidad de cambiar entre ellas usando botones. Para hacer esto, agregaremos una nueva pantalla, Pantalla #2, y en cada pantalla agregaremos un elemento de texto y dos botones para cambiar entre pantallas (Screen Buttons). Configuremos cada botón para cambiar a la siguiente pantalla.
Interfaz para configurar el botón para cambiar entre pantallas
El programa Hello World está listo, ahora puedes compilarlo y ejecutarlo. En la etapa de compilación pueden ocurrir errores en caso de variables o direcciones especificadas incorrectamente. Cualquier error se considera fatal; el programa se compilará sólo si no hay errores.
El entorno proporciona la capacidad de simular una terminal para que pueda depurar el programa en su computadora localmente. Hay dos tipos de simulación:
- Simulación en línea — se utilizarán todas las fuentes de datos externas especificadas en el programa. Pueden ser USO o dispositivos conectados a través de interfaces serie o Modbus TCP.
- Simulación fuera de línea — simulación sin el uso de dispositivos externos.
Si bien no disponemos de datos externos, utilizamos simulación offline, habiendo compilado previamente el programa. El programa final estará ubicado en la carpeta del proyecto, con el nombre NombreProyecto_NombrePrograma.px3
El programa que se ejecuta en la simulación se puede controlar con el cursor del ratón del mismo modo que lo haría en la pantalla táctil de un terminal WebOP. Vemos que todo funciona según lo previsto. Excelente.
Para descargar el programa a un terminal físico basta con pulsar en el botón Descargar. Pero como no configuré la conexión del terminal al entorno de desarrollo, simplemente puedes transferir el archivo usando una unidad flash USB o una tarjeta de memoria MicroSD.
La interfaz del programa es intuitiva, no revisaré todos los bloques gráficos. La creación de fondos, formas y texto será clara para cualquiera que haya utilizado programas similares a Word. Para crear una interfaz gráfica no se requieren conocimientos de programación, todos los elementos se añaden arrastrando el ratón sobre el formulario.
trabajando con la memoria
Ahora que sabemos cómo crear elementos gráficos, aprendamos a trabajar con contenido dinámico y un lenguaje de programación. Creemos un gráfico de barras que muestre datos de una variable. U $ 100. En la configuración del gráfico, seleccione el tipo de datos: entero de 16 bits y el rango de valores del gráfico: de 0 a 10.
El programa admite la escritura de scripts en tres idiomas: VBScript, JavaScript y su propio idioma. Usaré la tercera opción porque hay ejemplos en la documentación y ayuda de sintaxis automática directamente en el editor.
Agreguemos una nueva macro:
Escribamos un código simple para cambiar incrementalmente los datos en una variable que se puede rastrear en un gráfico. Sumaremos 10 a la variable y la restableceremos a cero cuando sea mayor que 100.
$U100=$U100+10
IF $U100>100
$U100=0
ENDIF
Para ejecutar el script en un bucle, configúrelo en la configuración de Configuración general como Macro principal, con un intervalo de ejecución de 250 ms.
Compilemos y ejecutemos el programa en el simulador:
En esta etapa, hemos aprendido a manipular datos en la memoria y mostrarlos visualmente. Esto ya es suficiente para crear un sistema de monitoreo simple, recibiendo datos de dispositivos externos (sensores, controladores) y registrándolos en la memoria. En HMI Designer están disponibles diferentes bloques de visualización de datos: en forma de diales circulares con flechas, diferentes tablas y gráficos. Con scripts JavaScript, puede descargar datos de fuentes externas a través de HTTP.
panel de control habr
Utilizando las habilidades adquiridas, crearemos una interfaz cómica para la consola de administración de Habr.
Nuestro control remoto debería poder:
- Cambiar perfiles de usuario
- Almacenar karma y datos de calificación.
- Cambie los valores de karma y calificación usando controles deslizantes
- Cuando haces clic en el botón "prohibir", el perfil debe marcarse como prohibido y el avatar debe cambiar a tachado.
Mostraremos cada perfil en una página separada, por lo que crearemos una página para cada perfil. Almacenaremos karma y calificación en variables locales en la memoria, que se inicializarán usando la macro de configuración cuando se inicie el programa.
Ajustar el karma y la calificación
Para ajustar el karma usaremos el control deslizante (Slide Switch). Especificamos la variable inicializada en la macro de configuración como dirección de grabación. Limitemos el rango de valores del control deslizante de 0 a 1500. Ahora, cuando el control deslizante se mueva, se escribirán nuevos datos en la memoria. En este caso, el estado inicial del control deslizante corresponderá a los valores de la variable en la memoria.
Para mostrar los valores numéricos de karma y calificación, usaremos el elemento de visualización numérico. El principio de su funcionamiento es similar al diagrama del programa de ejemplo “Hello World”, simplemente indicamos la dirección de la variable en Monitor Address.
Botón de prohibición
El botón "prohibir" se implementa mediante el elemento Toggle Switch. El principio de almacenamiento de datos es similar a los ejemplos anteriores. En la configuración, puede seleccionar diferente texto, color o imagen, según el estado del botón.
Cuando se presiona el botón, el avatar debe quedar tachado en rojo. Esto es fácil de implementar usando el bloque Visualización de imágenes. Le permite especificar múltiples imágenes asociadas con el estado del botón Toggle Switch. Para ello, al bloque se le asigna la misma dirección que al bloque con el botón y el número de estados. La imagen con placas de identificación debajo del avatar está configurada de manera similar.
Conclusión
En general, me gustó el producto. Anteriormente, tenía experiencia en el uso de una tableta Android para tareas similares, pero desarrollar una interfaz para ella es mucho más difícil y las API del navegador no permiten el acceso completo a los periféricos. Un terminal WebOP puede reemplazar una combinación de tableta, computadora y controlador Android.
HMI Designer, a pesar de su diseño arcaico, es bastante avanzado. Sin habilidades especiales de programación, puede esbozar rápidamente una interfaz de trabajo. El artículo no analiza todos los bloques gráficos, de los cuales hay muchos: tuberías animadas, cilindros, gráficos, interruptores de palanca. Es compatible con muchos controladores industriales populares listos para usar y contiene conectores de bases de datos.
referencias
Se puede descargar WebAccess/HMI Designer y el entorno de desarrollo Runtime.
→
Fuente: habr.com