首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

调整材质UI图标高度的最佳实践

是根据具体的设计需求和用户体验来确定。下面是一些常见的实践方法:

  1. 根据设计规范:材质UI是Google推出的一种设计语言,它有一套详细的设计规范。根据这些规范,可以确定图标的标准高度和间距,以保持一致性和统一性。
  2. 考虑屏幕密度:不同设备的屏幕密度不同,图标在不同设备上可能会有不同的显示效果。因此,在调整图标高度时,需要考虑不同屏幕密度下的适配问题,以确保图标在各种设备上都能够清晰显示。
  3. 用户可点击区域:在调整图标高度时,需要确保图标的点击区域足够大,以便用户能够轻松点击。一般来说,建议将图标的高度设置为48dp,这样可以保证足够的点击区域。
  4. 与文本配合使用:图标通常与文本一起使用,用于传达特定的含义。在调整图标高度时,需要考虑与文本的配合效果,确保图标和文本之间的比例和平衡感。
  5. 可访问性考虑:在调整图标高度时,需要考虑到可访问性需求。例如,对于视力受损的用户,可能需要将图标的高度适当增加,以便更容易辨认。

总之,调整材质UI图标高度的最佳实践是根据设计规范、屏幕密度、用户可点击区域、与文本配合使用和可访问性等因素综合考虑,以达到良好的用户体验。对于具体的实现,可以参考腾讯云的设计资源和工具,如腾讯云设计规范和腾讯云设计工具包等。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

介绍高维超参数调整 - 优化ML模型最佳实践

如果你一直在努力调整机器学习模型(ML)性能,那么你读这篇文章算是找对了地方。 超参调整针对问题是如何为一个学习算法找到最优参数集合。 通常,选出这些值过程是非常耗时。...优化神经网络(NNs)时,一些需要调整参数包括: 学习速率 动量 正则化 dropout概率 批量标准化 在这篇短文中,我们谈论用于优化机器学习模型最优方法。...当需要调整参数超过两个或三个时候,这些方法可以被使用。 网格搜索问题 当我们只有少量参数需要优化时候,网格搜索通常是个好选择。...如果最佳候选值非常接近边缘,那么您范围可能会偏离,应该移动值范围并重新采样。此外,在选择好第一个候选值之后,可以尝试重新采样到更精细值范围。 总之,这些是关键要点。...如果要调整超过两个或三个超参数,则首选“随机搜索”。它比网格搜索更快/更容易实现和收敛。 使用适当比例来选择您值。可以试试对数空间中均匀分布样本取样。

78830

设计师会编程、程序员懂艺术:Semi Flat Design

Metro UI,也叫Modern UI、Windows8 Style UI,是微软基于设计语言设计一种界面风格,此设计在创造之后被用于移动操作系统Windows Phone、Windows 8、Xbox...1.3 Semi Flat 半扁平化 semi Flat风格最突出表现,就是在扁平化图标的基础上加阴影效果,让图标更具有活力,当然还有其他表现,比如增强在光感、层级、材质三维效果。 ?...加上阴影图标 代表案例1: 谷歌Material Design ?...正确做法: y轴是高度值,表示各种元素在界面上高度关系,我们可以据此计算出各元素应该有的阴影长度。 代表案例2: 微软最新发布Fluent Design ?...,就是在扁平化图标加上阴影效果,让图标更具有活力,还有其他表现,比如增强在光感、层级、材质三维效果。

