Skapa en app som använder mobilsensorer

Tack vare den nya funktionen kan du lägga till fler funktioner i apparna genom att dra nytta av funktionerna i telefonen. I den här artikeln lär du dig hur du använder produkten på en mobil enhet i Power Apps.

Det gör du genom att skapa en exempelapp med två skärmar. Den första skärmen visar aktuell kompasskurs, latitud, longitud, höjd och kan skanna NFC-taggar för att få textinformation. Den andra skärmen visar hur du visar accelerometerdata för att producera enhetens vinkel längs X- och Y-axlarna.

För att ställa in scenariot bakom den första skärmen, föreställ dig att du bygger en app för en NFC-baserad skattjakt. Varje deltagare kommer att använda appen för att skanna en NFC-tagg som ger dem en kompassriktning, latitud och longitud som leder dem till nästa destination. Vid den destinationen skannar deltagaren en ny tagg och upprepar processen tills den är slut.

På den andra skärmen kan du tänka dig att du behöver ett verktyg för att kunna mäta olika vinklar. På den andra skärmen kommer deltagaren att kunna placera eller hålla sin enhet på en yta och få vinklarna på enhetens X- och Y-axel samt visa en visuell representation av dessa vinklar.

Titta på det här videoklippet och lär dig hur du bygger en app som använder mobilsensorer:

Förutsättningar

• Vilken Power Apps licensnivå som helst kan användas för den här appen eftersom inga dataanslutningar används.

• En mobil enhet som en mobiltelefon eller surfplatta med GPS- och accelerometerfunktioner behövs eftersom de flesta datorer kanske inte har de funktioner som krävs.

• En NFC-kompatibel enhet behövs för NFC-skanningsfunktionen. Man förser också med att NFC-taggarna som ska vara förkonfigurerade så att de ger textvärden i följande exempelformat:

  "<b>Heading: </b> 80 degrees <br>
  <b>Latitude: </b> 44.4604788 <br>
  <b>Longitude: </b> -110.82813759"
  

  Texten visas i ett HTML-vänligt format för appen. Installationen av NFC-taggarna omfattas inte av den här artikeln, och NFC-elementen kan ignoreras vid behov. den primära fokusen är att använda mobilsensor i Power Apps.

Lägga till rubrik- och HTML-text för enhetssensorns utdata

Rubriketikett

När en app är öppen för redigering i Power Apps, lägg till en Textetikett på skärmen genom att dra och släppa den från fönstret Infoga. Placera den högst upp till vänster på skärmen och ändra följande egenskaper i rutan Egenskaper:

Sedan i fönstret Avancerat ändra följande egenskaper:

Det här ger en rubrik för skärmen.

HTML-text för enhetssensorns utdata

Lägg sedan till en HTML-text-kontroll. Detta används för att visa alla enhetssensorns utdata på en och samma plats. Använd den här koden i egenskapen HtmlText:

"<b><u>Current Location</u></b><br>  
<br>
<b>Compass Heading: </b>" & Round(Compass.Heading, 2) & Char(0176) &
"<br>
<br>
<b>Lat: </b>" & Location.Latitude & "<br>
<b>Long: </b>" & Location.Longitude & "<br>
<b>Alt: </b>" & Round(Location.Altitude, 2) & " m"

I fönstret Avancerat ändra följande egenskaper:

Om du undersöker vad som finns i HtmlText kan du se att det finns två typer av sensortyper som används.

För det första är detta Kompass sensor, som använder egenskapen kurs för att tillhandahålla en kompasskurs från enheten.

Den andra är Plats sensor, som tillhandahåller Latitud, Longitud och Höjd. Det finns två saker du bör tänka på om Plats. För det första, om du bara använder Plats utan punktoperatören och egenskapen, får du en post som har fält för Latitud, Longitud och Höjd. För det andra är egenskapen Höjd som standard i meter. Om du vill konvertera den till fot ersätter du följande formel:

Använd meter:

Round(Location.Altitude, 2) & " m"

Använd fot:

Round(Location.Altitude \* 3.2808, 2) & " ft"

Placera kontrollen HTML-text nära den nedre delen av skärmen.

Lägg till knapp för NFC-skanning och HTML-text-kontrol

NFC-skanningsknapp

Lägg till en knapp i appen, placerad under kontroll HTML-text som du lade till i det sista steget och ändra följande egenskaper i panelen Avancerat:

