ボタン

ボタンを表示するコンポーネントです。ユーザーがボタンをタップすると、指定したアクションが実行されます。

Request Content {#button-request-parameter}

パラメータ	タイプ	説明
type	string	"button" required
action	string	ボタンをタップした時に実行されるアクション Action Object を指定します。 required
flex	number	親要素内における、このコンポーネントの幅または高さの比率詳しくは、レイアウト > コンポーネントの幅と高さを参照してください。
margin	string	親要素内での、特定のコンポーネントとその前のコンポーネントとの間に挿入される余白の最小サイズ詳しくは、レイアウト > コンポーネントの margin プロパティを参照してください。
position	string	offsetTop、offsetBottom、offsetStart、offsetEnd の基準以下のいずれかの値を指定します。 • relative : 直前のボックスを基準とします。 • absolute : 親要素の左上を基準とします。デフォルト値は relative です。詳しくは、レイアウト > オフセットを参照してください。
offsetTop	string	上側のオフセット詳しくは、レイアウト > オフセットを参照してください。
offsetBottom	string	下側のオフセット詳しくは、レイアウト > オフセットを参照してください。
offsetStart	string	左側のオフセット詳しくは、レイアウト > オフセットを参照してください。
offsetEnd	string	右側のオフセット詳しくは、レイアウト > オフセットを参照してください。
height	string	ボタンの高さ sm または md に指定できます。デフォルト値は md です。
style	string	ボタンの表示形式以下のいずれかの値を指定します。 • primary : 濃色のボタン向けのスタイル • secondary : 淡色のボタン向けのスタイル • link : HTMLリンクのスタイルデフォルト値は link です。
color	string	styleプロパティが link では文字の色、styleプロパティが primary または secondary では背景色 16 進数カラーコードで設定します。
gravity	string	垂直方向の配置方法詳しくは、レイアウト > 垂直方向の配置を参照してください。

Request Example {#button-request-example}

{  "type": "bubble",  "body": {    "type": "box",    "layout": "vertical",    "spacing": "md",    "contents": [      {        "type": "button",        "style": "primary",        "action": {          "type": "uri",          "label": "Primary style button",          "uri": "http://line-works.com"        }      },      {        "type": "button",        "style": "secondary",        "action": {          "type": "uri",          "label": "Secondary style button",          "uri": "http://line-works.com"        }      },      {        "type": "button",        "style": "link",        "action": {          "type": "uri",          "label": "Link style button",          "uri": "http://line-works.com"        }      }    ]  }}