Isi kandungan:

Makluman Pemberitahuan Visual: 9 Langkah
Makluman Pemberitahuan Visual: 9 Langkah

Video: Makluman Pemberitahuan Visual: 9 Langkah

Video: Makluman Pemberitahuan Visual: 9 Langkah
Video: [Motion Grafis] Teknologi di Era Digital Berkembang Pesat 2024, Julai
Anonim

Tutorial ini mengajar anda cara membuat kod untuk memberitahu Phillips Hue agar berjaga-jaga. Ia sangat berguna bagi orang-orang yang Pekak dan Gangguan Pendengaran, mempunyai masalah penglihatan atau cacat pendengaran. Makluman Pemberitahuan Visual adalah untuk memberitahu pengguna setelah mendapat pemberitahuan dari e-mel, Facebook, Trello, atau yang serupa. Mentol Hue LED mula berjaga-jaga dengan menyalakan cahaya.

Photon Particle adalah kit pengembangan Wi-Fi kecil yang dapat diprogramkan untuk memprotaip dan menskalakan produk Internet of Things anda.

Langkah 1: Senarai Perkakasan dan Perisian

Anda memerlukan perkakasan dan perisian untuk mengembangkan kod untuk Makluman Pemberitahuan Visual.

Perkakasan

  • Kit Pembuat Zarah
  • Philips Hue - Starter Kit (3 mentol lampu LED dan 1 Jambatan Hue)

Perisian

  • Maklumat am Foton Zarah
  • Web Particle IDE (Build) * Diperlukan untuk log masuk *
  • IFTTT (Sekiranya Ini Kemudian)

Langkah 2: Pemasangan

Anda harus mempunyai Kit Pembuat Partikel anda, yang merangkumi segalanya, seperti sensor, wayar pelompat, LED, perintang dan banyak lagi. Anda boleh membaca lebih banyak maklumat mengenai Particle Photon.

Sebelum menyambungkan foton anda, anda perlu mengetahui status LED pada Photon. Berikut adalah maklumat mengenai status LED.

Sambungkan Foton Anda

  1. Pasangkan kabel USB ke sumber kuasa anda. (Komputer anda berfungsi dengan sempurna untuk tujuan ini). Peranti zarah anda tidak memerlukan komputer anda untuk menyambung ke wifi.
  2. Apabila terpasang, LED RGB pada peranti foton anda akan mula berkelip biru. Sekiranya peranti anda tidak berkedip biru, tahan butang SETUP selama 10 saat, kemudian lepaskan butang SETUP.
  3. Log masuk Setup Particle jika anda sudah mempunyai akaun. Sekiranya anda tidak mempunyai akaun, buat akaun Photon.
  4. Klik pada Siri Photon / P.
  5. Setelah mengklik NEXT, anda akan diberikan fail (photonsetup.html)
  6. Klik TERUSKAN DENGAN FILE TEMPATAN untuk memuat turun fail.

Selepas membuka fail

  1. Sambungkan PC anda ke Photon, dengan menyambung ke rangkaian bernama PHOTON-…
  2. Konfigurasikan kelayakan Wi-FI anda. Catatan: jika anda salah menaip kelayakan anda, Photon akan berkelip biru tua atau hijau. Anda harus melalui proses itu lagi dengan memuat semula halaman atau mengklik bahagian proses percubaan semula.
  3. Namakan semula peranti anda. Anda akan melihat pengesahan sama ada peranti itu dituntut atau tidak.

Sebelum beralih ke bahagian seterusnya, jika peranti Photon anda mempunyai sian pernafasan, maka berjaya ke Internet dan Photon Cloud! Kami menuju ke Particle IDE, Build.

Langkah 3: Pengekodan dalam IDE Partikel

Anda perlu membuat akaun anda untuk Particle IDE, Build. Sekiranya anda sudah mempunyai akaun, maka hebat! Log masuk IDE Zarah.