Koden i egenskapen OnSelect används för att aktivera funktionen ReadNFC() som aktiverar NFC-läsare. Därefter lagras det som läses från NFC-taggen i en samling med namnet colNFCScan. Den här samlingen innehåller fyra fält: RTD, Text, TNF och URI. Även om en fullständig förklaring av dessa fält ligger utanför den här artikelns tillämpningsområde, kan någon förklaring vara till hjälp. TNF står för Typnamnformat och används för att definiera strukturen för Definition av posttyp eller RTD, som i sin tur definierar vilken typ av post som finns i fälten Text och/eller URI. URI står för Uniform Resource Identifier, som i huvudsak är adressen till en resurs. För NFC-taggar som används i detta exempel, förutom fältet Text som innehåller exempeltexten från inledningen av denna ämne, skulle de innehålla ett TNF-värde på 1, ett RTD-värde på T och ett tomt URI-värde.

Lägg till HTML-text-kontroll för att visa NFC-skanningsinformation

Lägg till ytterligare en kontroll för HTML-text och använd följande formel i egenskapen HTMLText:

"<b><u>Next Destination</u></b><br>
<br>" &
First(colNFCScan).Text

I fönstret Avancerat ändra följande egenskaper:

Utan NFC-data kommer kontrollen att visa Nästa destination. När en NFC-tagg skannas visar den Nästa destination och sedan samlas data från fältet Text in från skanningen.

Förutsatt att data för NFC-taggarna har konfigurerats enligt beskrivningen i inledningen, kommer användaren att se nästa kompassrubrik, latitud- och longitudvärden för nästa skattjakt efter att ha skannat en av dessa taggar.

Testa appen

Spara och publicera appen. Öppna appen på en mobil enhet med nödvändiga sensorer och observera kompassens kurs-, latitud-, longitud- och höjdvärden. Prova att gå runt och vänd dig om i olika riktning om du vill se ändringar i de olika sensoravläsningarna.

Tryck på knappen Skanna NFC-tagg för att observera NFC-läsarens kontroll. Om du har en NFC-tagg som kan producera ettText-värde skannar du taggen för att observera texten i appen. Annars markerar du Avbryt.

Lägga till och konfigurera andra skärmen

Lägg till en ny Tom skärm för vinkelmätningsdelen av appen.

Efter att du lagt till skärmen går du tillbaka till första skärmen och lägger till ikonen Nästa pil från + Infoga > Ikoner > välj ikonen Nästa pil. Placera den högst upp till höger på skärmen och ändra följande egenskaper i rutan Avancerad:

Om du har bytt namn på den andra skärmen som precis lagts till ersätter du Skärm2 i funktionen Navigera.

Förhandsgranska appen och markera den ikon som just lagts till för att kontrollera att den navigerar till den tomma skärmen som just lagts till.

Lägg till konfiguration för X- och Y-vinklar

Lägg till en Textetikett på skärmen genom att dra och släppa den från fönstret Infoga. Placera den högst upp till vänster på skärmen och ändra följande egenskaper i rutan Egenskaper:

Sedan i fönstret Avancerat ändra följande egenskaper:

Det här ger en rubrik för den andra skärmen.

Lägg sedan till ikonen bakåtpil från + Infoga > Ikoner > välj ikkonen bakåtpil. Placera den högst upp till vänster på skärmen och ändra följande egenskaper i rutan Avancerad:

Om du har bytt namn på den första skärmen som precis lagts till ersätter du Skärm1 i funktionen Navigera.

Lägg slutligen till en HTML-text-kontroll. Detta används för att visa alla enhetssensorns utdata på en och samma plats. Använd följande formel i HTML-text-egenskapen:

"<b><u>Angles:</u></b><br>
<br>
<table width='100%'>
<tr>
<td width='50%'><b>X: </b>" & Abs(Round(Acceleration.X * (90 / 9.81),
0)) & Char(0176) & "</td>
<td width='50%'><b>Y: </b>" & Abs(Round(Acceleration.Y * (90 / 9.81),
0)) & Char(0176) & "</td>
</tr>
</table>"

I fliken Avancerat ändra följande egenskaper:

Placera kontrollen högst upp på appskärmen.

Om du undersöker vad som finns i HtmlText, kanske du märker att den använder sensorn Acceleration med egenskaperna X och Y. Det finns också en Z-egenskap som inte används i det här scenariot.

