There's more...

Instead of fading the AppBar component in and out when the user scrolls, you can use a different effect. For example, the following code block demonstrates what it would look like if you wanted to use the Grow effect:

<Grow in={!this.state.scrolling}>
  <AppBar>
    <Toolbar>
      <IconButton
        className={classes.menuButton}
        color="inherit"
        aria-label="Menu"
      >
        <MenuIcon />
      </IconButton>
      <Typography
        variant="title"
        color="inherit"
        className={classes.flex}
      >
        My Title
      </Typography>
      <Button color="inherit">Login</Button>
    </Toolbar>
  </AppBar>
</Grow>