PowerApps on mainio työkalu, mutta sen ominaisuudet loppuvat helposti kesken. Mutta kun sitä täydentää Flow:lla tehtävillä työnkuluilla, aukeaa aivan uusi maailma.
Muodostuu mielenkiintoinen työkalusetti jossa ei ohjelmoida, mutta jonka avulla voi tehdä vaikka mitä.
Tehdään tällä kertaa yksinkertainen PowerApps, joka käyttää aiemmin tekemääni kuvantunnistuspalvelua. Lyhyesti:
- käyttäjä ottaa kuvan
- kuva lähetetään kuvantunnistuspalvelulle analysoitavaksi
- käyttäjälle kerrotaan onko kuvassa DI huppari
Toteutuksen koukku on PowerAppsista kutsuttava Flow-työnkulku, joka tekee kaiken työn. Se lähettää PowerAppsista saamansa kuvan analysoitavaksi, purkaa saamansa tulokset ja lopuksi palauttaa yhteenvedon PowerAppsille.
Eiköhän aloiteta.
PowerAppsin luominen
Luodaan aluksi tyhjä PowerApps, ilman mitään yhdistimiä.
Lisätään tyhjälle näytölle kolme kontrollia
- kamera
- kuva
- painike
Näyttää vielä aika karulle…
PowerAppsissa valokuva otetaan tyypillisesti kamerakuvaa painamalla. Tyylikkäämpää olisi tarjota käyttäjälle painike, jolla kuva otetaan. Mutta sepä ei olekaan niin suoraviivaista kuin luulisi. Tyydymme osaamme ja lisäämme kameran (Camera1) OnSelect toimintoon rivin, joka lisää kuvan muuttujaan nimeltään img.
Sovelluksen kuva-kontrollin (Image1) tehtävänä on näyttää käyttäjälle hänen ottamansa kuva. Tämä onnistuu helposti lisäämällä sen image:n arvoksi äsken arvon saanut muuttuja (img).
Nyt meillä on PowerApps, jolla voi ottaa valokuvia.
Varsinainen toiminnallisuus – Flow
Sovelluksen pihvi, kuvan tunnistus, toteutetaan kokonaisuudessaan Flow:n avulla. Luodaan uusi työnkulku, jonka käynnistimeksi valitaan PowerApps. Näin työnkulku tulee näkyviin ja käytettäväksi PowerApps -kehitysympäristöön.
Ensimmäisenä vaiheena on Compose -toiminto, joka ottaa sisäänsä PowerAppsilta parametrina tulevan kuvan. Toisessa vaiheessa kuvatiedoston alusta poistetaan metatiedot.
Seuraavaksi kuva lähetetään aiemmin tehdylle Custom Vision servicelle analysoitavaksi. Sitä varten piipahdamme Custom Vision -palvelussa. Tarvittavat tiedot palvelun käyttämiseksi löydät klikkaamalla Performance -välilehden alta löytyvää Prediction URL -linkkiä. Meillä on käytössämme kuvatiedosto, joten seuraamme alempia ohjeita.
Lisätään työnkulkuun http-kutsu. Käytämme osoitteina ja avaimina yllä esiteltyjä arvoja. Kutsun body on JSON -muotoinen ja sisältönä on työnkulun alussa parsimamme kuvatiedosto.
Http-kutsu palauttaa pitkän rimpsun JSON-koodia. Kannattaa ajaa työnkulku kerran ja käyttää paluuarvoa esimerkkinä Parse JSON -toiminnolle. Se osaa luoda esimerkin pohjalta scheman.
JSONin parsimisen jälkeen luodaan vielä kaksi muuttujaa
- isFound – onko DI huppari löytynyt
- probability – kaikista löytyneistä DI huppareista korkein todennäköisyys
Vihdoin voimme käydä läpi Custom Vision Servicen palauttaman tulosjoukon. Tämä on helppoa kun kaikki tulosjoukon alkiot ovat helposti käsiteltävänä. Kiitos Parse JSON -toiminnon.
Käydään jokainen tunnistettu kohde (predictions) läpi. Mikäli tunnistetun kohteen täginä on DIHoodie, kirjataan hupparin löytyneen. Mikäli tunnistettu kohde on todennäköisemmin (propability) DI huppari kuin aiemmin tunnistettu kohde, kirjataan talteen uusi korkeampi todennäköisyys.
Lopuksi kaikki kuvan kohteet on käyty läpi ja palautetaan PowerAppsille (korkein) todennäköisyys, jolla kuvassa esiintyy DI huppari. Mikäli kuvassa ei esiinny DI hupparia, palautetaan arvo 0,01.
Flown kutsuminen PowerAppsista
Miten Flow käynnistetään PowerAppsista käsin? Valitaan ensin painike, joka käynnistää Flow:n. Ylävalikon Action -kohdan alta löytyy Flows, jota painamalla tulee esiin tarjolla olevat työnkulut. Sieltä löytyy myös äsken luomamme työnkulku.
Flow:ta klikkaamalla päästään syöttämään kyseisen työnkulun tarvitsemia parametreja. Tekemämme Flow on kiinnostunut ainoastaan kuvasta joten annamme sille parametriksi img -muuttujan nykyisen arvon.
Mutta miten PowerAppsille palautetaan Flow:sta paluuarvo?
Asettamalla Flow:n käynnistyskutsu muuttujan arvoksi. Käytetään tällä kertaa muuttujaa DataFromFlow.
Tuloksen esittäminen käyttäjälle
Käyttäjälle pitää tietenkin kertoa, oliko kuvassa DI huppari vai ei. Tehdään teksti-kontrolli (label), jossa kerrotaan ettei kuvasta löytynyt DI hupparia.
Kontrollin näkyvyyden (visiblity) avulla määrittelemme sen näkyvän ainoastaan kun kuvapalvelumme antaa DI hupparin todennäköisyydeksi arvon väliltä 0 – 0,5.
Vastaavalla tavalla tehdään teksti-kontrolli, joka kertoo kuvasta löytyneen DI hupparin.
Valmis!
Siistin vielä lopuksi hieman sovelluksen ulkoasua jonka jälkeen se näyttää tältä.
Sovelluksen käynnistyessä isoon kuvaan ilmestyy kännykän kameranäkymä. Sitä painamalla otetaan kuva, joka taas näytetään pienenä kuvana kameranäkymän alapuolella. Tarkista -painike käynnistää työnkulun, jonka suoritus kestää 5-10 sekuntia. Tämän jälkeen näytön alareunaan ilmestyy tulos.
Yhteenveto
Tähän käyttötapaukseen aiemmin esittelemäni chatbot -ratkaisu on toimivampi. Itse Flown käyttö PowerAppsista on varsin nopeaa (Flow käynnistyy käytännössä heti). Flowssa tehtävän http-kutsun tekeminen Custom Vision serviceen kuitenkin kestää.
Pikselintarkan käyttöliittymän teko on PowerAppsilla vaikeaa mikäli käyttää kameraa. Eri laitteiden kameroiden kuvasuhteet vaihtelevat, jolloin suunnitteluvaiheessa ei voi tarkalleen tietää minkä kuvasuhteinen kuva näytölle tulee. Tämän esimerkin sovellus näyttää varsin erilaiselta PowerApps -kehitystyökalussa kuin puhelimessani.
Timo Pertilä 