material-components_material-components-ios/components/Snackbar

Snackbar

Snackbars provide brief feedback about an operation through a message at the bottom of the screen. Snackbars contain up to two lines of text directly related to the operation performed. They may contain a text action, but no icons.

Design & API documentation

• Material Design guidelines: Snack Bar
• Class: MDCSnackbarManager
• Class: MDCSnackbarMessage
• Class: MDCSnackbarMessageAction
• Class: MDCSnackbarMessageView
• Protocol: MDCSnackbarSuspensionToken
• Protocol: MDCSnackbarManagerDelegate
• Enumeration: MDCSnackbarAlignment

Related components

• OverlayWindow

Table of contents

• Overview
  • Snackbar Manager and Message
  • Suspending and Resuming Display of Messages
• Installation
  • Installation with CocoaPods
  • Importing
• Usage
  • Typical use: display a message
  • Typical use: display a message with an action
• Extensions
  • Color Theming

---

Overview

Snackbar Manager and Message

Snackbar is comprised of two classes: MDCSnackbarManager and MDCSnackbarMessage. Snackbar messages contain text to be displayed to a user. Messages are passed to the manager. The manager decides when it is appropriate to show a message to the user.

Suspending and Resuming Display of Messages

Snackbar manager can be instructed to suspend and resume displaying messages as needed. When messages are suspended the manager provides a suspension token that the client must keep as long as messages are suspended. When the client releases the suspension token or calls the manager's resume method with the suspension token, then messages will resume being displayed.

Installation

Installation with CocoaPods

Add the following to your Podfile:

pod 'MaterialComponents/Snackbar'

Then, run the following command:

pod install

Importing

To import the component:

Swift

import MaterialComponents.MaterialSnackbar

Objective-C

#import "MaterialSnackbar.h"

Usage

Displaying a snackbar requires using two classes: MDCSnackbarManager and MDCSnackbarMessage. First, create an instance of MDCSnackbarMessage and provide a string to display to the user. Next, pass the MDCSnackbarMessage to the MDCSnackbarManager.defaultManager with the static showMessage method. This will automatically construct an MDCSnackbarMessageView and appropriate overlay views so the snackbar is visible to the user.

Typical use: display a message

Swift

let message = MDCSnackbarMessage()
message.text = "The groundhog (Marmota monax) is also known as a woodchuck or whistlepig."
MDCSnackbarManager.show(message)

Objective-C

MDCSnackbarMessage *message = [[MDCSnackbarMessage alloc] init];
message.text = @"How much wood would a woodchuck chuck if a woodchuck could chuck wood?";
[MDCSnackbarManager.defaultManager showMessage:message];

Typical use: display a message with an action

Swift

let action = MDCSnackbarMessageAction()
let actionHandler = {() in
  let answerMessage = MDCSnackbarMessage()
  answerMessage.text = "Fascinating"
  MDCSnackbarManager.show(answerMessage)
}
action.handler = actionHandler
action.title = "OK"
message.action = action

Objective-C

MDCSnackbarMessageAction *action = [[MDCSnackbarMessageAction alloc] init];
void (^actionHandler)() = ^() {
  MDCSnackbarMessage *answerMessage = [[MDCSnackbarMessage alloc] init];
  answerMessage.text = @"A lot";
  [MDCSnackbarManager.defaultManager showMessage:answerMessage];
};
action.handler = actionHandler;
action.title = @"Answer";
message.action = action;

Extensions

Color Theming

There is currently no theing extension for MDCSnackbar.