Température, humidité et pression BME280 sur l'affichage Nextion

Applications et services en ligne

	Visuino - Environnement de développement graphique pour Arduino
	Arduino IDE

À propos de ce projet

Il existe de nombreux Affichage options pour ajouter une interface utilisateur graphique à Arduino planches. La plupart d'entre eux nécessitent cependant une quantité de mémoire et un temps de traitement considérables, et ne conviennent pas à Arduino cartes avec une mémoire limitée et une puissance de traitement telle que Arduino UNO ou Arduino Nano . Lorsque la mémoire est limitée et qu'une interface utilisateur avancée est nécessaire, les écrans série Nextion programmables intelligents sont un choix populaire. Le Itead propose un éditeur graphique Nextion gratuit pour la conception de l'interface utilisateur de l'écran.

BME280 est une température combinée très précise , Humidité , et Pression barométrique capteur. Il peut être connecté avec I2C ou SPI interface,

Visuino a un affichage Nextion complet support, et j'ai prévu un tutoriel pour le Nextion soutien pendant un certain temps. Je voulais aussi faire un tuto pour le BME280 capteur. Finalement j'ai décidé de les combiner, et de faire un seul tutoriel affichant la Température , Humidité , et Pression barométrique du BME280 sur les 3 canaux d'un Scope (Forme d'onde ) sur le Nextion Display .

Étape 1 : Composants

• Un Arduino carte compatible (j'utilise Arduino Nano, car j'en ai une, mais toute autre ira très bien)

• Un module de capteur BME280

• Un écran intelligent d'interface série Nextion (J'ai utilisé NX4024K032_11 mais tout autre devrait également fonctionner)

• 4 Femelle-Femelle fils de liaison

• Pour programmer l'affichage vous aurez également besoin d'un 5V Module convertisseur série USB vers TTL

Étape 2 :Connectez l'écran Nextion au module de communication série USB

Pour programmer le Nextion Display avec l'Éditeur Nextion vous devez le connecter avec un convertisseur série USB vers TTL à votre ordinateur :

• Connectez le Connecteur Nextion Wires à l'Affichage (Image 1 )

• Si votre module USB vers série est configurable, assurez-vous qu'il est configuré pour fournir une alimentation 5 V (Image 2 ) (Dans mon cas, j'avais besoin de le configurer avec un cavalier de sélection de puissance)

• Connectez le fil de terre (Fil noir ) depuis Nextion Display à la goupille de terre du module convertisseur série USB vers TTL (Image 2 )

• Connectez le fil d'alimentation (+5 V) (Fil rouge ) depuis Nextion Display à la broche Power(VCC/+5V) du module convertisseur série USB vers TTL (Image 2 )

• Connectez le fil RX (Fil jaune ) depuis Nextion Display à la pin TX du module convertisseur série USB vers TTL (Image 2 )

• Connectez le fil TX (Fil bleu ) depuis Nextion Display à la pin RX du module convertisseur série USB vers TTL (Image 2 )

• Connectez le module convertisseur série USB vers TTL à l'ordinateur avec un câble USB (Image 3 )

Étape 3 :Démarrez l'éditeur Nextion et sélectionnez le type d'affichage et l'orientation

Pour programmer le Nextion Display , vous devrez Télécharger et installer Nextion Editor .

• Démarrez l'Éditeur Nextion (Image 1 )

• Depuis le Menu sélectionnez |FichierNouveau | (Image 1 )

• Dans le "Enregistrer sous ", saisissez le nom du fichier du projet et sélectionnez un emplacement pour enregistrer le projet (Image 2 )

• Cliquez sur "Enregistrer bouton " (Image 2 )

• Dans les "Paramètres ", sélectionnez le Type d'affichage (Dans mon cas NX4024K032_11 ) (Image 3 )

• Cliquez sur "AFFICHAGE " sur la gauche pour afficher les Paramètres d'affichage (Image 4 )

• Sélectionnez Horizontal orientation de l'affichage (Image 4 )

