钉钉开发文档

按钮

更新时间: 2018-5-8

定义
1.针对界面及模块内容的功能操作控件,分为页面层级按钮和模块层级按钮,并对用户的点击做出反应,即时操作。
2.不适配字体放大。

使用规则
1.标准按钮分为主要按钮和次要按钮和模块按钮三大类。
2.一个页面中只能有一个主要按钮。

页面层级按钮
1.整个页面的操作,承接下一个主流程。
2.按钮分为:主要操作、辅助操作和警告类操作三类。辅助操作按钮不可单独出现。
3.高度固定48PT,圆角3PT,0.5PT描边。

17.png

主功能层级按钮
1.使用主按钮会扰乱页面信息,或者主按钮过重时,使用次要按钮
2.按钮内文本左右边距最小16PT,最大不限
3.高度固定36PT,圆角3PT,0.5PT描边
4.蓝色填充按钮:优先级高,希望用户操作,强引导
5.蓝色幽灵按钮:优先级较弱,用户可操作可不操作,弱引导
6.灰色辅助按钮:优先级最低,并不希望用户离开当前页面

18.png

模块层级按钮
1.对页面中某一个模块进行操作,一个页面中可能有很多个模块。
2.按钮内文本左右边距最小16PT,最大无限制。
3.高度固定32PT,圆角2PT,0.5PT描边,字体大小13PT。

19.png

文字按钮

20.png

按钮布局
信息页按钮:单纯信息展示的页面按钮,放置于界面底部,主Action放在页面右边。

21.png

信息页按钮-无白底
按钮底部白色框架影响视觉效果,可使用无白底的样式,但是请确保按钮与内容分离,不要重叠混在一起。

22.png

列表按钮
按钮紧随最后一个控件,不放置于界面底部。按钮距离上一个控件32PT。如果列表很长,可以不使用按钮,Action放在右上角。

23.png

横向并列布局
同类型模块多个按钮布局方向应具有统一性,通常情况下以右侧界面边距为基准向左排列。
横向并列布局时按钮宽度应根据按钮内容自适应并合理布局保持信息层级清晰,按钮内容应简要、明确。

24.png

以上内容是否对您有帮助:
在文档使用中是否遇到以下问题(多选):
  • 内容错误
  • 更新不及时
  • 链接错误
  • 缺少代码/图片示例
  • 太简单/步骤待完善
手机号
更多建议
提交成功,感谢您的反馈!