Denna sensor detekterar gravitationskrafter på enheten över tre plan. Om du till exempel använder en mobiltelefon kan du tänka dig en linje som sträcker sig ut från sidan av telefonen. Det är det här X-planet. Att lyfta telefonens högra sida ger ett positivt värde och att lyfta den vänstra sidan ger ett negativt värde. En linje som sträcker sig ut ur den övre och nedre delen av telefonen representerar Y-planet. Att lyfta telefonens överdel ger ett positivt värde och att lyfta nederdelen ger ett negativt värde. Slutligen skulle en linje som kommer ut från skärmen och baksidan av telefonen representera Z-planet. Att få skärmen att vända uppåt ger ett positivt värde och vänder den nedåt kommer det att resultera i ett negativt värde.

Accelerometern är en måttenhet som agerar på enheten båda i gång, t.ex. om du ignorerar enheten och i paus, till exempel rullning av enheten på en eller flera av de axlar som beskrivs ovan. I vila bör de teoretiska värdena ligga mellan 0 och +/- 9,81 m/s2, med 0 som indikerar att den relativa axeln är parallell med jorden utan att tyngdkraften påverkar sensorn och en avläsning på 9,81 som indikerar att den relativa axeln är vinkelrät till jorden och hela tyngdkraften verkar på sensorn.

Om du tittar på koden i kontrollen HTML-text som du just lagt till, tänk på följande avsnitt:

Abs(Round(Acceleration.X * (90 / 9.81), 0))

I den här formeln, inifrån och ut, ökar först Acceleration på X-planet multipliceras med (90/9,81). Detta använder det teoretiska maximala vilolägesvärdet för att omvandla sensoravläsningen till grader. Värdet på 90 finns eftersom enheten vid det högsta tillåtna värdet skulle vara försedd med enheten vinkelrät till världen på den, vilket ger ett mått på 90 gånger.

Värdet avrundas sedan till noll decimaler för att ge ett heltrundsvärde. Sist beräknas det absoluta värdet för det avrundade talet för att ge en positiv avläsning. Det spelar alltså ingen roll om man mäter den från ena eller andra sidan.

Lägga till visuella element på nivån

I det här steget ska vi använda vissa kontroller på ett okonventionellt sätt för att uppnå ett visuellt mål.

Visuella element av cirkelbubbla på samma nivå

Börja med att lägga till Knapp-kontroll på skärmen, byta namn på den till btnCircleLevel och ändra följande egenskaper i rutan Avancerat:

Resultatet av ändringarna ska skapa en cirkelknapp i mitten på skärmen som inte kan användas på grund av att den är inaktiverad.

Lägg sedan till en cirkelform, ange dess kantradie som 400 och ändra följande egenskaper i rutan Avancerat:

Egenskaperna X och Y tillåt Cirkel-form för att röra sig i mitten av appskärmen, relativ förändring i Acceleration sensorvärden men finns inom det cirkulära området btnCircleLevel.

X- och Y-axelns bubbelnivåliknande visuella element

Lägg till kontrollen Reglage till appen, byt namn på den till sldXValue och ändra följande egenskaper i rutan Avancerat:

Den här Reglage-kontrollen kommer att visa vinkeln som liknar hur en bubbelnivå gör: Hantera kommer att röra sig mot enhetens upphöjda sida, liknande luftbubblan i en bubbelnivå.

Kopiera sedan btnCircleLevel genom att markera den, trycka på Ctrl + C och sedan Ctrl + V. Byta namn på kontrollen till btnXValueOverlay och ändra följande egenskaper i rutan Avancerat:

Ändringarna placerar den över kontrollen sldXValue, vilket gör att användaren inte kan ändra värdet och skapa en visuell kantlinje.

Kopiera och klistra sldXValue, med samma metod som används för att kopiera btnCircleLevel. Byt namn sldYValue och ändra följande egenskaper:

Kopiera och klistra btnXValueOverlay, byta namn på det btnYValueOverlay, ändra följande egenskaper:

Detta slutför bubblans nivåliknande visuella element.

Testa nivåappen

Spara och publicera appen. Öppna appen på en mobil enhet och navigera till skärmen med visuella element på bubbelnivån. Enheten från vänster till höger, sedan upp och ned, och slutligen i alla riktningar, med information om förändringar i egenskaper och förändringar i visuella element. Hitta en yta där enheten kan vara på och notera visuella element och visuella element.

Se även

• Signalerna Acceleration, App, Kompass, Anslut och Plats i Power Apps
• kontrollen mixed reality i Power Apps
• Geospatial kontroller i Power Apps