• Cliquez sur le "OK " pour fermer la boîte de dialogue (Image 4 )

Étape 4 :Dans l'éditeur Nextion :ajoutez et configurez le composant Waveform (Scope)

Nous devons ajouter un composant Scope et le configurer pour avoir 3 canaux pour la Température , Pression , et Humidité :

• Dans la "Boîte à outils " sur le clic gauche sur la " forme d'onde composant " (Image 1 ) pour l'ajouter à la zone de conception (Image 2 )

• Redimensionner le composant pour remplir l'affichage (Image 3 )

• Dans "Attribut " boîte à outils, définissez la valeur du "ch " attribut à "3 " (Image 3 )

• Dans "Attribut " boîte à outils, définissez la valeur du "dir " attribut à "droite à gauche " (Image 4 )

Étape 5 :Dans l'éditeur Nextion :téléchargez le projet sur l'écran Nextion

• Cliquez sur "Télécharger bouton " (Image 1 )

• Dans "Télécharger sur l'appareil Nextion ", cliquez sur le bouton "Aller bouton " (Image 2 ) pour démarrer le téléchargement (Image 3 )

• Lorsque le téléchargement est terminé (Image 4 ), cliquez sur le bouton "Quitter " pour fermer la boîte de dialogue.

Étape 6 :Démarrez Visuino et sélectionnez le type de carte Arduino

Depuis l'Arduino Nano n'a qu'un seul port série , et il est nécessaire de programmer l'Arduino , vous devrez programmer l'Arduino Nano avant le Nextion Display est connecté.

Pour commencer à programmer l'Arduino, vous aurez besoin de l'Arduino IDE installé à partir d'ici :http://www.arduino.cc/ .

Veuillez noter qu'il existe des bogues critiques dans Arduino IDE 1.6.6.

Assurez-vous d'installer la version 1.6.7 ou supérieure, sinon ce didacticiel ne fonctionnera pas !

Le Visuino :https://www.visuino.com doit également être installé.

• Démarrer Visuino comme le montre la première image

• Cliquez sur "Outils " sur l'Arduino composant (Image 1 ) dans Visuino

• Lorsque la boîte de dialogue apparaît, sélectionnez Arduino Nano comme le montre l'Image 2

Étape 7 :Dans Visuino :ajoutez le composant Nextion Display et l'élément Scope

Pour contrôler l'affichage Nextion, nous devons ajouter le composant Nextion Display dans Visuino, puis lui ajouter un élément pour contrôler la portée :

• Tapez "suivant " dans la zone Filtre de la boîte à outils des composants, puis sélectionnez "Nextion Display composant " (Image 1 ), et déposez-le dans la zone de conception

• Cliquez sur "Outils " du bouton DisplayNextion1 composant (Image 2 )

• Dans les "Éléments " éditeur sélectionnez le "Portée (Vague) ", puis cliquez sur le bouton "" à gauche (Image 2 ) pour ajouter Portée élément (Image 3 )

Étape 8 :Dans Visuino :ajoutez 3 canaux à l'élément Scope et connectez le Nextion Display

Ensuite, nous devons ajouter des canaux à la portée.

• Dans l'inspecteur d'objets, cliquez sur le bouton "... " à côté de la valeur des "Canaux " sous-propriété du Scope1 élément (Image 1 )

• Dans l'éditeur de chaînes, sélectionnez "Chaîne ” à droite, puis cliquez 3 fois sur le bouton "" à gauche (Image 2 ) pour ajouter 3 canaux (Image 3 )

• Fermer les "Chaînes " et l'affichage "Éléments " dialogues

• Connectez le "Sortie " broche de sortie du DisplayNextion1 composant au vers le "In " broche d'entrée du "Série[ 0 ] " canal de l'Arduino composant (Image 4 )

Étape 9 :Dans Visuino :ajoutez et configurez 3 composants de plage de cartes

Les canaux Nextion Display Scope sont conçus pour afficher des valeurs comprises entre 0,0 et 1.0 . Pour afficher la température, l'humidité et la pression, nous devons convertir les valeurs en 0,0 à 1.0 intervalle. Nous pouvons utiliser les composants Map Range pour cela :

