Skip to content

@line/bot-sdkDocs


@line/bot-sdk / FlexButton

Type Alias: FlexButton

FlexButton: object & Offset

This component draws a button.

When the user taps a button, a specified action is performed.

Type declaration

action

action: Action

Action performed when this button is tapped.

Specify an action object.

adjustMode?

optional adjustMode: "shrink-to-fit"

The method by which to adjust the text font size. Specify this value:

  • shrink-to-fit: Automatically shrink the font size to fit the width of the component. This property takes a "best-effort" approach that may work differently—or not at all!—on some platforms. For more information, see Automatically shrink fonts to fit in the Messaging API documentation.
  • LINE 10.13.0 or later for iOS and Android

color?

optional color: string

Use a hexadecimal color code.

  • Character color when the style property is link.
  • Background color when the style property is primary or secondary.

flex?

optional flex: number

The ratio of the width or height of this box within the parent box.

The default value for the horizontal parent box is 1, and the default value for the vertical parent box is 0.

For more information, see Width and height of components.

gravity?

optional gravity: "top" | "bottom" | "center"

Vertical alignment style. Specify one of the following values:

  • top: Top-aligned
  • bottom: Bottom-aligned
  • center: Center-aligned

The default value is top.

If the layout property of the parent box is baseline, the gravity property will be ignored.

height?

optional height: "sm" | "md"

Height of the button. The default value is md.

margin?

optional margin: string | "none" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl"

Minimum space between this box and the previous component in the parent box.

  • none does not set a space while the other values set a space whose size increases in the order of listing.
  • The default value is the value of the spacing property of the parent box.
  • If this box is the first component in the parent box, the margin property will be ignored.

style?

optional style: "link" | "primary" | "secondary"

Style of the button. Specify one of the following values:

  • link: HTML link style
  • primary: Style for dark color buttons
  • secondary: Style for light color buttons

The default value is link.

type

type: "button"

Defined in

lib/types.ts:1319