Skip to content
The info box shows you a summary of your input data, like title and value of current and last year.
How to design it in Power Apps
Preview
What does it consist of?
Procedure
Step 1 - create HTML menu box
Add a new HTML TEXT object, call it "logged_box" with this "HTML text" property:
"<div style='margin:9px;width:"&Self.Width-15&"px;height:152px;background-color:#fff; border-radius:10px; box-shadow:3px 3px 6px 1px #ccc;'></div>"
Step 2 - create input values
Add a new Label object, call it "logged_title" with this "text" property:
"LOGGED[h]"
Add a new Label object, call it "logged_value" with this "text" property:
If(IsBlank(Sum(Filter(<TABLE>,Year = Year(Now())),<TABLE COLUMN>)),0,Sum(Filter(<TABLE>,Year = Year(Now())),<TABLE COLUMN>))
You should replace text in "<>" by your input.
Add a new Label object, call it "logged_last_year" with this "text" property:
Concatenate(Year(DateAdd(Today(),-1,TimeUnit.Years)),":")
Add a new Label object, call it "logged_last_year_value" with this "text" property:
Value(Sum(Filter(<TABLE>,Year = Year(DateAdd( Now(),-1,TimeUnit.Years))),<TABLE COLUMN>))
You should replace text in "<>" by your input.
Step 3 - group all objects
Now, we select all objects and group them via shortcut - COMMAND + G (MAC) , CONTROL + G (WIN).
This is an output:
How to design it in Figma
Preview
What does it consist of?
Procedure
Step 1 - create a vertical frame with auto layout
Add a new Frame (F command) with vertical auto layout (SHIFT + A command) object, call it "vercont_info_box" with these properties:
Step 2 - create a content for the parent frame
Add a new Text (T command) object under a "vercont_info_box" frame, call it "lbl_logged_info" with these properties:
Add a new Frame (F command) with horizontal auto layout (SHIFT + A command) object, call it "horcont_content_info" with these properties:
Add a new Text (T command) object under a "horcont_content_info" frame, call it "lbl_content_value" with these properties:
Add a new Frame (F command) with horizontal auto layout (SHIFT + A command) object, call it "horcont_Bottom_info" with these properties:
Add a new Text (T command) object under a "horcont_Bottom_info" frame, call it "lbl_year_info" with these properties:
Add a new Text (T command) object under a "horcont_Bottom_info" frame, call it "lbl_year_value_info" with these properties:
This is an output:
How to use it via DesignKit
Prerequisites
Used Prefixes
YAML Output
Used Colours
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.