Kami ingin menguji untuk melihat sama ada LED berkedip di papan. Terdapat LED biru kecil di papan Photon anda. Ia bersebelahan dengan D7. Anda boleh memuat turun fail, mulai-blinknet.ino, dan melihat kodnya di sana. Ada penjelasan. Klik pautan ini untuk membuka kod sumber di Particle Web IDE. Sekiranya D7 (LED biru kecil) berkedip, selamat, anda hanya mengedipkan LED menggunakan peranti Partikel anda! Sekiranya anda ingin mengetahui lebih lanjut mengenai Photon, seperti berkelip LED yang berbeza, membaca sensor foto, dan lain-lain, berikut adalah pautan.

Sekarang, kita akan berpindah ke Philips Hue.

Langkah 4: Philips Hue

Image
Image
Philips Hue
Philips Hue
Philips Hue
Philips Hue

Untuk rujukan: Klik di sini mengenai Phillips Hue API.

Sebelum anda dapat mengakses dokumentasi Philips Hue API, anda perlu mendaftar sebagai pembangun. Ia percuma, tetapi anda perlu menerima terma dan syarat.

1. Pertama, pastikan Jambatan Philips Hue (gambar pertama) anda disambungkan ke rangkaian anda berfungsi dengan baik. Aplikasi Test Hue (Aplikasi Hue tersedia di iOS dan Android) yang mengawal cahaya pada rangkaian yang sama.

Sekiranya anda berjaya mengujinya, anda perlu menemui alamat IP jambatan di rangkaian anda. Gunakan penemuan pelayan broker Philips dengan melayari www.meethue.com/api/nupnp.

Apabila anda menemui alamat IP anda, taipkannya ke bar alamat penyemak imbas anda dengan debug / clip.html ditambahkan ke URL: https:// Bridge IP Address / debug / clip.html. Anda akan melihat antara muka (gambar kedua) seperti ini. Catatan: Ganti "alamat IP jambatan" ke alamat IP anda.

2. Mari buat perintah mudah dan dapatkan maklumat mengenai sistem rona anda. Isi butiran di bawah membiarkan badan kosong dan tekan butang GET. Anda harus melihat antara muka (gambar ketiga) seperti ini. Anda harus mendapat mesej ralat. Catatan: Ganti "alamat IP jambatan" ke alamat IP anda.

Alamat: https:// jambatan Alamat IP / api / newdeveloperBadan: Kaedah: GET Selamat! Anda hanya menghantar arahan pertama anda! 3. Seterusnya, isikan maklumat di bawah dan tekan butang POST. Catatan: Ganti "alamat IP jambatan" ke alamat IP anda dan "nama fonet" ke telefon anda sendiri.

Alamat: https:// bridge IP address / apiBody: {"devicetype": "my_hue_app # phonetype name"} Kaedah: POST

Pautan membantu membuatnya untuk anda. Apabila anda menekan butang POST, anda akan mendapat kembali mesej ralat (gambar keempat) yang memberitahu anda bahawa anda harus menekan butang pautan di Jambatan Hue. Ini adalah langkah keselamatan sehingga hanya aplikasi atau pelayan yang anda inginkan untuk mengawal lampu anda. Dengan menekan pautan di Jambatan Hue, ini membuktikan bahawa pengguna mempunyai akses fizikal ke jambatan rona.

Apabila anda mendapat sambutan yang berjaya (gambar kelima), tahniah! Anda baru sahaja membuat pengguna yang sah, yang akan kami gunakan mulai sekarang.

4. Contoh terakhir sebelum kita mengintegrasikannya ke dalam Partikel Foton, pastikan salah satu lampu anda kelihatan dan menyala, dan anda perlu mengetahui lampu nombor mana. Tukar URL ke / api / nama pengguna / lampu / nombor / keadaan cahaya (ubah nombor cahaya [boleh jadi 1, 2, 3, atau?]), Dan hantarkan butang PUT dengan data berikut:

Catatan: Pastikan anda menukar alamat IP jambatan, nama pengguna, dan nombor cahaya