2.4K60
  • SAP最佳业务实践:ETO–项目装配(240)-4基于SD更改调整项目

    image.png CJ20N基于 SD 更改调整项目 创建客户订单后,需要基于订单中更改精调项目。 角色项目经理 后勤®项目系统®项目®项目构造器 1....在屏幕右侧项目 基本数据 选项页上,根据销售订单中要求交货日期将字段 完成日期 中日期更改为早一个月。选择回车,如果出现任何警告信息,选择回车确认。 2....在 输入网络确认:实际数据屏幕中,输入以下数据: 字段名称 描述 用户操作和值 注释 加工程度 % 100 最终确认 选中该复选框 确认 组框 实际(开始) 活动开始日期 当前日期 组框确认中第一个输入字段...实际(结束) 活动完成日期 当前日期 组框确认中第二个输入字段。 6. 选择 返回。 使用 回车确认信息消息输入最后确认将会设置剩余工作为零。 7. 使用 是 确认输入实际日期 对话框。...您已经基于销售订单调整项目。已经更改完成日期、重新计划项目、审批 WBS 要素订单,并已确认阶段中第一个活动。

    1.9K80

    最新iOS设计规范七|10大视觉规范(Visual Design)

    视图可能包含尺寸类型任意组合: 常规宽度,常规高度 紧凑宽度,紧凑高度 常规宽度,紧凑高度 紧凑宽度,常规高度 iOS会根据内容区域尺寸类型动态地进行布局调整。...为了获得最佳结果,请使用系统提供标准界面元素和“自动布局”来构建您界面,并遵守布局指南和安全区域定义。...通常,为UI元素使用语义定义系统颜色。 ? 动态系统颜色 除了以上系统颜色外,iOS还提供用于传达其目的而非其外观或颜色值语义定义颜色。例如用于用于背景区域和前景内容颜色,标签、分隔符和填充。...必要时为明暗外观设计单独标志符号。在浅色模式下使用线性图标或符号,在深色模式下可能则需要更实心填充图标或符号。 确保全彩色图像和图标看起来都很好。...通过对背景色进行采样并修改饱和度和值,Vibrancy 使UI元素变亮或变暗。充满活力用户界面元素能更好地与材质相结合,并增强半透明效果。 标签和填充每个都提供几个级别的活力值;分隔符只有一个级别。

    8.1K30

    专业光线追踪与全域光渲染软件KeyShot 2023新版发布,详解10大新功能

    keyshot 64位 直链-安装包:https://souurl.cn/9JU4Mn keyshot mac版 直链-安装包:https://souurl.cn/TfwVKM新功能一:全新UI...Web查看器在底部工具栏添加了图标按钮。新功能二:多了两个新材质库类型:Twinbru布料和人体肤色材质。新功能三:多了三个启动预设场景模板,分别为大场景、中场景、小场景。...新功能七:材质节点曲线淡入淡出和曲线节点对材质纹理或材质支持更多控制参数动画。新功能八:材质节点新增射线面罩节点,排除材质反射可见、阴影可见、相机可见、材质双面等功能。...新功能十:在颜色库中新增了Coloro色彩标准,更多好看配色方案可供选择。除了新功能讲解,KS2023官方材质库包含布料、车漆、半透明、宝石、玻璃、皮革等,26种材质分类,900+个材质!...调整了导出 USD 和 GLB 文件中凸起高度,以改进对这些文件在其他应用程序中支持。修复了材质图中 Color Composite 节点混合模式问题。修复了某些 AxF 类型颜色问题。

    1.9K30

    高效 UI 组件,节省开发时间 | 开源专题 No.70

    应用程序提供简单、模块化和可访问 UI 组件库。...它解决了快速构建符合无障碍网页最佳实践现代 Web 应用和网站问题。...aria-* 属性以达到无障碍标准 大部分 Chakra UI 组件都支持暗黑模式 简洁易懂且灵活可变动性强大:Chakra UI 设计理念是简洁明了并且高度模块化 其主要特点包括: 易于样式设计:Chakra...可以自由地进行混搭与重复使用:所有 Charka UI 元素都是在 React 基础上开发出来,在保证功能完整性同时也保留了足够多可以修改与调整空间。...:使用任何图标作为单个类 变体组:具有常见前缀群组工具速记法 CSS 指令:使用 @apply 指令在 CSS 中重复使用工具 chokcoco/iCSShttps://github.com/chokcoco

    13910

    教你绘制轻拟物风格指南针图标

    这次我们要绘制一个轻拟物风格“星空指南针”图标。就是下图这样啦: 拟物图标UI设计中除了线性图标,面性图标外非常重要图标分支类型。而拟物图标在发展过程中又衍生出来了现在非常受欢迎轻拟物图标。...轻拟物图标对拟物图标的细节,材质进行简化,保留了拟物化图标的光影效果和些许质感,强调空间,阴影等内容展现。也代表了当今图标的进化趋势。值得各位UI设计师精进学习。...其实你只要细心,这些都是基础操作,当你用心去调整渐变,高光效果和阴影,最终做出成品后,相信会特别有成就感,加油! 本次案例我们采用即时设计平台来完成,大家也可以熟悉一下相关操作。...最重要是了解设计原理,这一点至关重要。

    69110

    【软件开发规范七】《Android UI设计规范》

    Material Design相关 2.1 核心思想 2.2 材质与空间 2.3 动画 2.4 颜色 2.5 图标 2.6 图片 2.7 文字 字体 文字排版 2.8 布局 2.9 组件(Components...) 2.10 模式(patterns) 2.11 资源 2.12 实践 ---- 1....2.2 材质与空间 材质 ​编辑 Material Design 中,最重要信息载体就是魔法纸片。纸片层叠、合并、分离,拥有现实中厚度、惯性和反馈,同时拥有液体一些特性,能够自由伸展变形。...编辑 小图标同样有栅格系统。线条、空隙尽量保持2dp宽,圆角半径2dp。特殊情况相应调整。 ​...编辑 ​编辑 小图标的颜色使用纯黑与纯白,通过透明度调整: 黑色:[54% 正常状态] [26% 禁用状态] 白色:[100% 正常状态] [30% 禁用状态] 2.6 图片 ** 选用图片 **

    5.1K20

    UnityUI设计

    集中UI对象:以智能方式集中UI对象,避免不必要资源浪费。 最佳实践 最佳实践指南:遵循Unity官方最佳实践指南,可以有效优化UI性能和视觉效果。...ContentSizeFitter组件:这是一个用于自动调整UI元素大小组件,可以根据内容大小自动调整UI元素宽度和高度。...在Unity中封装UI组件最佳实践和技巧可以从以下几个方面进行总结: UnityUI Toolkit是一个强大工具,可以帮助开发者创建自定义UI和扩展。...Unity官方推荐UI设计最佳实践指南在哪里可以找到? 根据搜索结果,Unity官方推荐UI设计最佳实践指南可以在Unity学习网站上找到。...具体来说,提到了“最佳实践指南 - Unity 手册”,这表明Unity官方提供了关于UI设计和开发最佳实践指南。

    13710

    如意设计助手× TDesign:产品设计绝佳搭档

    为了提升设计系统在组织内采用率,腾讯云设计团队研发了 Figma 插件——如意设计助手,支持使用代码组件库进行设计;支持 Design tokens 最佳实践落地,Figma 内轻松切换主题与深浅模式...TDesign 提供了开箱即用 UI 组件库、设计指南和相关设计资产 设计系统实践过程中遇到挑战 TDesign 作为一个庞大设计体系对于设计提效具有巨大价值,但其也同样面临设计系统建设中挑战...对于长期迭代设计系统,多源管理几乎是灾难性。比如设计师调整某个 Design Token 值,并不能及时通知到下游 UI 组件库调整。 设计师与开发工程师在设计系统中工作是脱节。...Design Tokens:支持最佳实践落地,轻松切换主题与深浅模式 Design tokens 是设计系统自定义主题和设计流程自动化基础。Token 是存储视觉设计属性命名实体。...Module》标准文件格式,按照最佳实践三层结构(基础类 - 语义类 - 组件类)组织方式,为 Design Tokens 维护一个"唯一可信数据源"。

    71532

    SceneKit 场景编辑器-为您AR体验构建3D舞台

    材质 让我们切换到Material Inspector。材质赋予模型物理外观,无论是颜色,照明还是纹理。没有材料,网格只是一个赤裸裸骨架。 我们将介绍最常用材料属性,并将地球用作简单参考。...要调整节点视图,诀窍是双击节点名称框旁边节点图标。为节点分配默认颜色白色。你现在看到它是黑色,因为背景也是白色。让我们在屏幕上保存一些不动产并隐藏Project Navigator。...我们将宽度设置为3.33,高度设置为3.86,长度设置为1.14。然后,将倒角半径设置为0.5。倒角半径是圆角。您可以随时根据需要调整视图。...转到“ 材质”检查器,在“ 属性”部分中,将“ 着色”更改为“ Blinn”。然后,单击“ 漫反射”。在调色板窗口底部,有一个颜色选择器图标。...您可以单击箭头以展开并查看隐藏节点。 缩放 请记住,我们测量是米大小。现在我们应该将整个手表缩小到1%。选择框父节点。对于比例,为x,y和z输入0.01。双击该框节点图标调整视图。

    5.5K20

    Unity基础(4)-资源管理知识(1)

    Gizmos Gizmos文件夹存放用Gizmos.DrawIcon方法使用贴图、图标资源。放在Gizmos文件夹中贴图资源可以直接通过名称使用,可以被Editor作为gizmo画在屏幕上。...Scripts 文件夹下面一般根据功能划分,辅助类Utils/ 管理UI/ 管理角色Role/ 2、Unity资源下材质 1:材质 材质是指某个表面的最基础材料,如木质、塑料、金属或者玻璃等,用于渲染纹理就是材质...�纹理可不必是正方形,即宽度和高度可以不同。�一般最小像素大于等于32,最大像素大于等于8192. Format:表示图片显示格式: ? Format ?...3:关于Unity图片格式:Texture Type 法线贴图 (Normal maps) :灰度图,可以用作对象高度图,呈现凹凸表面。...Sprite(2D and UI) : 制作游戏或者虚拟UI界面就要选择这种格式 ?

    2.4K20

    能量满满 生机焕发|QQ游戏中心体验升级

    随着产品目标的调整,游戏中心功能也逐渐丰富化,除开领福利和找游戏,用户可以在此消费游戏内容、购买游戏道具、以及使用游戏相关功能等,用户触达游戏方式变得更加多元,用户粘黏性也进一步提升,产品依势也需要打造更好产品游戏氛围感和品牌印象来建立用户口碑...除开界面风格,图标的设计也融入了游戏中心特色——保持基础型与手Q图标一致外,同时将一些图标通过游戏化语义表达出来,使其更具趣味性和游戏感。...在UI界面的运用 在产品核心界面上,将能量石作为背景图案使用,强化品牌和氛围感; 和业务也进行结合——以能量石将商城幸运值图形化,让品牌和功能直接连接起来; 把能量石材质和游戏元素进行结合——王者皮肤墙功能内...除开宝箱外,对业务内常用图标进行了3D化处理。...材质 考虑到UI界面的通用性,避免3D材质喧宾夺主,材质风格以简单通用为主,颜色以界面主色调为基础,漫射材质多营造轻黏土通用质感;针对能量石材质,则采用光感通透玻璃材质

    92320

    【教程】C4D制作Lowpoly风格

    该教程我把它分成三部分:建模、材质、渲染。 其实,做3d大流程都差不多,只不过内容有所不同而已。 建模篇 第一步:打开C4D软件,在形状工具中找到‘平面’工具 ?...第二步:按键盘c或界面左上角图标,将平面转化成可编辑对象 ? 第三步:选择对象到‘多边形’ ? 按键盘m键,再按c键,调出笔刷工具,将衰减值改成50%,模式改成表面,笔刷强度50%,半径60cm。...自然光设置调整 ? 自然光‘常规’参数设置 ? 自然光‘投影’参数设置 ? 反射光- ? 反射光‘常规’参数设置 ? 第二步:点击‘摄像机’,进入摄像机对象模式,调整视图 ?...退出摄像机对象模式,对摄像机细节进行设置, 勾线前景模糊和背景模糊, 再在视图中根据需要调整前景模糊和背景模糊距离数值。 ? 第三步:编辑渲染器设置 编辑渲染器设置-输出尺寸,其他数值不变 ?...编辑渲染器设置-抗锯齿最佳,最小级别2*2,最大级别4*4 ? 编辑渲染器设置-点击‘效果’,选择‘全局光照’和‘环境吸收’ ?

    1.7K20

    Unity-Optimizing Unity UI(UGUI优化)03 Fill-rate,Canvas and Input

    比如要混合游戏物体色调,不要通过几个游戏物体进行混合,尽量使用材质来实现。不要创建仅仅作为文件夹没有其他意义节点。...这些都取决于图标的大小、数量和可接受填充率。 这里有一些合并UI元素缺点,特定元素不能再次被使用,需要创建额外美术资源。...这个问题通常发生在文本和精灵图片彼此靠比较时候,本文边界框与精灵图片边界框重叠了,由于文本多边形是透明,可以通过以下两个方法来解决: 重新进行排序让不可合并材质移动到两个可合并材质上方或者下方...这些在实践中是困难,特别是将UI元素封装到预制体时候。许多UI将被划分到子Canvas中。...Raycasting 优化建议: 鉴于全部Raycast必须测试全部Graphic Raycaster,最佳做法是尽在必须启用'Raycast Target'UI对象上启用设置。

    2.5K30

    星联赛 - 最社交电竞设定

    最终应用于UI界面的是3D化logo,考虑到与比赛四款游戏调性相配,选用了百搭玫瑰金作为logo主体材质,因为四款游戏UI中均有融入很多金属元素;这种材质也方便适配不同赞助商品牌色。 ?...在这里我们直接将主kv稍加调整用于头部主视觉,强调品牌同时,又精准表达活动内容。...图形以三角形为基础,添加质感,折角由45°角相切而成,三角边框协调图标之间平衡感,确保图标体量感统一。 ?...d.按钮 星联赛活动逻辑相对复杂,所用按钮之处比较多,在所有页面中报名页面流程最多,所需按钮状态多样,设计过程中将不同状态按钮创建成独立组件,可以快速调用到所需页面中,便于调整。 ?...腾讯微视星联赛项目通过在设计中自然品牌植入与线上线下双渠道活动曝光,在赛事、选手和玩家之间形成了良性发展生态圈,进一步增强了用户粘性,有效提升了商业伙伴及目标用户群体心中品牌高度

    84320
    领券