Components

Alert

Alert are to display a list of options on a temporary surface

Alert is component to displays a short message or notification to the user from an existing activity.

Usage

To implement Alert, you can use this tag `LgnAlertButton` in the xml file.

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:alertType="INFO"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"

Variant

In its use, alert has following variants :

Themes
Alert Button

Themes

There are 4 themes which are available :

1. Info

The following is properties value to implement Alert info

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:alertType="INFO"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"

2. Success

The following is properties value to implement Alert Success .

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:alertType="SUCCESS"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"

3. Warning

The following is properties value to implement Alert Warning .

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:alertType="WARNING"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"

4. Error

The following is properties value to implement Alert Error.

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:alertType="ERROR"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"

Alert Button

Alert consists of 2 action buttons :

Action button app:actionText
Dismiss button app:isDismissible

The following is example usage for alert button, this code represent alert with action button and dismiss button

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:actionText="Call to action"
  app:description="Interactively monetize corporate alignment"
  app:title="Info title"
/>

The following is example usage for alert button, this code represent alert without action button and dismiss button

<com.telkom.legion.component.alert.LgnAlert
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_marginHorizontal="@dimen/dimen_16dp"
  android:layout_marginTop="@dimen/dimen_20dp"
  app:description="Interactively monetize corporate alignment"
  app:isDismissible="false"
  app:title="Info title"
/>

Attributes

Attribute Name	Xml Attrs	Related method(s)	Description
Alert Title	`app:title`	.title	Add title on alert
Alert Description	`app:description`	.description	Add description on alert
Alert Action Text	`app:actionText`	.actionText	Add action text on alert
Alert Dissmis Button	`app:isDismissible`	.isDismissible	Add dismiss button visibility on alert
Alert Type	`app:alertType`	.alertType	Configure alert type

Example

Do you have feedback?

Please let us know to make it better

Send Feedback