Tabla de contenido:
- Paso 1: lo que necesitará
- Paso 2: Inicie Visuino y seleccione el tipo de placa M5 Stack Stick C
- Paso 3: en Visuino, agregue componentes
- Paso 4: en los componentes del conjunto de Visuino
- Paso 5: en los componentes de Visuino Connect
- Paso 6: Genere, compile y cargue el código Arduino
- Paso 7: jugar
- Paso 8: en el siguiente tutorial …
2025 Autor: John Day | [email protected]. Última modificación: 2025-01-13 06:57
En este tutorial aprenderemos cómo programar ESP32 M5Stack StickC con Arduino IDE y Visuino para mostrar una hora en la pantalla LCD y también configurar la hora usando los botones StickC.
Paso 1: lo que necesitará
M5StickC ESP32: puedes conseguirlo aquí
Programa Visuino: Descarga Visuino
Nota: Consulte este tutorial aquí sobre cómo instalar la placa StickC ESP32
Paso 2: Inicie Visuino y seleccione el tipo de placa M5 Stack Stick C
Inicie Visuino como se muestra en la primera imagen Haga clic en el botón "Herramientas" en el componente Arduino (Imagen 1) en Visuino Cuando aparezca el cuadro de diálogo, seleccione "M5 Stack Stick C" como se muestra en la Imagen 2
Paso 3: en Visuino, agregue componentes
- Haga clic en el tablero "M5 Stack Stick C" para seleccionarlo
- En la ventana "Propiedades", seleccione "Módulos" y haga clic en "+" para expandir,
- Seleccione "Display ST7735" y haga clic en "+" para expandirlo,
- Establece "Orientación" en "ir a la derecha"
- Establezca "Color de fondo" en "ClBlack"
- Seleccione "Elementos" y haga clic en el botón azul con 3 puntos …
- Se mostrará el cuadro de diálogo de elementos
- En el cuadro de diálogo Elementos, arrastre "Campo de texto" de la derecha a la izquierda.
-
Haga clic en el "Campo de texto1" en el lado izquierdo para seleccionarlo, luego en la "ventana Propiedades" haga clic en "Color" y configúrelo en "aclWhite" y haga clic en "Color de relleno" y configúrelo en "aclBlack" (Usted puedes jugar con los colores si quieres)
-también en las ventanas de propiedades configure X: 10 e Y: 20 aquí es donde desea mostrar la hora en la pantalla LCD -set size: 3 (este es el tamaño de fuente de la hora) Cierre la ventana de elementos
- Agregar el componente "Decodificar (dividir) fecha / hora"
- Agregar el componente "Texto formateado"
Paso 4: en los componentes del conjunto de Visuino
- Seleccione el componente "FormattedTxt1" y, en la ventana "Propiedades", establezca "Texto" en:% 0:% 1:% 2
- Haga doble clic en el componente "FormattedText1" y, en el cuadro de diálogo Elementos, arrastre 3 veces "Elemento de texto" hacia la izquierda.
- Seleccione la placa "M5 Stack Stick C" y en la ventana "Propiedades" seleccione "Módulos"> "Reloj despertador en tiempo real (RTC)"> "Elementos"
- Haga clic en el botón azul con 3 puntos y en el cuadro de diálogo Elementos arrastre "Establecer hora", "Establecer minuto" y "Establecer segundo" al lado izquierdo
- Seleccione a la izquierda el elemento "Establecer hora1" y, en la ventana "Propiedades", establezca "Agregar valor" en "Verdadero" y "Valor" en "1".
- Seleccione a la izquierda el elemento "Establecer Minuto1" y, en la ventana "Propiedades", establezca "Agregar valor" en "Verdadero" y "Valor" en "1".
- Seleccione a la izquierda el elemento "Establecer segundo1" y, en la ventana "Propiedades", establezca "Agregar valor" en "Verdadero" y "Valor" en "1".
Explicación:
"Valor" significa cuánto queremos agregar con cada clic de un botón al tiempo existente (ya sea horas, minutos o segundos) "Agregar valor" significa que queremos agregar el valor al tiempo existente
Paso 5: en los componentes de Visuino Connect
- Conecte "M5 Stack Stick C"> Reloj de alarma en tiempo real (RTC)> Pin [Out] al pin del componente "DecodeDateTime1" [In]
- Conecte el pin [Hora] del componente "DecodeDateTime1" al pin [In] del componente "FormattedText1" "TextElement1"
- Conecte el pin [Minuto] del componente "DecodeDateTime1" al pin [In] del componente "FormattedText1" "TextElement2"
- Conecte el pin del componente "DecodeDateTime1" [Segundo] al pin del componente "FormattedText1" "TextElement3" [In]
- Conecte el pin del componente "FormattedText1" [Out] a la placa "M5 Stack Stick C" "Display ST7735"> pin "Text Field1" [In]
- Conecte "M5 Stack Stick C"> Botones "A (M5)" a "M5 Stack Stick C"> Reloj despertador en tiempo real (RTC)> Pin "Set Hour1" [Reloj]
- Conecte "M5 Stack Stick C"> Botones "B" a "M5 Stack Stick C"> Reloj de alarma en tiempo real (RTC)> Pin "Set Minute1" [Reloj]
Paso 6: Genere, compile y cargue el código Arduino
-
En Visuino, en la parte inferior, haga clic en la pestaña "Construir", asegúrese de que esté seleccionado el puerto correcto, luego haga clic en el botón "Compilar / Construir y Cargar".
Paso 7: jugar
Si enciende el módulo M5Sticks, la pantalla debería comenzar a mostrar la hora. Puede cambiar la hora usando los botones "M5" para Horas y "B" para Minutos
¡Felicidades! Ha completado su proyecto M5Sticks con Visuino. También se adjunta el proyecto Visuino, que creé para este Instructable, puedes descargarlo aquí.
Puede descargarlo y abrirlo en Visuino:
Paso 8: en el siguiente tutorial …
En el siguiente tutorial, le mostraré cómo hacer un reloj de aspecto atractivo en el que puede configurar el tiempo (horas, minutos y segundos) usando los botones StickC y crear un menú simple. Esté atento y consulte mis otros tutoriales aquí.