background image

Σχεδιασμός και υλοποίηση συστήματος IoT ασύρματου ελέγχου και μέτρησης ενέργειας 

 

69 

 

Τα components είναι επαναχρησιμοποιούμενα τμήματα κώδικα τα οποία περιέχουν 

την εμφάνιση και την λειτουργικότητα ενός τμήματος της εφαρμογής. Σε συνδυασμό με 
την  γλώσσα  JSX,  το  React  Native  δίνει  την  δυνατότητα  δημιουργίας  γραφικού 

περιβάλλοντος  με  τρόπο  που  θυμίζει  πολύ  HTML.  Ένα  component  δέχεται  κάποιες 
ιδιότητες (props) οι οποίες είναι οι παράμετροι που μπορεί να χρησιμοποιήσει και του 
παρέχονται  κατά  την  αρχικοποίηση  του.  Τέλος,  έχουμε  τις  ειδικές  μεταβλητές  της 
εφαρμογής  (state),  των  οποίων  όταν  η  τιμή  αλλάζει,  προκαλούν  και  τις  κατάλληλες 

αλλαγές στην οθόνη. Ένα παράδειγμα φαίνεται στην Εικόνα 55. 
 

 

Εικόνα 55 : Παράδειγμα κώδικα component στο React Native 

 

 

Βασική  λειτουργία  για  το  σύστημα  που  υλοποιήθηκε,  είναι  η  δυνατότητα 

αποστολής  εντολών  για  την  ενεργοποίηση/απενεργοποίηση  μιας  συσκευής  μέσω  του 
πρωτοκόλλου  MQTT.  Στο  στιγμιότυπο  στην  Εικόνα  56,  φαίνεται  η  μέθοδος  που 

αναλαμβάνει την αλλαγή της κατάστασης μιας συσκευής. Για την υλοποίηση του MQTT 
client, χρησιμοποιήθηκε το πακέτο react native MQTT. 
 

 

Εικόνα 56 : Κώδικας για την ενεργοποίηση/απενεργοποίηση συσκευής μέσω MQTT