• Tapez "carte " dans la zone Filtre de la boîte à outils des composants, puis sélectionnez la "Plage de carte composant " (Image 1 ), et supprimez 3 d'entre eux dans la zone de conception

• Sélectionnez la MapRange1 composant (Image 2 )

• Dans l'inspecteur d'objets, développez la "Plage d'entrée " propriété (Image 2 )

• Dans l'inspecteur d'objets, définissez la valeur de "Max " sous-propriété de la "Plage d'entrée " propriété à "101000 " (Image 2 ) (Vous devrez peut-être définir une valeur différente, si la pression atmosphérique à votre emplacement est très différente)

• Dans l'inspecteur d'objets, définissez la valeur de "Min " sous-propriété de la "Plage d'entrée " propriété à "99000 " (Image 2 ) (Vous devrez peut-être définir une valeur différente, si la pression atmosphérique à votre emplacement est très différente)

• Sélectionnez la MapRange2 composant (Image 3 )

• Dans l'inspecteur d'objets, développez la "Plage d'entrée " propriété (Image 3 )

• Dans l'inspecteur d'objets, définissez la valeur de "Max " sous-propriété de la "Plage d'entrée " propriété à "100 " (Image 3 )

• Dans l'inspecteur d'objets, définissez la valeur de "Min " sous-propriété de la "Plage d'entrée " propriété à "-20 " (Image 3 )

• Sélectionnez la MapRange3 composant (Image 4 )

• Dans l'inspecteur d'objets, développez la "Plage d'entrée " propriété (Image 4 )

• Dans l'inspecteur d'objets, définissez la valeur de "Max " sous-propriété de la "Plage d'entrée " propriété à "100 " (Image 4 )

Étape 10 :Dans Visuino :connectez les composants de la plage de cartes aux canaux d'affichage Nextion

• Connectez le "Sortie " broche de sortie du MapRange1 composant au "In " broche d'entrée du "Elements.Scope1.Channels.Channel1 " de l'élément DisplayNextion1 composant (Image 1 )

• Connectez le "Sortie " broche de sortie du MapRange2 composant au "In " broche d'entrée du "Elements.Scope1.Channels.Channel2 " de l'élément DisplayNextion1 composant (Image 2 )

• Connectez le "Sortie " broche de sortie du MapRange3 composant au "In " broche d'entrée du "Elements.Scope1.Channels.Channel3 " de l'élément DisplayNextion1 composant (Image 3 )

Étape 11 :Dans Visuino :ajoutez et connectez le composant BME280

Nous devons ajouter un composant pour lire les données du module BME280 :

• Tapez "280 " dans la zone Filtre de la boîte à outils des composants puis sélectionnez " Pression Température Humidité BME280 I2C composant " (Image 1 ), et déposez-le dans la zone de conception

• Mon module BME280 a une adresse I2C sur 118 (0x76 ). Si vos modules ont une adresse différente, vous devrez définir la valeur de la "Adresse " propriété (Image 2 )

• Connectez le "Pression(Pa) " broche de sortie du PressureTemperatureHumidity1 composant au vers le "In " broche de la MapRange1 composant (Image 2 )

• Connectez la "Température " broche de sortie du PressureTemperatureHumidity1 composant au vers le "In " pin du MapRange2 composant (Image 3 )

• Connectez le "Humidité(%) " broche de sortie du PressureTemperatureHumidity1 composant au vers le "In " pin du MapRange3 composant (Image 4 )

• Connectez le "Sortie " broche de sortie du PressureTemperatureHumidity1 composant au vers le "In " broche du I2C canal de l'Arduino composant (Image 5 )

Étape 12 :Dans Visuino :ajoutez, configurez et connectez le composant Clock Generator

Nous pouvons utiliser le projet tel quel, mais il actualisera la portée très rapidement tout le temps. Il est préférable que le Scope soit mis à jour à titre d'exemple 10 fois par seconde. Pour cela, nous allons ajouter un composant d'horloge pour cadencer la lecture du capteur et la mise à jour du Scope.

