Material Design设计规范(三)

最新推荐文章于 2024-05-31 14:28:41 发布
最新推荐文章于 2024-05-31 14:28:41 发布
阅读量354 收藏 2
点赞数 2
分类专栏： Material Design
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43176337/article/details/101203954
版权
本文详细介绍了Material Design设计规范中的悬浮按钮(FAB)设计，包括使用原则和应用场景，并通过三个案例展示了FAB在实际设计中的应用和效果。
摘要由CSDN通过智能技术生成

Material Design设计规范(三)

悬浮按钮(FAB)设计规范及实战案例欣赏

悬浮按钮英文Floating Action Button，简称FAB,是手机移动端网页设计及APP产品设计中，最为灵动和热门辅助工具之一。

在这里插入图片描述

悬浮按钮的使用原则

A、选择适当的悬浮按钮尺寸

在这里插入图片描述

默认的尺寸一般为5656dp，迷你版的尺寸为4040dp。界面宽度低于460dp时，需要从默认尺寸（56dp）调整至迷你尺寸（40dp）。

B、悬浮按钮只承载正向操作

在这里插入图片描述
在这里插入图片描述

由于悬浮按钮通常承载的是主要的、有代表性的操作，通常它应该是个积极正向的交互，比如创建、分享、探索等。

最低0.47元/天 解锁文章
努力努力T努力
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Material Design 设计规范总结
jiahua123_dongzhou的博客
12-10 1016
一、核心思想 Material design 的核心思想是把物理世界的体验带进屏幕。去掉现实中的杂质和随机性，保留其最原始纯净的形态、空间关系、变化与过渡，配合虚拟世界的灵活特性，还原最贴近真实的体验，达到简洁与直观的效果。 二、材质与空间 1.材质 Material design中，最重要的信息载体就是魔法纸片。纸片层叠、合并、分离，拥有现实中的厚度、惯性和反馈，同时拥有液体的一些特性，能够自由伸展变形。 2.空间 Material design引入了z轴的概念，z轴垂直于屏幕，用来表现元素的层叠关系。.
【小沐学Android】Material Design设计规范之颜色篇
爱看书的小沐
06-23 2637
谷歌在2007年发布了第一个测试版本的 Android 软件开发工具包（SDK），第一个商业版本的 Android 1.0，则发布于2008年9月。2012年6月27日，在谷歌I/O大会上，谷歌宣布发布了 Android 版本4.1 Jelly Bean。Jelly Bean 是一个在功能和性能方面的渐进的更新，主要目的是改进用户界面，Android 源代码是根据自由和开放源码软件许可证。谷歌发布的大部分代码遵循 Apache 许可证2.0版，Linux 内核的变化遵循 GNU 通用公共许可证版本2。
谷歌Material Design设计标准指南
2301_79599164的博客
05-31 756
Material Design是谷歌提出的一套集视觉、交互和前端于一体的界面设计规范。其目标有两点：一是以视觉形式包含经典的设计原则，展示前沿创新和技术。二是在移动终端的基础上，统一所有尺寸和类型的设备。Material Design设计组件库。
盘点 Material Design 3 最新设计规范
移动端开发干货分享
06-13 3865
2014 年 Google 发布了 Material Design（简称MD），成为了 Google 系产品统一的 UI 设计语言。时至今日 MD 已经有了两次大升级，2018年发布的 Material Theming （Material Design2，简称 M2），以及 2021年新发布的 Material You （Material Design3，简称 M3）。本文就带大家细数一下 M3 相对于 M2 的升级和变化。M3 最大特色在于对个性化的注重，就如同 “You” 的命名一样。一个集中体现就是
Material Design设计规范(一)
weixin_43176337的博客
09-23 1008
Material Design 一、安卓是什么？ 想象一下，过年同学聚会上，大家把手机都放在饭桌前，除了各种型号的 iPhone 之外，你还能看到什么品牌的手机呢？我猜一定会有 OPPO、VIVO、魅族、小米、华为、三星对吗？也许还有一加、锤子、联想等手机品牌。这些手机全部都是使用了 Android底层构架的设备，也就是我们所说的安卓手机。。再后来，谷歌收购了安卓，有了谷歌母公司的资源，安卓的发...
Material Design设计规范(四)
weixin_43176337的博客
09-23 283
Material Design设计规范(四) 1.文字输入框 2.图片组 3.排版 正文 1.文字输入框（Text fields） 用户需要输入文本信息时会使用到文字输入框。文字输入框的样式 Material Design 也做了漂亮的样式供我们参考。 △ 文本输入框 △ 图1为填充形输入框 图2为线框输入框 △ 填充形输入框 2.图片组（Image lists） 如果我们构建一个如朋友圈或...
Material Design设计规范
热门推荐
01-13 2万+
Google在I/O 2014上推出了新的设计语言Material Design。Material Design以现实世界的纸墨为隐喻，强调了阴影和层次，用动画效果代表现实的力反馈，试图把物理世界的规则带回电子界面。而就Android 平台而言，Material Design 不像此前的Holo 风格那样深沉，它更加跳动和富有活力。
安卓Material Design设计原则
入佛门六根不净，入商场狼性不足
03-21 1392
概述 我们挑战自我，为用户创造了崭新的视觉设计语言。与此同时，新的设计语言除了遵循经典设计定则，还汲取了最新的科技，秉承了创新的设计理念。这就是原质化设计(Material Design)。这份文档是动态更新的，将会随着我们对 Material Design 的探索而不断迭代、升级。 目标 我们希冀创造一种新的视觉设计语言，能够遵循优秀设计的经典定则，同时还伴有创新理念和新的科技。 mater...
Material Design设计规范与符合MD设计风格的库、APP
Notzuonotdied的博客
10-07 1万+
Material Design设计规范与符合MD设计风格的库、APP
使用MATLAB实现数值分析课程的算法
08-04
【项目资源】：包含前端、后端、移动开发、人工智能、物联网、信息化管理、数据库、硬件开发、大数据、课程资源，毕业设计等各种技术项目的源码。包括C++、Java、python、web、C#、EDA等项目的源码。 【适用人群】：适用于希望学习不同技术领域的初学者或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【附加价值】：项目具有较高的学习借鉴价值，也可直接拿来修改复刻。对于有一定基础或热衷于研究的人来说，可以在这些基础代码上进行修改和扩展，实现其他功能。 【沟通交流】：有任何使用上的问题，欢迎随时与博主沟通，博主会及时解答。鼓励下载和使用，并欢迎大家互相学习，共同进步。
基于python+卷积神经网络实现的轴承故障诊断算法+源码+文档（毕业设计&课程设计&项目开发）
08-04
基于python+卷积神经网络实现的轴承故障诊断算法+源码+文档，适合毕业设计、课程设计、项目开发。项目源码已经过严格测试，可以放心参考并在此基础上延申使用，详情见md文档~ 基于python+卷积神经网络实现的轴承故障诊断算法+源码+文档，适合毕业设计、课程设计、项目开发。项目源码已经过严格测试，可以放心参考并在此基础上延申使用，详情见md文档~ 项目简介： main为wdcnn卷积神经网络主文件，运行它就可以得出结果 preprocess为预处理文件，主要实现制作数据集的功能 日志文件保存在logs里面，通过启动tensorboard查看 wdcnn.png为卷积神经网络的结构图像
无声和平地铁公益v9.zip
08-04
无声和平地铁公益v9.zip
树芽读书.rar
08-04
小程序的设计源码通常包含多个文件和文件夹，组织结构清晰，以便开发者能够快速上手并进行定制化开发。主要文件和文件夹包括： 页面文件夹：存放小程序的各个页面，每个页面通常由.wxml、.wxss、.js和.json文件组成。WXML文件负责页面的结构，类似于HTML；WXSS文件负责样式，类似于CSS；JS文件负责页面的逻辑和交互；JSON文件用于页面的配置，如导航栏标题等。 组件文件夹：存放可复用的UI组件。组件与页面类似，也由.wxml、.wxss、.js和.json文件组成。通过组件化设计，可以提高代码的复用性和维护性，减少重复工作。 静态资源文件夹：存放图片、音频、视频等静态资源，便于在小程序中引用。这些资源通常放在一个名为assets或static的文件夹中。 配置文件：小程序的根目录下通常有一个app.json文件，用于全局配置，如页面路径、导航栏样式、底部Tab栏等。此外，还有app.wxss和app.js文件，分别用于全局样式和全局逻辑。 工具文件夹：存放一些工具函数和库文件，便于在小程序中调用。这些文件通常放在一个名为utils的文件夹中。
WPF 圆形进度条的设计与实现
08-04
WPF 圆形进度条的设计与实现
软件资源-瑞吉外卖，软件资源-瑞吉外卖
08-04
软件资源----瑞吉外卖
基于Springboot和Vue的 网上点餐系统源码 网上点餐系统代码（高分毕设）
08-04
网上点餐系统源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！ 系统源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！ 系统源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！
kali u11网卡驱动
最新发布
08-05
腾达u11 网卡驱动--kali
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值