Alamat: https:// alamat IP jambatan / api / nama pengguna / lampu / nombor cahaya / negeri

Isi: {"on": true, "sat": 254, "bri": 254, "hue": 10000}

Kaedah: PUT Anda mesti melihat cahaya anda berubah warna:

Langkah 5: Menetapkan Foton Dengan Butang dan Wayar

Menetapkan Foton Dengan Butang dan Wayar
Menetapkan Foton Dengan Butang dan Wayar
Menetapkan Foton Dengan Butang dan Wayar
Menetapkan Foton Dengan Butang dan Wayar

Sebelum kami mengembangkan lebih banyak kod ke Photon Web IDE, kami ingin menyiapkan Photon kami dengan butang dan wayar. Anda mempunyai beberapa butang dan banyak wayar dari Particle Starter Kit anda. Saya telah melampirkan dua gambar, satu adalah rajah dan satu adalah gambar sebenar.

  1. Pastikan anda meletakkan foton anda di papan roti.
  2. Letakkan butang di bahagian bawah papan roti seperti yang ditunjukkan dalam gambar.
  3. Letakkan hujung wayar hitam di J4 (GND) dan letakkan hujung wayar hitam yang lain di J30.
  4. Letakkan hujung wayar kuning di J7 (D5) dan letakkan hujung wayar kuning yang lain di J28.

Sekiranya ia sesuai dengan gambar saya, saya tunjukkan kepada anda, maka anda bagus!

Langkah 6: Menulis Kod dalam Zarah Foton

Menulis Kod dalam Zarah Foton
Menulis Kod dalam Zarah Foton

Kami akan membuat aplikasi pertama kami dalam Photon Particle - Web IDE.

  1. Pergi ke https://build.particle.io/build dan log masuk (daftar jika anda belum membuat)
  2. Taip "Makluman Pemberitahuan Visual" di bawah Aplikasi Semasa.
  3. Tekan butang Enter (lihat gambar pertama).

Aplikasi ini disimpan di Photon Particle Cloud. Fungsi setup () dipanggil ketika aplikasi dimulakan dan dijalankan sekali. Fungsi gelung () melakukan dengan tepat apa yang dilakukannya dan gelung berturut-turut, yang membolehkan aplikasi anda berubah dan bertindak balas.

Untuk menambahkan HttpClient untuk Partikel Foton:

  1. Klik Perpustakaan dari kiri bawah IDE Web.
  2. Taip "HttpClient" di bar carian.
  3. Klik "Sertakan Dalam projek" di butang biru.
  4. Klik Makluman VisualNotification (ia menghilangkan ruang selepas anda membuat aplikasi).
  5. Klik Sahkan.

Sekarang, Ia menambah HttpClient pada awal Web IDE.

/ Pernyataan #include ini ditambahkan secara automatik oleh IDE Partikel. # Include

/ *** Konfigurasi untuk Philip Hue ***

