Menu Close

Tag: #365blogpostsin365days

How to create canvas app sidebar from maker portal

uk365guy

Hello Everyone,

Today i am going to show how to create sidebar for canvas app quickly from Maker Portal.

Part 9 Series

Lets gets started.

Login into www.make.powerapps.com

Click on the start with a page design refer to above screen shot.

Then click on the Sidebar screen as show on the above screenshot.

We just add content and automatically screen will adjust.

This page has
1. A fixed-width sidebar on the left.
2. A fixed-height header section
3. A main section that fills the rest of the screen width.

Select this option if we want to create a lightweight responsive app.

Uses data from once created, connect your app to Dataverse, SharePoint, Excel, SQL and more.

Once clicked on the sidebar, it will open the designer mode.

So i have added data source of the accounts from dataverse and cases too added image to header too.

You can added more functionality when clicked on the sidebar it will take you to edit screen and improve your App accordingly.

Thats it for today.

I hope this helps.

Malla Reddy(@UK365GUY)
#365BlogPostsin365Days

Share this:

How to build Split Screen responsive canvas apps

uk365guy

Hello Everyone,

Today i am going to share how we can create Split Screen responsive canvas app what are the configurations we need to do.

Part 8 Series.

Lets gets started.

Login into www.make.powerapps.com

Click on Start with a page design.

Then on the next screen select the Split-Screen option.

Just add content! This page adapts to different screen sizes. It has two sections, each taking up 50% of the screen width.

Select this option if:

1. You want a lightweight, responsive app.

Uses data from Once created, connect your app to Dataverse, SharePoint, Excel, SQL and more.

Split-Screen:

The Split-Screen has two sections in the layout on the screen, each occupying 50% width of the screen on desktops. On mobile devices, the sections are placed one below other, each occupying up the entire screen width.

New screen will be displayed with dual screen see below screenshot.

As you can see the screen split into two left side container1 and rightsidecontainer1.

Treeview section Screen1 ScreenContainer1 with LeftSideContainer1 and RightSideContainer1.

You can start designing your canvas app by selecting an Item from the Insert Pane according to your App requirements

For more information about designing the app with responsiveness principles here

I hope this helps.

Malla Reddy(@UK365GUY)
#365BlogPostsin365Days

Share this:

How to create Power Apps using an image or Figma file

uk365guy

Hello Everyone,

Today i am going to show how to create Power Apps using an Image or Figma file.

Part 7 Series

Lets gets started.

Login into www.make.powerapps.com

Click on start with page design.

Click on An Image or Figma file.

On the next screen choose a content type to start:

1. Start from an image: You can draw an sketch and import as an image.

for example: Registration Form or Survey form etc..

2. Start from Figma: You can start from the Figma UI Kit, its a tool to design your own image.

First we will see how to create an Power App using an image.

Click on the “Start from an image” as show on the above screen shot and click next.

In this example i am using sample image to create an Power App, refer to above screenshot and choose the format either tablet or phone and click NEXT.

Next screen it will show the components on the image form, it automatically recognize the text and diagrams and picks the appropriate data types check above screenshot.

Connect to a Dataverse table to connect or create a table on Dataverse.(refer to above screenshot)

Or you can skip for now if you are not sure of any data that you need and you want to do this later then you can choose this option.

In this example i am connecting new table so choose first option and click next.

Select a table to store data or choose an existing dataverse table or make a new one(refer to above screenshot).

So i have chosen new table and click next.

Next screen will create the table properties like the display name and data type of the image we have uploaded. If you are happy with the columns applied and display name and data type you can click next.

Review screen will be displayed with the display name, name, data type. If you need to change anything you can go back and adjust it.

Otherwise click on the “Create app”

New app will be created and its in design mode, if you are happy with the design then save and play and then publish your app.

If you want to create Figma file in action follow this link to create figma file here

Thats it for today.

I hope this helps.

Malla Reddy(@UK365GUY)
#365BlogPostsin365Days

Share this:

How to create Model Driven App usable in offline and handle enterprise scale data

uk365guy

Hello Everyone,

Today I am going to show how to create a Model Driven App that need to be accessible offline and handle enterprise scale data.

You can build an app on top of data that’s already stored in Dataverse – the smart, secure, and scalable low code data platform.

Part 6 series

Lets gets started.

Login into www.make.powerapps.com

Click on the “Start with a page design” and new screen will be displayed.

Click on the Blank page with Navigation:

Select this option if:

1. Your app needs to be usable offline.
2. Your app needs to handle entreprise scale data.

Uses data from Dataverse tables.

New screen will be displayed see below screenshot.

Give your app a name ” OFFLINE ACCESS APP” and you can use CUSTOM SOLUTION as your APP datasource if you want you can check the box as shown on the above screenshot and finally click on CREATE button.

Select the existing table as i am showing case table, if you want you create a new custom table too.

Select the case table and add to the navigation pane check box.

Finally click on ADD.

Case added to the navigation pane on the left hand side of the above screenshot and view of the cases in middle screen and case display setting on the right hand side.

Save, publish and play

Then new screen will displayed when App is played.

That’s it for today.

I hope this helps.

Malla Reddy(@UK365GUY)
#365BlogPostsin365Days

Share this:

{How to create } views and forms directly from maker portal

uk365guy

Hello Everyone,

Today i am going to show how to create the views and forms directly from the maker portal.

This is Part 5 Series

Lets gets started.

Use Case:

Customers building apps for Dynamics 365 frequently use this template, use data from Dataverse tables.

Login into www.maker.powerapps.com

Select the “Start with a page design”.

Then select the View and form:

Create a collection of pages that you’ll connect to data.

For each data table you connect, you’ll get
1.One page with up to eight different data views of a table.
2.One page with a main form for adding and updating table rows.
3.Additional forms that make working with data easier: quick view, create and card forms.

For more information about building your first model driven app here

When you select the View and form then it will prompt to give it a name for your MODEL DRIVEN APP.

You can select the custom solution as well to use components on View and form, refer to the above screen shot.

Click CREATE.

New screen will be displayed which will give two pages for each table.

1. You get a view, which displays the rows and columns of the table.

2. You also get a form, which lets people interact with the table by editing existing rows, or by creating new ones.

Select the “Account” from the screen and click “ADD”. (Refer to the above screenshot).

Then new model driven app will be created in design mode:

Now you can see the two pages on the left hand side of the model driven app.

1. Account forms

2. Account views

You can change the view from the ” My Active Accounts” DROPDOWN.

Click on Save, and the Publish and then PLAY.

Then MODEL DRIVEN APP will be in play mode.

You can create a new account by clicking on the +NEW button on the site map.

Thats it for today.

I hope this helps.

MallaReddy(@UK365GUY)
#365BlogPostsin365Days

Share this: