AppBar integration

AppBar components can be used with the Tabs component. You can do this so that the tab buttons are rendered within an App Bar. This provides a container for your tab buttons—by default, there is nothing surrounding them.

How to do it...

Let's say that you have a Tabs component with three Tab buttons. Instead of rendering the tabs so that they look as though they're floating on the screen, you can wrap them in an AppBar component to give them a contained look and feel. Here's the code:

import React, { useState } from 'react';

import { withStyles } from '@material-ui/core/styles';
import AppBar from '@material-ui/core/AppBar';
import Tabs from '@material...