/ 1. Ganti ini dengan nama pengguna API anda dari Langkah 1 const String API_USERNAME = "Nama pengguna API anda"; // 2. Ganti ini dengan alamat IP jambatan anda dari Langkah 1 IPAddress hueIP (x, x, x, x); // 3. Ganti dengan jalan ke lampu yang ingin anda kendalikan. Gunakan laman web dari Langkah 1 untuk mengesahkan ia berfungsi. // Pastikan anda mengenali bilangan lampu Philip Hue // / lights / NUMBER / state const String LIGHT_PATH = "/ lights / Number / state"; // 4. Ganti ini dengan isi permintaan anda untuk menyalakan lampu. const String REQUEST_BODY_ON = "{" on / ": true, \" bri / ": 254}"; // 5. Ganti ini dengan isi permintaan anda untuk mematikan lampu. const String REQUEST_BODY_OFF = "{" on / ": false, \" bri / ": 254}"; / *** Konfigurasi TAMAT untuk Philip Hue *** / Button const int BUTTON_PIN = D5; // Objek HttpClient digunakan untuk membuat permintaan HTTP ke Hue bridge HttpClient http; // Header lalai untuk permintaan HTTP http_header_t header = {{"Terima", "* / *"}, {NULL, NULL} // CATATAN: Sentiasa menamatkan tajuk akan NULL}; // Permintaan dan objek respons http_request_t permintaan; Tanggapan http_response_t; batal persediaan () {Serial.begin (9600); request.ip = hueIP; request.port = 80; // LED onboard sebagai lampu indikator untuk pinMode tap yang disedari (D7, OUTPUT); // Untuk input, kami mendefinisikan BUTTON_UP sebagai input-pullup. Ini menggunakan resistor penarik dalaman // untuk menguruskan bacaan yang konsisten dari peranti. pinMode (BUTTON_PIN, INPUT_PULLUP); // menetapkan pin sebagai input // Kami "Langgan" ke acara IFTTT kami yang disebut Button sehingga kami mendapat acara untuknya Particle.subscribe ("RIT_Gmail", myHandler); Particle.subscribe ("Trello", myHandler); } // setup () function loop void () {/ * * Ini adalah bahagian pengujian untuk mengetahui apakah isyarat cahaya * / // mengetahui sama ada butang itu ditekan atau tidak dengan membacanya. int buttonState = digitalRead (BUTTON_PIN); // Apabila butang Ditekan, kita akan mendapat isyarat RENDAH. // Apabila butang TIDAK DITUKAR, kita akan mendapat TINGGI. jika (buttonState == RENDAH) gmailAlert (); } // loop () fungsi batal printInfo () {Serial.print ("Application> / tResponse status:"); Serial.println (respons.status); Serial.print ("Aplikasi> / tHTTP Badan Respons:"); Serial.println (respons.body); } // printInfo () fungsi int i = 0; // Fungsi yang mengendalikan peristiwa dari IFTTT membatalkan myHandler (const char * event, const char * data) {// Uji untuk mencetak dalam siri Serial.print (event); Serial.print (", data:"); jika (data) Serial.println (data); lain Serial.println ("NULL"); if (strcmp (event, "Trello") == 0) {trelloAlert (); } lain jika (strcmp (acara, "Gmail") == 0) {gmailAlert (); }} // myHandler () fungsi / ** Nilai rona untuk menetapkan cahaya ke. * Nilai rona adalah nilai pembungkus antara 0 dan 65535. * Kedua 0 dan 65535 berwarna merah, * 25500 berwarna hijau dan 46920 berwarna biru. * / / ** * Ia akan memberi amaran menggunakan Mentol Pintar Philips Hue menggunakan warna biru. Ia akan berjaga-jaga selama 15 saat. * / batal trelloAlert () {String trello_body_alert = "{" on / ": true, \" bri / ": 255, \" sat / ": 255, \" hue / ": 46920, \" alert / ": / "pilih \"} "; sendHttpPut (trello_body_alert); } / ** * Ia akan memberi amaran menggunakan Mentol Pintar Philips Hue menggunakan warna merah. Ia akan berjaga-jaga selama 15 saat. * / batal gmailAlert () {String gmail_body_alert = "{" on / ": true, \" sat / ": 254, \" bri / ": 254, \" hue / ": 65535, \" alert / ": / "pilih \"} "; sendHttpPut (gmail_body_alert); } / ** * Kami akan menghantar PUT ke Philips Hue * @param httpPutBody badan rentetan * / batal sendHttpPut (String httpPutBody) {request.path = "/ api /" + API_USERNAME + LIGHT_PATH; request.body = httpPutBody; http.put (permintaan, respons, tajuk); }

Apabila anda selesai menaip atau menyalin kod ke IDE Web Partikel Foton anda, klik ikon semak (Sahkan) di kiri atas bar. Sekiranya ia berjaya dipatuhi, maka kita akan pergi ke langkah seterusnya!

Langkah 7: Memuat naik Kod ke Photon

Langkah ini sangat mudah. Sebelum kita memuat naik kod ke Photon:

  1. Pasangkan kabel USB ke sumber kuasa anda (saya cadangkan komputer riba).
  2. Pastikan foton anda mempunyai LED sian bernafas. Sekiranya tidak bernafas cyan atau mempunyai warna yang berbeza, pergi ke Langkah 2: Pemasangan
  3. Klik ikon Pencahayaan dari IDE Web Partikel Foton.
  4. Apabila memuat naik kod ke Photon, anda akan melihat magenta. Ini bermaksud kod mula dimuat ke kod. Kemudian, ia akan berkedip hijau dengan cepat, kemudian kembali ke pernafasan sian.
  5. Tekan butang untuk melihat apakah Mentol Pintar Philips anda berkelip (atau amaran).

Sekiranya Philips Smart Bulb memberi amaran, tahniah! Kami hampir selesai!

Kami akan beralih ke bahagian perisian.

Langkah 8: Membuat Applet Dari IFTTT (Jika Ini, Kemudian Itu)

Kami akan membuat applet dari laman web IFTTT (If This, Then That). Applet akan menerbitkan acara ke Photon, dan kemudian Photon menghantar arahan ke Philips Hue Bridge untuk memberi tahu lampu pintar.

Untuk projek ini, kami akan menggunakan Trello dan Gmail untuk menerbitkan acara ke Photon.

Pergi ke https://ifttt.com/ dan daftar.

Trello

  1. Klik Applet Saya di bahagian atas.
  2. Klik Applet Baru.
  3. Klik + ini dalam teks biru.
  4. Taip Trello di bar carian dan klik.
  5. Klik Kad yang diberikan kepada saya.
  6. Pilih papan anda dari Trello.
  7. Klik + itu dalam teks biru.
  8. Taip Partikel di bar carian dan klik.
  9. Klik Terbitkan acara.
  10. Taip "Trello" di Kemudian terbitkan (Event Event).
  11. Pilih umum.

Gmail (Catatan: mereka akan menggunakan alamat e-mel anda ketika anda mendaftar)

  1. Klik Applet Saya di bahagian atas.
  2. Klik Applet Baru.
  3. Klik + ini dalam teks biru.
  4. Taipkan Gmail di bar carian dan klik
  5. Pilih Sebarang e-mel baru dalam peti masuk
  6. Klik + itu dalam teks biru.
  7. Taip Partikel di bar carian dan klik
  8. Klik Terbitkan acara.
  9. Taip "Gmail" di Kemudian terbitkan (Event Event).
  10. Pilih umum.

Setelah anda mempunyai dua applet, Trello dan Gmail berfungsi, kami beralih ke langkah terakhir.

Langkah 9: Akhirnya, Menguji

Kami akan menguji untuk menerbitkan acara dari Applets hingga Photon. Pastikan applet anda dihidupkan.

Trello

Apabila seseorang membuat kad baru di Trello, mereka akan memberikan (tag) anda dalam kad tersebut. IFTTT mendengarnya dan mula menerbitkan acara ke Photon. Kemudian Photon menghantar arahan ke Jambatan Philip Hue untuk memberi amaran kepada lampu pintar.

Gmail

Apabila anda mendapat e-mel baru di peti masuk anda, IFTTT mendengarnya dan mula menerbitkan sebuah acara ke Photon. Kemudian Photon menghantar arahan ke Philip Hue Bridge untuk memberi amaran kepada lampu pintar.

Cabaran

  • Setiap kali kami mendapat pemberitahuan baru dari Trello dan Gmail, ada penundaan besar untuk mengirim acara dari IFTTT dan mengirim perintah dari Photon. Perlu masa kurang dari 5 minit untuk memberi amaran kepada lampu pintar.
  • Kadang-kadang Applet Gmail dimatikan sendiri kerana applet perlu disambungkan semula atau dikemas kini.

Disyorkan: