基本上 每个网页的开头 都有个App Bar 用来登入登出 提示 搜索等等
以IT帮而言 虽然没有置於最顶 是在广告之後的第二列 滚动後广告消失
App Bar置顶
从
Day 6
开始 加上 App Bar
先来解析 App Bar 元件
<AppBar position="static">
<Toolbar>
<IconButton edge="start" className={classes.menuButton} color="inherit" aria-label="menu">
<MenuIcon />
</IconButton>
<Typography variant="h6" className={classes.title}>
Photos
</Typography>
{auth && (
<div>
<IconButton
aria-label="account of current user"
aria-controls="menu-appbar"
aria-haspopup="true"
onClick={handleMenu}
color="inherit"
>
<AccountCircle />
</IconButton>
<Menu
id="menu-appbar"
anchorEl={anchorEl}
anchorOrigin={{
vertical: 'top',
horizontal: 'right',
}}
keepMounted
transformOrigin={{
vertical: 'top',
horizontal: 'right',
}}
open={open}
onClose={handleClose}
>
<MenuItem onClick={handleClose}>Profile</MenuItem>
<MenuItem onClick={handleClose}>My account</MenuItem>
</Menu>
</div>
)}
</Toolbar>
</AppBar>
主要 position 这个属性 来定义bar的位置
其他都是一些附属元件
可参照想要使用的元件塞入
这样简易的 APP Bar就做完了
Day 7
>>: IOS、Python自学心得30天 Day-18 影像训练大小
虚设常式(Stub)简介 今天的文章进入了新的系列,那因为接下来的概念是非常抽象的,所以会介绍数个核...
我们的丰收款主题完结了吗? 今天即使达成铁人赛的2/3赛程,在先前的篇幅已完整将每一个功能都实作出来...
前言 前面学习了 Structure, 今天就来介绍 Class, Structure 与 Clas...
昨天我们利用 shadow-dom 将元件内外的样式区隔开来 不过 , 目前的 neuomorphi...
前言 我们昨天聊到要透过解析 threadPool 档案中的 FinishContinuations...