Learn with

Controls and Properties

Controls:-

In a canvas app, controls represent elements or widgets that display and interact with data. They enable the creation of user interfaces and customization of app functionality. Canvas apps are often developed using platforms like Microsoft Power Apps, which offer a visual design interface, reducing the need for extensive coding. Below are examples of common controls that can be utilized in a canvas app.:

  1. Label Control: A label control is used to display text or static information. Can be used to provide descriptions, headers, or other textual information.
  2. Text Input Control: Text input controls allow users to enter text or data. They can be used for forms, search boxes, or any scenario where user input is required.
  3. Button Control: Buttons serve as triggers for actions or navigation within the app. Their click behavior can be defined to perform various actions, including screen navigation, form submission, or the execution of specific functions.
  4. Gallery Control: The gallery control is employed to present a list of items, and its presentation can be customized to display data in various ways. It is commonly used to create data-driven views.
  5. Data Table Control: Similar to a gallery, a data table control is used to display data in a tabular format, making it suitable for displaying data from a data source.
  6. Image Control: The image control is utilized for displaying images or icons, allowing you to showcase pictures, logos, or icons within the app.
  7. Media Controls: The controls like Audio and Video provide the capability to seamlessly incorporate multimedia elements into Canvas application.
  8. Forms: Forms are used for data input and editing. They contain various input controls and are commonly used for data entry and updating records.
  9. Chart Controls: Chart controls let you visualize data through various chart types, including bar charts, pie charts, line charts, etc.
  10. Dropdowns and Combo Boxes: Dropdown and combo box controls allow users to select options from a list, which is especially useful for data selection or filtering.
  11. Toggle Controls: Toggles are used for binary choices or on/off settings.
  12. Slider Controls: Sliders let users select a value within a predefined range, making them suitable for tasks like setting a numeric value.
  13. Timer Control: The timer control can trigger actions at specific intervals or time intervals.
  14. Maps Control: Maps controls can display interactive maps and integrate with location-based services.
  15. Barcode Scanner Control: For an app that requires scanning barcodes or QR codes, the barcode and QR code scanning control can be valuable.
  16. PDF Viewer Control: To display PDF documents within your app, this control is handy.
  17. Rating Control: Rating controls allow users to rate items on a scale, typically used for product or service reviews.

Properties:-

In a canvas app, properties represent attributes or settings that can be applied to controls, objects, and elements within the app. These attributes determine the appearance, behavior, and functionality of the components in the app. The available properties may vary based on the platform used for building the canvas app, like Microsoft Power Apps. Here are some common properties found in a canvas app:

  1. Visible: This property controls the visibility of a control, allowing dynamic showing or hiding based on conditions. It can be set to a formula or a Boolean value.
  2. Color: The color property is used to define the color of elements such as text, backgrounds, or borders. It can be set to a specific color code or a formula for dynamic color changes.
  3. Text: The text property determines the text content for controls like labels, buttons, and text input boxes.
  4. Font Size and Style: Font size, style (bold, italic), and family (font type) can be adjusted to control text appearance.
  5. Border Style: For controls with borders, properties like border color, thickness, and style can be configured.
  6. Fill: This property specifies the background or fill color for controls or shapes.
  7. Height and Width: These properties define the size of controls on the screen.
  8. Position (X and Y): The horizontal (X) and vertical (Y) positions of controls on the screen are determined by these properties.
  9. Padding and Margin: Padding sets the space between the content and the control's border, while margin defines the space between a control and other nearby controls.
  10. OnSelect: Typically used with buttons, this property specifies the action when the button is clicked, allowing for dynamic actions using formulas and functions.
  11. Default Value: For input controls like text input boxes, this property sets the initial value when the control is loaded.
  12. Items: Used in controls like galleries or data tables, the Items property defines the data source displayed by the control.
  13. Selection: This property, often used with galleries or data tables, allows the definition of how items are selected or highlighted.
  14. Formula Bar: The formula bar provides a platform for creating formulas or expressions to customize control behavior. It's where dynamic behaviors for the app are created.
  15. BorderColor: Controls with borders have a property to specify the border color.
  16. TextAlign: For controls with text, this property sets the text alignment (left, center, right).
  17. Validation Rules: Input controls often have properties for defining validation rules to ensure the input meets specific criteria.
  18. Options and Choices: Dropdowns, combo boxes, and other selection controls have properties for defining available options or choices for the user.
  19. Disabled: The disabled property can be set to make a control read-only, preventing interaction.
  20. Hover Effects: Some controls support hover effects that define user experiences when the mouse hovers over the control.