useToastKepler - Amazon Vega Docs

The useToastKepler hook provides functionality that allows you to display an on-screen notification. The hook provides the show method which takes the following parameters:

title: A string with the primary text to display.
description: A string with the secondary text to display.
duration: (optional) The duration of the toast - either ToastKeplerDuration.SHORT or ToastKeplerDuration.LONG. Default value is set to ToastKeplerDuration.SHORT.
iconUri: A URI in the format of a HTTP(S) URL or a local file URI. For local files, use the format file:///path/to/file.
iconSize (optional) A string with a size of the icon. The parameter can take small, normal or large values. Default to normal
options (optional) An object that enables to extend the Toast with launching app section
- launchUri A string with uri of the app to launch.
- launchTitle A string with the text showed next to the launch icon

Vega support

To use the hook, request the com.amazon.notification.privilege.post privilege in the app manifest.toml file.

[[needs.privilege]]
id = "com.amazon.notification.privilege.post"

Usage

The following example shows how to create and display a toast.

import React from 'react';
import {View, StyleSheet, useToastKepler, ToastKeplerDuration, Button, StatusBar} from 'react-native';

const App = () => {
  const ToastKepler = useToastKepler();
  const showToast = () => {
    ToastKepler.show({
      title: 'This is ToastKepler title!',
      description: "This is ToastKepler description!",
      iconUri: 'https://example.com',
      duration: ToastKeplerDuration.SHORT
    });
  };

  return (
    <View style={styles.container}>
      <Button title="Toggle Toast" onPress={() => showToast()} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    paddingTop: StatusBar.currentHeight,
    backgroundColor: '#888888',
    padding: 8,
  },
});

export default App;

Reference

Methods

show

Shows a notification message (toast) on the device screen

show({ title, description, iconUri, iconSize, duration, options }: {
    title: string;
    description: string;
    iconUri: string;
    iconSize?: "small" | "normal" | "large";
    duration?: number;
    options?: {
      launchUri: string;
      launchTitle: string;
    }
  });

Properties

`SHORT`

Specifies how long the toast notification appears on the screen.

static SHORT: number;

`LONG`

Specifies how long the toast notification appears on the screen.

static LONG: number;

​Vega support

​Usage

​Reference

​Methods

​show

​Properties

​SHORT

​LONG