Introduction
Hello everyone, Today I will talk about Power Apps, There is a powerful control that is not very well known, “Container“
Well, Some experienced Power Apps develop will know that container is a control that will be used when the app is need to be responsive, That’s right!
BUT I will explain why everyone who develop Canvas App should use container in all of their app, even it’s not responsive.
I will not go in detail, Just explain why container is super powerful control
What is Container
Container is Canvas App control that use to arrange another control. It will mange these property of control inside the container
- Width / Height
- Position / Placing Order
- Gap between each control
There are 3 types of container
- Container (I will called this normal container)
- This is like… a box, You can just place other control in container. You can still freely arrange control inside.
- Vertical Container
- Same as normal container but it will not allow overlapping of control inside it. Each control will arrange in vertical style
- Horizon Container
- Same as Vertical Container but in horizontal style
All of these function allow you to easily manage & arrange your app. Especially when you need to re-arrange the design Let’s see how!
Demonstration
Here are sample of basic Canvas App screen, This screen is just a screen to display list of data using gallery with some button and filter
Bring “New Button” to the first and shift TextInput, DatePicker to the left
Without container
You will need to drag button to the left and then drag other control to the left, ONE-BY-ONE this will be a hard work if you have many control.
With container
Just 3 click, Regardless of how many control in same row!!
Resize column width in Gallery
Without container
You will need to resize or move other text label for other column to fill the existing space. Imagine if your gallery have 10 column, This is crazy
With container
Each control are automatically resize themselves to fill existing space, Amazing!!
My boss want to push navigation bar to the bottom.
Without container
This is CRAZY, Imagine to do this on screen that contains 30+ controls. You can wasting an hour doing this.
With container
They shift up automatically. It’s a magic XD
Human isn’t perfect, Everyone can make mistake.
This is common problem for Canvas App designer. Some time it very hard to arrange to screen to a pixel-perfect position.
Without container
With container
Since size & margin / padding is controlled by container, This mean your app will be always pixel-perfect!
Conclusion
Using container will make your Canvas App look professional and also easy to arrange and less effort to maintain.
Download
I know that understanding container isn’t easy and I not cover the detailed tutorial about how to use container here.
However, You can download the simple app I use to demonstrate above to play learning & play with container!
