sailfish-components/NotifyBanner/docs/NotifyBanner.md

# NotifyBanner

## General

The NotifyBanner component is used to show Messages like Errors to the User. It shows a banner at the top of the screen.

## Functions and Parameters

### NotifyBanner.show(text, params);

This operation shows the banner.

#### Parameters

##### text

This parameter is required. It should receive a string with the Message to be shown.

##### params

This parameter is optional. It receives a JS-Object with parameters for colors and timeout:

    {
      // Set the color of the Text
      fgColor: "red",
      
      // Set the color of the Background
      bgcolor: "yellow",
      
      // Set the timeout in ms
      time: 4000
    }
    
You can specify any combination of the three parameters. Every parameter not specified will use these default values:

* time: 3000
* fgColor: Theme.primaryColor
* bgColor: Theme.secondaryHighlightColor


## Usage

First include the NotifyBanner.qml in your project, then import it in the main QML-File. A Directory layout may look like this:

    my-project
    |--qml
       |--componenets
       |  |-NotifyBanner.qml
       |--main.qml
       
In main.qml import the components directory and create the global notify element:

    import QtQuick 2.0
    import Sailfish.Silica 1.0
    import "pages"
    import "components"
    
    ApplicationWindow {
      id: appWin
      
      NotifyBanner { id: notify }
      
      initialPage: Component { MainPage { } }
      cover: Qt.resolvedUrl("cover/CoverPage.qml")
    }
    
Now you can use it throughout your project like this:

    // Basic usage with default values
    notify.show("An Error occured");
    
    // Advanced Options
    notify.show("Here is a message", {time: 4000, fgColor: "black", bgColor: "yellow"});