APL Frame (APL 1.3 and Earlier)

---

(This is not the most recent version of APL. Use the Other Versions option to see the documentation for the most recent version of APL)

A Frame holds a single child and has a border and background color.

Properties

The Frame component has the following properties in addition to the base component properties. See the meaning of the columns.

Ensure that you include height and width in your Frame definition.

Property	Type	Default	Styled	Dynamic	Description
backgroundColor	Color	none	Yes	Yes	Background color.
borderBottomLeftRadius	Absolute Dimension	none	Yes	No	Radius of the bottom-left corner. Overrides borderRadius.
borderBottomRightRadius	Absolute Dimension	none	Yes	No	Radius of the bottom-right corner. Overrides borderRadius.
borderColor	Color	none	Yes	Yes	Color of the border.
borderRadius	Absolute Dimension	0	Yes	No	Corner radius for rounded-rectangle variant.
borderTopLeftRadius	Absolute Dimension	none	Yes	No	Radius of the top-left corner. Overrides borderRadius if specified.
borderTopRightRadius	Absolute Dimension	none	Yes	No	Radius of the top-right corner. Overrides borderRadius if specified.
borderWidth	Number	0	Yes	No	Width of the border.
item	Array of components and layouts	[]	No	No	Child component

When the Frame component is the target of an event, event.target reports the following values:

"event": {
  "target": {
    "disabled": Boolean, // True if the component is disabled
    "id": ID,            // ID of the component
    "uid": UID,          // Runtime-generated unique ID of the component
    "height": Number,    // Height of the component, in dp (includes the padding)
    "opacity": Number,   // Opacity of the component [0-1]
    "width": Number      // Width of the component, in dp (includes the padding)
  }
}

backgroundColor

The color of the background. The background is drawn inside of the border.

borderRadius properties

Dimensional radii to apply against the border. All radii must be specified in absolute dimensions. Relative dimensions are not supported. Setting the border radii on a Frame does not clip the children of the frame.

The borderRadius property lets you set this value for all corners one time. You can override borderRadius for each corner of theFrame separately:

• borderBottomLeftRadius
• borderBottomRightRadius
• borderTopLeftRadius
• borderTopRightRadius

borderColor

The color of the border. Because the contents of a Frame are resized when the borderWidth changes (due to a style being applied), the borderWidth is frequently kept constant and the borderColor set to transparent (or backgroundColor) if a style needs to temporarily hide the border.

borderWidth

The width of the border. Specify the border width in absolute dimensions. Relative dimensions are not supported. The border width doesn't affect the padding of the component. A drawn border is considered to be a background for the component and does not affect how the component is sized or positions its children.

item

The child component or layout. If more than one child is supplied, only the first one selected by the when property will be used.

Sample Frame

This example creates a 50 x 50 dp circle with a grey background and the text item centered in the circle.

---

---

Last updated: Nov 28, 2023