IoT -knapp som styr din app: 6 steg

2025 Författare: John Day | [email protected]. Senast ändrad: 2025-01-23 15:11

Av appshedAppShedFollow Mer av författaren:

Om: Appshed är en pedagogisk plattform där elever och lärare kan lära sig App Building, Game Making och IoT/Robotics. Mer om appshed »

En av de saker jag gillar mest med mikrokontroller är möjligheten att använda dem som inmatningsenhet, till exempel kan Arduino Micro användas som en HID (human interface device) vilket innebär att med lite kodning och knowhow kan du göra ditt eget tangentbord eller mus från en Arduino! Det fick mig att tänka på hur jag skulle använda en IoT -enhet som ingång för att styra saker i en app. Så i det här projektet kommer vi att titta på hur man gör en app ansluten knapp som kan programmeras för att göra nästan vad som helst i vår app.

Steg 1: Installera biblioteken

För att ladda upp vår kod kommer vi att använda den mycket populära Arduino IDE som kan laddas ner här. Eftersom vi nu kommer att använda webbplatsen AppShed för att styra och redigera hur styrelsen fungerar behöver vi inte fokusera på den faktiska koden som går in i styrelsen. Koden vi laddar upp är AppShed -huvudskissen som gör att webbplatsen kan styra alla pins på tavlan.

Nu för att kunna ladda upp kod till vårt kort via Arduino IDE måste vi installera dess bibliotek som gör att IDE kan prata med vårt specifika kort. Detta görs enligt följande:

• Starta Arduino IDE
• Navigera till Arkiv och klicka på Inställningar
• Mot botten bör du se "ytterligare styrelsehanterares webbadresser" följt av ett tomt utrymme
• Kopiera och klistra in detta i det tomma utrymmet

Nu måste vi installera brädorna under styrelsechefen.

• Navigera till Verktyg, sedan Board och klicka sedan på Board Manager
• Sök i ESP8266 i sökfältet
• Klicka på det första alternativet och klicka på Installera

Nu kan vår styrelse kommunicera med Arduino IDE

Steg 2: Ladda upp koden

Så vid denna tidpunkt har vi laddat ner de bibliotek som behövs för att hjälpa Arduino IDE att kommunicera med vårt IoT -kort och vi har laddat ner biblioteken som gör att AppShed -huvudskissen kan köras. Allt vi behöver göra är att ändra namn och lösenord för din IoT -enhet i koden om du inte gör detta kommer ditt IoT -enheters wifi -namn att vara "Your_device_name_here".

För att göra detta behöver vi följande:

• Anslut ditt IoT -kort till din dator
• Ladda ner och öppna Appshed -huvudskissen (som finns här)
• Navigera till verktyg och klicka ombord
• Rulla ner tills du ser din tavla, klicka sedan på den (jag använder NodeMCU så jag ska klicka på NodeMCU)
• Navigera nu tillbaka till verktyg och klicka på port, härifrån ska du se ditt kort (ska se ut så här "com 9" om du är på windows och "/dev/cu.wchusbserial1410 'för mac)
• Klicka på den sida som vetter mot pilen för att ladda upp och vänta medan den gör det.

Om du får ett meddelande efter cirka 2 - 3 minuter och säger att du har laddat upp så fungerade allt perfekt! För att dubbelkolla att vår styrelse fungerar kan vi också gå till vår WiFi-inställning och leta efter namnet som vi gav styrelsen tidigare om det är där det fungerar.

Steg 3: Konfigurera appen

Att skapa en app som tar emot data från ett externt IoT -kort kan tyckas ganska skrämmande om du inte är en professionell apputvecklare, men det här är inte ett problem eftersom vi kommer att använda AppSheds -infrastruktur för att göra vår app vilket gör det verkligen lätt.

Vi måste börja med att gå till AppShed och antingen skapa ett gratis konto eller logga in på ett befintligt. Härifrån bör du se de två alternativen IoT Builder eller App Builder, vi ska börja med att klicka på IoT Builder eftersom detta låter oss ställa in vilka stift vi vill fungera som utgångar eller ingångar. När sidan är laddad klickar du på Nytt IoT -projekt och namnger kortets ingång och klickar på Spara.

Nu eftersom vi vill ställa in en av stiften som en ingång för att se när knappen trycks in måste vi börja med att klicka på knappikonen under Digitala ingångar och klicka sedan på Pin 1 för att knyta ihop dem och ge det ett namn som " knappen "och klicka på spara.

Nu ska vi gå över till App Building -sidan av saker.

Steg 4: Skapa appen

Nu går vi tillbaka till den målsidan efter att ha loggat in och klickar på App Builder den här gången. Du bör presenteras med en simulerad telefon. Vi måste börja med att klicka på plusknappen för att starta en ny app. När det är laddat är det absolut första vi behöver göra att länka det IoT -kort som vi just gjorde till vår app. Nu när kortet är laddat kan vi börja lägga till funktioner i appen.

Vi börjar med att klicka på inmatningsrutan under formulär och beteckna det Button State. Vi måste sedan namnge den -knappen, det här är viktigt eftersom vi namngav knappen en knapp tidigare så att namnge den -knappen hjälper till att knyta ihop dessa två saker. Nu klickar vi bara på spara och appen är klar!

Steg 5: Publicering och testning

Nu när den super grundläggande appen är byggd måste vi publicera den och få den på vår telefon. Vi gör detta genom att klicka på publicera -knappen, när det är klart måste vi navigera till fliken dela och klicka på QR -kod som sedan kommer att visa dig en QR -kod som du kan skanna med din telefon.

När den webbappen har laddats behövde vi ansluta vår telefon till våra IoT-enheter WiFi som vi gör genom att gå över till WiFi-inställningen på din telefon och sedan ansluta till enhetsnamnet som vi gav den tidigare.

Nu kan vi gå tillbaka till appen och trycka på knappen på våra IoT -enheter. Du bör se en 1 när knappen trycks in och en 0 när knappen inte trycks in. Om du inte ser något värde, försök att uppdatera sidan och du bör se ett värde dyka upp.

Steg 6: Ta det vidare

Nu är det bara lite tråkigt att bara se en 1 eller 0, men poängen med detta projekt är bara att visa dig vad som är möjligt, det är ditt jobb att ta det vidare och skapa något riktigt fantastiskt. Som ett exempel kan du ställa in appen för att utlösa ett ljud eller spela upp en video (här är ett exempel på detta

Om du har några frågor, vänligen lämna oss en kommentar, tack för att du läste!