Tag Archives: #Canvas
How to extract information from XML/HTML/FSON and convert it into PlainText in Canvas PowerApps without Flow
If you are curious about the data in XML/HTML/JSON and want to fetch data from it without flow. Here’s something what you can do There’s an inbuilt function in PowerApps that converts HTML/XML to string text. Function Name is ‘PlainText‘. But all tags are neglected and extracting certain data is difficult. Consider you want to extract a small size information which is in XML/HTML/JSON and don’t have time to write a flow. Here’s what you can do I have a XML data.Tip: When converting your XML/HTML to PlainText. It’ll show space and next line if you place tags correctly. Keeping in 1 line or no spaces will reflect in result which will look bad. I have created 2 buttons and 2 input text boxes. 1st button will set XML/HTML/JSON in a variable or collection 2nd button will check for next values if tag found. 1st and 2nd input Text Boxes represent start and end tags There are 3 main variables that we’ll use to iterate the values. Here TagFind, TagFind_End are 2 input text boxes and var1 is variable holding XML data. Find function finds data which is encountered once. Since it has starting point we define it to iterate to next search. Current and CurrentEnd will represent start and end point of tag.Next will determine next index to start searching from We will have 1 label to show our answer Here the text property has the formula that retrieves data within the start and end point of the tag. Finally you will achieve something like this, You can use this fetched data somewhere in your PowerApp. You can also use something similar to extract values in branched data form. In a certain range of data.For example; In above XML, i have ’employees’ as 1 tag determining contents in it.If i had Name tag in employees and Name tag in ‘Department’ then by range of ‘Employees’ or ‘Department’ i can fetch Name of that block only. Hope this idea helped.
Control elements in PowerApps with different font-size
Its good to have a user’s choice based font-size but without controlling how it displays on screen may not look good. I have created a simple design that consists of a header, gallery and font-size slider to show how elements react on certain font size. Here’s how it looks. How to make this, Set your font-size range into slider or any other control element like dropdown.Set Title or any text as value of slider or dropdown and use increment or decrement as per requirement.For example: Header title is X then sub-header will be X-2 font-size. To make gallery change its style as per font-sizeSelect ‘Wrap-count’ property of gallery and insert formulaIf(Slider.Value > 25, 1, 2);This will make 1 column is font size is more than 25 else 2. You can create this on every control/elements that requires such change. Hope this helped.
Create a Custom Real-time Loader Control in Canvas PowerApps
In Canvas PowerApps, we usually show an image that lies over the screen until an execution is completed. But tracking real-time update might be confusing. I’ll show you a simple custom loading control that not only show execution status but also look good and is highly customizable. Here’s a preview how it will look (Note: Determine your layout before hand like X,Y, Height and Width)(Customize your look, I’ve added dots above just for demonstration purpose.)How to make this, Elements used visually are, Create a Rectangle as main background and set Height, Width, X and Y. (I’ve used light grey color) Insert another Rectangle to show loading animation which will fit inside main Rectangle.Determine its Height, Width, X and Y. Label control to show current status or add a simple static label. Gallery Control having circle in them i.e.: Dots (Optional, I used to show how i retrieve data as its similar to Navigation Screen Gallery Control used in 1 of predefined template in Canvass PowerApps) Functionality behind used are, Gallery Control under ‘Items’ I’ve added table. (Based on your content, keep total count of steps you would like to see in loading page. In my case, i have 6 steps) Label Control that shows current status based on current step. Rectangle with loading animation. (Note: Your step count and width may vary) Now you may have a button that will call list of execution that you will perform. To track every successful completion of process just add this, Later reset count and turn visibility off. (Note: This is re-usable and can be used as component.) Hope this helps.
Create a Custom Dropdown Control in Canvas PowerApps
As we know that a Standard Dropdown control do not have enough features and has limited properties to modify. Hence I have created a custom dropdown menu. Some drawbacks in Standard Dropdown,1. It shows only 1 particular attribute as value. Example: “Name”2. If multiple records of same name exist, then you cannot differentiate them. This is Custom Dropdown I have created, Steps to make the custom dropdown menu Step 1. Insert a ‘Text Input’ and ‘Horizontal Gallery’ and set height of gallery of your desired height also change Template Size according to fields added into a row. (As I have added only Name, Phone and Image) Step 2: Add an Icon ‘Down Arrow’ at the right of ‘Text Input’ and change property. onSelect = UpdateContext({showDropdown: !showDropdown}) //Condition to show/hide the CustomDropdown (Gallery). Step 3: Property to be changed.‘Text Input’ changes below, Default = textVal //It’s a Variable Fill = // Anything you feel suitable, I used “RGBA(230, 230, 230, 1)” Height and Text Size = // Anything you feel suitable. onChange = UpdateContext({showDropdown: !IsBlank(Self.Text)}) // Condition to show/hide the CustomDropdown (Gallery). ‘Gallery’ changes below, Items = Search(Accounts, TextInput.Text, “name”) // Filter Parameter by text. showScrollBar = false TemplateFill = // Anything you feel suitable, I used “RGBA(255, 255, 255, 1)” TemplatePadding = 10 TemplateSize = // As per your contents in a row Visible = showDropdown //It’s a Variable Step 4: To add functionality of basic dropdown on selection.Add a button to of size equal to template Size (i.e: cover entire record section) and change properties given below, onSelect = UpdateContext({textval: ThisItem.’Account Name’}) //Defined variable HoverFill = //Anything you feel suitable, I used “ColorFade(RGBA(240,240,240, 0.3), -10%)” Step 5: Custom Dropdown complete. You will have something like this, Note: For additional responsiveness in design, change X, Y, Height, Width. Hope this helps!