EAN Code Scanner in 15 minuten Office 365 PowerApp

Dit artikel beschrijft hoe je een Office 365 PowerApp kunt bouwen in 15 minuten wat in staat is een EAN Barcode te scannen, de waarde van de barcode vervolgens in een textbox te plaatsen om vervolgens te kunnen zoeken op een artikel naar de goedkoopste prijs.

IMG_2195IMG_2196

1.) Start met Bouwen van de PowerApp

Ontwikkelen van de PowerApp kan direct vanuit de webbrowser. https://web.powerapps.com PowerApps_EANcode01

Navigeer naar “Apps” en klik vervolgens op “+ Een app maken”.
PowerApps_EANcode02Selecteer daar “Telefoonindeling” of “Tabletindeling”. In dit voorbeeld gaan wij uit van een “Telefoonindeling” puur omdat de functionaliteit in deze demo ook geschikt is voor een Mobiel en een tablet weergave wordt best ok weergeven. Het aantal controls is ook beperkt voor deze app.

 

 

PowerApps_EANcode03

We voegen een “Label” toe door op invoegen te klikken en vervolgens bij eigenschappen “rechts” de “Tekst” aan te passen van “Text” naar “Product vergelijker”

Voeg een extra “Label” toe met een beschrijvende tekst bijv “Scan uw EAN streepjescode”.

PowerApps_EANcode04
Wij hebben er voor gekozen om een “Exit” knop toe te voegen om de “PowerApp” eenvoudig af te sluiten. Om ervoor te zorgen dat de app ook daadwerkelijk afsluit als er op “Exit” wordt gedrukt moet er een Fx commando worden meegeven namelijk “Exit()” zoals weergegeven in de afbeelding. Bij actie en dan het “OnSelect” event.

PowerApps_EANcode05
We gaan nu het control toevoegen wat de “Camera” activeert. Selecteer streepjescode.
PowerApps_EANcode06
Selecteer “EAN” als type barcode.

Voeg een textbox toe door “invoegen” > “Tekst” > “Tekstinvoer veld” te selecteren. Voeg bij “Default waarde” “Barcode1.Text” in wat naam van het barcode control is plus de waarde “.tekst” om value direct als input te gebruiken.

 

PowerApps_EANcode07
We gaan nu een “button” controle toevoegen namelijk “Zoeken”. Zodra deze geplaatst is moet er een actie aangekoppeld worden. We gebruiken het commando “Launch(“stringwebpagina”)” om vanuit de zoek button een webpagina te starten met de juiste “Eancode” als input parameter.

 

 

 

 

 

 

 

plak deze tekst “Launch(“https://topmerkenwinkelapp.azurewebsites.net/product/getproducts?eancode=”&TextInput2.Text)” als input in “OnSelect”.

Zet als default tekst “Zoeken” en sla uw “PowerApp” op.
PowerApps_EANcode08

Zodra de “PowerApp” is opgeslagen, en publiceer vervolgs uw “PowerApp” naar Office 365. Zodra hij een gepubliceerde versie heeft zal hij verschijnen in uw PowerApp Hub. zie:

PowerApps_EANcode09

 

 

 

Advertisements

Microsoft Whiteboard Preview tour guide.

Microsoft released the preview app “Microsoft Whiteboard”. You can download it from the Microsoft Store. The minimal requirements are a Microsoft Surface Pro with Windows 10 and a Microsoft Pen.

Microsoft Whiteboard

After installed the app, can you login with your Microsoft Office365 account. When your logged in can start to draw paint to the white board. See my example

 

mswhiteboard

After painting the whiteboard sessie you can save a whiteboard as a image, you can send a link to other colleague’s or clients for sharing.

menu options

You can more then one board with the arrow on the left side. You come to this screen when you see al the boards you have created on Microsoft Whiteboard Preview

create more boards