• Tapez "horloge " dans la zone Filtre de la boîte à outils des composants, puis sélectionnez le "Générateur d'horloge composant " (Image 1 ), et déposez-le dans la zone de conception

• Dans l'inspecteur d'objets, définissez la valeur de la "Fréquence " propriété du ClockGenerator1 à "10 " (Image 2 )

• Connectez le "Sortie " broche de sortie du ClockGenerator1 composant à la "Horloge " broche d'entrée de la PressureTemperatureHumidity1 composant (Image 3 )

Étape 13 : générez, compilez et téléchargez le code Arduino

• En Visuino , Appuyez sur F9 ou cliquez sur le bouton affiché sur Image 1 pour générer le code Arduino et ouvrir l'IDE Arduino

• Dans l'IDE Arduino , cliquez sur Télécharger bouton, pour compiler et télécharger le code (Image 2 )

Étape 14 :connectez le capteur de température, d'humidité et de pression BME280 à Arduino

• Connectez l'alimentation VCC 3V3 (Fil rouge ), Terre (Fil noir ),SDA (Fil vert ) et SCL (Fil jaune ), au module BME280 (Image 1 )

• Connectez l'autre extrémité du fil de terre (Fil noir ) à Sol broche de l'Arduino Nano tableau (Image 2 )

• Connectez l'autre extrémité du fil d'alimentation VCC 3V3 (Fil rouge ) au 3V3 broche d'alimentation de l'Arduino Nano tableau (Image 2 )

• Connectez l'autre extrémité du fil SDA (Fil vert ) à SDA/Broche analogique 4 de l'Arduino Nano tableau (Image 2 )

• Connectez l'autre extrémité du fil SCL (Fil jaune ) à SCL/Broche analogique 5 de l'Arduino Nano tableau (Image 2 )

• Image 3 montre où sont les Terre , 3V3 Alimentation, SDA/Broche analogique 4 , et SCL/Broche analogique 5 , les broches de l'Arduino Nano

Étape 15 :connectez l'écran Nextion à l'Arduino

• Déconnectez le Nextion Display fils du module convertisseur série USB vers TTL

• Connectez le sol

• Déconnectez le Nextion Display fils du module convertisseur série USB vers TTL

• Connectez le fil de terre (Fil noir ) depuis Nextion Display à la goupille de terre de l'Arduino Nano (Image 2 )

• Connectez le fil TX (Fil bleu ) depuis Nextion Display à la broche RX(D0) de l'Arduino Nano (Image 2 )

• Connectez le fil RX (Fil jaune ) depuis Nextion Display à la broche TX(D1) de l'Arduino Nano (Image 2 )

• Image 4 montre où sont les Terre , 5V Alimentation, RX/Broche numérique 0 , et TX/Broche numérique 1 , les broches de l'Arduino Nano

• Connectez le fil d'alimentation +5 V (Fil rouge ) depuis Nextion Display à la broche d'alimentation 5 V de l'Arduino Nano (Image 3 )

• Image 4 s'affiche en rouge où sont les Terre , 5V Alimentation, RX/Broche numérique 0 , et TX/Broche numérique 1 , les broches de l'Arduino Nano (en bleu sont affichées les broches connectées à l'étape précédente)

Étape 16 :Et jouez...

Félicitations ! Vous avez terminé le projet.

Image 1 montre le projet connecté et sous tension. Comme vous pouvez le voir sur la photo, et dans la Vidéo le Portée sur l'Écran Nextion tracera la Pression , la Température , et l'Humidité depuis le Module BME280 .

Sur Image 2 vous pouvez voir le Visuino complet schéma.

Ci-joint le Visuino projet, que j'ai créé pour ce tutoriel. Vous pouvez le télécharger et l'ouvrir dans Visuino :https://www.visuino.com

L'Éditeur Nextion est également joint dans le même zip. projet pour le Nextion Display .