Power Apps Canvas Apps from Scratch May 2019

Power. Apps Canvas Apps from Scratch May 2019

Why from scratch? Primary design patterns Working with common field types Fun with Patching (how save data) Tips, tricks and gotchas Q&A and Resources

From scratch? What does that mean?

Customize Form • Quickly customize experience for a single list • Attached to a list / editable only from list • App permissions controlled via associated list • Edit permission = edit app • Contribute permission = use app • App won’t be shown in either the web. powerapps. com or mobile lists • No export available

Create an App / Start from Data Create from Data • Fast way to make a stand alone app • Three screens default, form driven • Browse. Screen 1 – browse, search for and select records • Detail. Screen 1 – show details (fields) of selected record in view mode • Edit. Screen 1 – create new or edit selected records • Mobile, mobile or mobile format • Can mimic by creating from Blank and using Form controls • Copy/paste to “convert” and app between formats • http: //toddbaginski. com/blog/how-to-convert-a-powerappfrom-one-layout-to-another/ • Stand alone app • Available to edit in https: //web. powerapps. com • Exportable • Can set up people with either User or Co-Owner permission • Considerations for multi-editor situations (only one editor at a time, coowner can’t export) • Many more options for people to get to your app

Canvas app from blank Same advantages as Start from Data, except for: • No/significantly less use of Forms controls • Increased flexibility in layout options

Primary Design Patterns

Naming Conventions Controls • Reflect the purpose of the control Control name button camera control canvas card collection combo box dates drop down form gallery group html text icon image label shapes table data text input timer Abbreviation btn cam can crd col cmb dte drp frm gal grp htm ico img lbl shp tbl txt tim Screens • Reflect the purpose of the screen • Screen names are read aloud by screen readers • Examples • “Home Screen” rather than “Home” • “Record Details Screen” rather than “Rec. Dets” Variables • Be descriptive of the variable’s function • Prefix your global and context variables differently • Global – gbl • Context – loc • Examples • gbl. Record. State rather than “Rec. State” • loc. User. Dialog. State rather than User. Popup

Multiple vs. Dual Screen Pattern Multiple Screens • Pro - Less logic to create as screens are differentiated • Con - More controls to keep up to date (controls are duplicated) Dual Screens • Pro - Single instance of all controls • Con - Logic more complex on individual controls to handle property manipulation for things like Display. Mode, Default, Items, etc.

Two (Three) Screen App Structure Dashboard Record Details Config

Centralized Control Styling/Configuration • Add a screen to house all base control types • Only make available to admins/owners of the apps • Experimental Feature: Components • Value of good design / UX (get screen shots from Bill)

Centralized Control Styling/Configuration • Add a screen to house all base control types • Only make available to admins/owners of the apps • Experimental Feature: Components • Value of good design / UX (get screen shots from Bill)

Working with common field types

Scratch. App Demo Data Sources Share. Point (Scratch. Fun) Field Name Type Title Single line of text Item Description Multiple lines of text (plain text) Item Commentary Multiple lines of text (rich text) Item Status Choice (single select) Categories Choice (multi select) Priority Number Special Delivery Yes/No Primary Owner Person (single select) Secondary Owners Person (multi select) Department Managed Metadata Office 365 Users • Simple (Single line of text) vs. real field types (Choice, Person, etc. )

Demo Setting up the basic structure

Adding Field Intelligence - gbl. Record. State • Set a variable to the desired record state (New, View, Edit) • Set(gbl. Record. State, ”View”) • Set the data to show • Properties: Default, Default. Selected. Items • Evaluate gbl. Record. State and set the data (or absence thereof) • If Statement format: If(logical_test, true_value, false_value) • If(gbl. Record. State=“New”, Blank(), gal. Scratch. Items. Selected. Fieldname) • Set the Display. Mode for the field • Evaluate gbl. Record. State and set the Display. Mode • If(gbl. Record. State=“View”, Display. Mode. View, Display. Mode. Edit)

