文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

Material Design — App bars: bottomApp bars: bottom

Bottom app bars 包括最左侧的 navigation menu control 和floating action button（当存在时）。...当 bar 脱离FAB时，会恢复到默认的形状。 在返回到屏幕并重新附着 FAB 后，bar 重新获得了缺口形状。 ? ---- 海拔 Bottom app bar 的海拔高度为8dp。...底部的导航抽屉从底部的应用栏打开。 抽屉在底部应用程序栏前打开，并显示顶部应用程序栏以在达到完整高度时关闭抽屉。...Drawer 在 bottom app bar 前面打开，并显示 top app bar 以在达到完整高度时关闭抽屉。...不要将导航操作置于bottom app bar中，因为它们可以被临时表面覆盖 与 top app bar 同时使用 当与 bottom app bar 一起使用时，top app bars 可以提供向上导航和其他操作

3.3K80

flutter上拉抽屉效果 flutter拖动抽屉效果

重要消息 网易云【玩转大前端】配套课程 EDU配套 教程 Flutter开发的点滴积累系列文章 *** 示例一 [在这里插入图片描述] 示例二 [在这里插入图片描述] 1、 抽屉关闭状态时点击标签抽屉会向上打开...，也可配置关闭这个功能； 2、 抽屉关闭状态时，向上滑动，滑动过一定的高度时自动向上滑动打开，当没有滑动过一定的高度时，自动向下滑动，呈关闭状态； 3、 抽屉打开状态时，当滑动视图处于顶部时，向下滑动，...抽屉自动向下滑动关闭，可配置形状是否开启这个功能 4、 抽屉打开状态时，当向下滑动抽屉时，没有滑动到一定的距离时放开，抽屉会自动向上滑动回到打开状态，当滑动到一定的距离时放开，抽屉会自动向下滑动到关闭状态...； 5、 抽屉关闭状态时，向上轻扫抽屉，抽屉会向上滑动到打开状态，当抽屉打开状态时，向下轻扫，抽屉会向下滑动到关闭状态。..., child: DragContainer( ///抽屉关闭时的高度 默认0.4 initChildRate: 0.1, ///抽屉打开时的高度

4K51
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    如何在 Flutter 中设置背景图像【Flutter专题16】

    在移动设备上，当用户与文本字段交互时，通常会显示屏幕键盘。...显示键盘时，应用程序内容的屏幕区域变小。它还会影响背景图像的渲染方式，因为图像必须适合较小的空间。...正如您在下面的输出中看到的，背景图像受到影响。在这种情况下，由于fit模式为fitWidth，图像被向上推以使用较小的可用高度空间进行调整。...正如您在上面的输出中看到的那样，当显示键盘时，部分内容是不可见的。一种可能的解决方法是将 Scaffold 包裹在带有背景图像的 Container 中。...然后，您需要将内容（可以滚动）放在 Scaffold 下，必要时将其包裹在 SingleChildScrollView 中。

    15K21

    Material Design — Navigation drawerStandard drawer Modal drawer Bottom drawer

    Modal navigation drawers 使用遮罩来阻止用户与 app 内容的其余部分进行交互。 它们高于大多数 app 元素，不会影响屏幕的布局网格。 主要用于屏幕空间有限的移动设备。...点击 bottom app bar 中的 navigation menu icon 即可打开这些 drawers。 Bottom drawers 仅用于移动设备。 ?...·如果抽屉内容低于屏幕高度的50％，则 drawer 全部打开 ·如果 drawer 内容大于屏幕高度的50％，请先将其打开至50％，然后允许用户将 drawer 向上拖动至其全高或屏幕高度（以先到者为准...移动端打开（横向） 在移动端的横向方向上，较高的 bottom navigation drawers 会自动打开到全屏模式。 ? ?...滚动 Bottom navigation drawers 一旦打开至全屏高度，就可以在内部滚动。 当最初打开到屏幕高度的50％时，在显示其他项目之前，必须将 drawer 拖到屏幕高度。

    5.3K40

    师于源码 | Flutter 区域视口双向滑动

    比如 AndroidStudio 的文件树和编辑器区域，当宽度较窄时，水平方向通过拖拽底部滚动条来滚动视口。...打开文件后，可以通过 AndroidStudio 的 Structure 页签，快速掌握当前文件中的类型结构信息。...除此之外，最难的一点是计算出内容宽度的临界值，也就是说，当约束的宽度尺寸小于哪个值时，允许进行拖拽滑动。因为如果宽度够大，是没必要拖拽滑动的。...也有由于这一点，之前一直没能实现区域视口双向滑动的功能。下面是在竖直方向上 ScrollBar 构造时存在的一行代码：可以只监听竖直滚动的通知，忽略水平方滚动向通知。...如下所示，蓝色区域内有一行文字，当窗口宽度缩小到文本溢出时，底部会呈现滑动条支持水平滑动： 这里先总结一下实现区域视口的双向滚动的步骤: 需要两个可滑动的视口: SingleChildScrollView

    1.1K20

    基础篇章：关于 React Native 之 DrawerLayoutAndroid 组件的讲解

    Android 中的 DrawerLayout 就是一个抽屉导航组件，所以这个组件的功能当然也是一样的。...unlocked (默认值)，意思是此时抽屉可以响应打开和关闭的手势操作。...drawerWidth number 指定抽屉的宽度，即从窗口的边缘拉到视图中的更精确的宽度 keyboardDismissMode 枚举类型('none','on-drag') none默认值，默认不会隐藏键盘...，on-drag：是当拖拽开始的时候隐藏键盘 onDrawerClose func 每当导航视图被关闭时调用的函数 onDrawerOpen func 当导航视图被打开后调用该方法 onDrawerSlide...settling（停靠中），表示用户刚刚结束与导航条的交互，导航条正在结束打开或者关闭的动画。

    3.4K70

    Yoink for macv激活版 临时文件拖放暂存工具

    Yoink for mac是Mac os平台上的一款帮助用户更好的管理屏幕上的文件的Mac文件管理软件，Yoink for mac就是抽屉平时并不会显示出来，只有当你拖放文件，或者抽屉里已经有临时保存的文件之后...步骤1拖动您要移动或复制到Yoink的文件步骤2在您的鼠标空闲的情况下，更轻松快速地导航到文件的目标位置步骤3将文件从Yoink拖到他们应该去的地方丢掉一切。...Yoink为您想要移动或复制的文件和应用内容提供了“架子”。几乎任何你可以在Mac上拖动的东西，Yoink可以为你提供直到你需要它。...从Finder中的文件到app-content（如来自文字处理器或来自网站的图片），Yoink让你满意。什么时候需要它。当您开始拖动文件时， 它会出现在屏幕的边缘，因此您可以将文件放入其中。...将文件拖出Yoink 时，在移动或复制文件时，其行为与Finder相同。就像在Finder中一样，如果您想强制复制文件，请按住键盘上的选项键（⌥）。如果您想强制移动，请使用命令键（⌘）。

    89830

    【React Native 安卓开发】----侧边栏的实现DrawerLayoutAndroid以及第三方框架react-native-side-menu的使用【第六篇】

    有三种状态： unlocked (默认值)，意味着此时抽屉可以响应打开和关闭的手势操作。 locked-closed，意味着此时抽屉将保持关闭，不可用手势打开。...keyboardDismissMode enum(‘none’, “on-drag”) 指定在拖拽的过程中是否要隐藏软键盘。 none (默认值)，拖拽不会隐藏软键盘。...on-drag 当拖拽开始的时候隐藏软键盘。 onDrawerClose function 每当导航视图（抽屉）被关闭之后调用此回调函数。...onDrawerOpen function 每当导航视图（抽屉）被打开之后调用此回调函数。 onDrawerSlide function 每当导航视图（抽屉）产生交互的时候调用此回调函数。...dragging（拖拽中），表示用户正在与导航条进行交互。 settling（停靠中），表示用户刚刚结束与导航条的交互，导航条正在结束打开或者关闭的动画。

    8.1K40

    Material Design —Snackbars &Toasts

    它们也显示在屏幕的底部，但不能从屏幕中滑走。 用法 一次只能显示一个snackbar。 每个snackbar可能包含一个单独的操作，但不会是“关闭”或“取消”。...但高程低于提示框，底部动作条和导航抽屉。 行为 入口时，Snackbars激活时从屏幕底部向上出现。 出现时不会阻碍用户输入。...消失方式：1、向下滑动；2、一段时间后自动消失；3、用户在别处进行新交互时（例如打开了新的页面） 非常短的文本字符串 Snackbars应包含与所执行的操作直接相关的单行文本。 它们可能包含操作文本。...在Android上，当Snackbars出现时有不相关的Dialog或Popup，Snackbars超时后将在重新获得窗口焦点时重置。 这是为了确保用户能够在预期时间内阅读Snackbar。...当显示第一个Snackbar时第二个就该做准备，在第二个Snackbar开始出现前第一个Snackbar应该开始向下收缩。 （今天的好短～开心～）

    1.4K60

    使用GTD(Getting Things Done)打造整洁高效的办公环境

    （2）桌上堆得太满，没有创意思考的空间，当进行一个项目的分解，比较自然式计划法的思考时，应该留出一块较空的桌面，可以任意乱写乱画，键盘和鼠标都很碍事。 （3）USB线缆有点乱，甩得到处都是。...当iPhone放在上面充电时，我的蓝牙耳机就发挥作用了，一键接听，既减少辐射，还腾出了双手。 ?...根据平常的工作职责，把几个小格都分配互相独立的功能，最上一层是放一些空的文件夹，当某些文件需要做为项目参考资料时，就从这里拿出空文件夹，把它装进去，然后归档到下面的格子中。...看twshi的图片里电话上放个耳机，可以在打电话时腾出双手，我这个电话太普通，还没有这个功能，当想记下一些东西时，只能把电话夹在头和肩膀中间了。...（11）垃圾筒放在桌子底下，应该找个大点的，方便把一整张的A4纸直接扔进去，不用的纸直接塞到碎纸机中。 （12）桌子底下右侧的资料柜放些参考资料，这个资料柜有三个抽屉。

    1.8K50

    Flutter 绘制探索 5 | 深入分析重绘范围 RepaintBoundary | 七日打卡

    ---- 目前待渲染列表中，只有 _RenderSingleChildViewport 。它是由 SingleChildScrollView 间接创建的，在它的绘制中，会触发绘制孩子。 ?...这样滑动时，就不会触发 ShapePainter#paint 的重绘，这时，你的心里肯定会有一个大大的问号，Why? 下面就来一起探索吧。 ?...下面代码可以看出：当一个 RenderObject 对象执行 markNeedsPaint 时，如果自身 isRepaintBoundary 为 false，会向上寻找父级，直到有 isRepaintBoundary...这样在滑动时也不会触发画板的频繁绘制，原因就在于 SliverChildBuilderDelegate 中的 RepaintBoundary 处理。 ? ---- 6....解决方案是在绘制的组件上套一个 RepaintBoundary 。 ? ---- 2.输入框系列 在输入框收起打开时，会触发自定义画板的绘制，而且随着打开次数的增加，绘制越多，感觉像是 bug 。

    4.8K31

    提高效率 |ArcGIS Pro 中所有快捷键一网打尽

    Ctrl+L 当布局为活动视图时，锁定或解锁在内容窗格中选择的项目。 Ctrl+Shift+L 当布局为活动视图时，请在内容窗格中锁定或解锁该级别上的所有项目。...您可以放大要素，而不会在活动视图中看到当前的锚点位置。 Ctrl + 拖动 移动锚点。 移动选择锚点。 旋转 用于“旋转”工具的键盘快捷键 键盘快捷键 操作 注释 A 角度。 打开角度对话框。...您可以放大要素，而不会在活动视图中看到当前的锚点位置。 Ctrl + 拖动 移动锚点。 移动选择锚点。 S 访问辅助锚点。 打开和关闭辅助锚点。打开时，锚点将位于指针位置。...您可以放大要素，而不会在活动视图中看到当前的锚点位置。 Ctrl + 拖动 移动锚点。 移动选择锚点。 S 访问辅助锚点。 打开和关闭辅助锚点。打开时，锚点将位于指针位置。...在 3D 中，照相机会垂直抬起。 J 沿向下靠近视图的方向下移。 在 2D 中，这类似于持续放大。在 3D 中，照相机会垂直向下移动。 向上翻页键 向上移动一个屏幕大小。

    9.7K20

    Win11桌面操作快捷键

    引言每天打开电脑，面对堆满图标的桌面和层层叠叠的窗口，你是否也曾对着鼠标右键菜单反复点击，只为找到那个 “刷新” 按钮？或是在切换窗口时，像翻找抽屉里的文件一样逐个点击任务栏？...Win + Ctrl + F4：关闭当前正在使用的虚拟桌面（桌面中的窗口会移至其他桌面）。五、桌面图标选择与操作方向键（↑↓←→）：在桌面图标之间移动选中状态（选中后可配合其他键操作）。...Ctrl + 方向键：微调选中图标的位置（当关闭 “自动排列图标” 时可用，精准调整摆放）。Enter：打开选中的桌面图标（等同于双击鼠标）。...Win + Ctrl + Shift + B：重启显卡驱动（当桌面显示异常、卡顿或黑屏时，可尝试此快捷键修复）。...这些快捷键覆盖了桌面操作的更多细节，尤其是纯键盘操作场景（如无鼠标时）非常实用。熟练后可根据具体需求组合使用，进一步提升多任务处理效率。

    2.4K10

    Windows10中的键盘快捷方式

    向上键 将光标移动到上一段落的起始处 Ctrl + Alt + Tab 使用箭头键在所有打开的应用之间进行切换 Alt + Shift + 箭头键 当组或磁贴的焦点放在“开始”菜单上时，可将其朝指定方向移动...当出现 Windows 提示时，请将焦点移到提示上。 再次按下键盘快捷方式，将焦点放在屏幕上 Windows 提示所固定的元素上。...当出现 Windows 提示时，请将焦点移到提示上。 再次按下键盘快捷方式，将焦点放在屏幕上 Windows 提示所固定的元素上。...对话框键盘快捷方式 按键 操作 F4 显示活动列表中的项目 Ctrl + Tab 在选项卡中向前移动 Ctrl + Shift + Tab 在选项卡中向后移动 Ctrl + 数字（数字 1–9） 移动到第...本文删改自豆末的WINDOWS中的键盘快捷方式 相关

    7.5K20

    2023最全vim编辑器教程(详细、完整)-编辑器之神

    上图中，当输入一个g时不是正确语法在右下角可以看到输入的内容g，当输入两个g时立刻会执行命令，这里不便演示，只需按语法输入命令即可执行 语法4：G //键盘输入字母G，光标移动到文件的尾行 语法5：ctrl...：数字+键盘方向键上/下 //键盘输入数字+键盘方向键上/下，光标以光标所在行为准向上/下移动指定行(对应的数字) 语法9：数字+键盘方向键左/右 //键盘输入数字+键盘方向键左/右，光标以光标所在位置为准向左...) 2.简易计算器 当编辑文件中需要用计算器计算时，不需要退出文件，可以使用vim的简易计算器完成计算； 使用方法： 在编辑模式下键盘ctrl+r，然后键盘输入符号=，光标就会移动到末行，键盘输入计算格式后回车.../不显示行号 配置分类： 临时配置：在末行模式下输入配置，此配置是暂时的，下次打开文件时不会生效； 个人配置：个人配置文件路径是~/.vimrc，即当前用户家目录下的隐藏文件.vimrc，此配置只对当前用户永久生效...)，并且在下一次打开该异常退出的文件时会报错，将交换文件删除即可正常打开； 3.别名机制(非常有趣) 依靠一个别名映射文件(路径时~/.bashrc)来执行自己创建的指令，这就是别名机制；在映射文件中按特定格式加入自己的指令即可执行自己创建的指令

    5.4K50

    Win10 快捷键大全（史上最全）「建议收藏」

    + 向上键 将光标移动到上一个段落的起始处 Ctrl + Alt + Tab 使用箭头键在所有打开的应用之间切换 Ctrl + Alt + Shift + 箭头键 当分组或磁贴在“开始”菜单中获得焦点时...+ F 打开“反馈中心” Windows 徽标键 + G 打开游戏栏（当游戏处于打开状态时） Windows 徽标键 + H 打开“共享”超级按钮 Windows 徽标键 + I 打开“设置” Windows...Down 将光标向下移动一页 Ctrl + Home（标记模式） 将光标移动到缓冲区的起始处 Ctrl + End（标记模式） 将光标移动到缓冲区的末尾 Ctrl + 向上键 在输出历史记录中向上移动一行...在带有搜索框的任何页面上键入 搜索设置 Windows 10 应用中的键盘快捷方式 在许多应用（如照片、Groove 和地图）中，当你将鼠标指针悬停在某个按钮上时，工具提示中就会显示快捷方式。...将选择内容或活动形状向上移动一个像素 Shift + F10 显示上下文菜单 “照片”键盘快捷方式 按此键 执行此操作 空格键（在“集锦”中） 选择项目并进入选择模式 Enter（从选择模式） 在处于选择模式下时选择项目

    24.6K31

    AngularDart Material Design 应用布局 顶

    自述 应用布局 应用程序布局是一个样式，指令和组件系统，当它们一起使用时，可以提供材质外观和感知应用程序的层叠关系。 它根据材料规格提供应用栏，抽屉和导航样式。...对于抽屉外部的主要内容，将其包装在material-content元件中或具有material-content样式类的元素中。 固定性抽屉 固定性抽屉是不能关闭的抽屉。 它们完全由CSS提供。...临时抽屉具有可选的overlay属性，可用于在抽屉打开时在非抽屉内容上方显示透明覆盖。...当可堆叠抽屉打开时，任何现有的可堆叠抽屉将被展开以填充背景中的屏幕。 适用于延期内容。 Inputs: visible bool  抽屉的可见性。...isExpanded bool 当抽屉扩展到全屏时，“True”。 Outputs: visibleChange Stream  抽屉的可见性发生变化时触发事件。

    5.2K30

    Flutter开发-可滚动组件

    我们先介绍一下常用的可滚动组件（如ListView、GridView等） SingleChildScrollView SingleChildScrollView类似于Android中的ScrollView...需要注意的是，通常SingleChildScrollView只应在期望的内容不会超过屏幕太多时使用，这是因为SingleChildScrollView不支持基于Sliver的延迟实例化模型，所以如果预计视口可能包含超出屏幕尺寸太多的内容时...当ListView在一个无边界(滚动方向上)的容器中时，shrinkWrap必须为true。...中，在该列表项滑出视口时它也不会被GC（垃圾回收），它会使用KeepAliveNotification来保存其状态。...当可滚动组件滚动时，将列表项包裹在RepaintBoundary中可以避免列表项重绘，但是当列表项重绘的开销非常小（如一个颜色块，或者一个较短的文本）时，不添加RepaintBoundary反而会更高效

    6K20

    Material Design — 底部导航（Bottom Navigation）

    底部导航应该用于： 3-5个重要性相同的一级页面，且需要从app 中任何地方直接访问目的地 （超过6个：app中一直存在的持久抽屉导航persisitent navigation drawer） （不满...超过6个就不要放在底部导航里了，太挤了 底部导航和标签 当组合底部导航和tabs时要注意，因为这样的组合可能会因为用户不知道二者的优先级而在导航时引起混乱。...应按下列要求制作每一个动作（目前并不适用，因为图标无法100%传递标签的内容）： ·当页面处于焦点时，显示页面的icon和标签； ·当只有三个动作时，始终显示icon和文本标签； ·如果有四个或五个动作...每个icon必须指向目的地，并且不能打开菜单或对话框。...滚动 底部导航栏滚动时可以动态地出现和消失： ·向下滚动隐藏底部导航栏 ·向上滚动显示 手势 在内容区域上使用左右滑动手势不会在一级页面之间切换。

    5.4K91
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券