Ensuring a Clean Slate • Reset fields for New records • Record Detail Screen | On. Visible • If(gbl. Record. State="New", Update. Context({loc. Reset: !loc. Reset}); Update. Context({loc. Reset: !loc. Reset})) • Clear variables (and collections if needed) • + New • > Item select

Properties Set on All Fields • Default / Default. Selected. Items • If(gbl. Record. State="New", Blank(), gal. Scratch. Items. Selected. Title) • Display. Mode • fmt. Display. Mode • If(gbl. Record. State="View", Display. Mode. View, Display. Mode. Edit) • Reset • loc. Reset • Record Detail Screen | On. Visible | If(gbl. Record. State="New", Update. Context({loc. Reset: !loc. Reset}); Update. Context({loc. Reset: !loc. Reset})) • Align, Fontweight, Height, Width, etc.

Demo A tour of the common fields

Simple Field/Control Types • Text Input – Single Line / Rich Text Editor • No additional property settings • Text Input – Number • Format | Text. Format. Number • Text Input – Multiline • Mode | Text. Mode. Multi. Line • Drop Down • Default | If(gbl. Record. State="New", "Draft", gal. Scratch. Items. Selected. 'Item Status'. Value) • Items | Choices(Scratch. Fun. 'Item Status’) • Toggle • Default | If(gbl. Record. State="New", false, gal. Scratch. Items. Selected. 'Special Delivery')

Complex Field/Control Types • Combo Box – Choice field, multi select • Default. Selected. Items | If(gbl. Record. State="New", Blank(), gal. Scratch. Items. Selected. Categories. Value) • Items | Choices(Scratch. Fun. Categories) • On. Change – Gather all selected items in to a collection for patching • Select. Multiple | true • Combo box – Person field, single select • Default. Selected. Items | If(gbl. Record. State="New", Blank(), gal. Scratch. Items. Selected. 'Primary Owner’) • Items | Office 365 Users. Search. User({search. Term: cmb. Primary. Owner. Search. Text}) • On. Change - Set variables to evaluate if a change has occurred and to enable patching a person field (Display. Name, Claims, Email) • Combo box – Person field, multi select • Ick (use dialog method instead)

Fun with Patching (saving data)

Patch Statement Format • Creating a new record Patch( Datasource, Defaults(Datasource), { Fieldname: control reference, ) } • Updating an existing record Patch( Datasource, galleryname. Selected, { Fieldname: control reference, ) } • Don’t forget to refresh your data source(s) and collections after patching

Tips, tricks and gotchas

Random Tips and Gotchas • Don’t forget to save, publish and export when you get to a known good state • Cut and paste is awesome, until it’s not • Make sure your variable and collection names are a nice shade of turquoise instead of black • Don’t forget about Flow!

Resources

Resources • Power. Apps and Flow User Group • Sign Up - https: //www. powerappsug. com/home? CLK=48 cf 87 c 0 -10 df-4 aa 4 -ad 15 -fc 66 b 02 e 6 a 62 • Minneapolis Power. Apps and Flow User Group https: //www. powerplatformug. com/communities/community-home? Community. Key=19 c 2 ac 73 -92 c 9 -48 bba 26 a-0 eb 83 c 7 f 7714 • Power. Apps Blog • https: //powerapps. microsoft. com/en-us/blog/ • Power. Apps Canvas App Coding Standards and Guidelines • https: //powerapps. microsoft. com/en-us/blog/powerapps-canvas-app-coding-standards-and-guidelines/ • Tips for making your apps more maintainable • https: //powerapps. microsoft. com/en-us/blog/tips-for-a-maintainable-extensible-app/ • Power. Apps Community • Blog - https: //powerusers. microsoft. com/t 5/Community-Blog/ct-p/PA_Community. Blog • Gallery - https: //powerusers. microsoft. com/t 5/Galleries/ct-p/PA_Comm_Galleries • Forums - https: //powerusers. microsoft. com/t 5/Forums/ct-p/PA_Comm_Forums

Q&A

THANK YOU FOR ATTENDING!