扁平按钮与凸起按钮 [英] Flat buttons vs raised buttons

问题描述

我想知道平面按钮和凸起按钮之间的基本区别.根据新的 Android 材质设计指南，我想使用凸起的按钮，但我不知道它们是什么.Web上有一些论坛显示了一个升高的按钮，但他们称其为Flat.

谁能告诉我两者的基本区别?(具体来看)

解决方案

两个 Button 都遵循新的 Flat Design 概念，而不是旧的 Gradient Design概念.

用于使用户感觉到这种感觉的是一个 Clickable 按钮，而不仅仅是带有文本或图像的彩色区域.

升高按钮

这是升高按钮，它使您感到它在部分表面上相对较高.这给用户一种感觉，他/她可以将其推下以期待特定的动作.更优雅，提供更好的用户体验

示例

平面按钮

这是 Flat Button .仅取决于表面颜色的变化部分，以使用户感觉到这是一个不同的地方，如果您单击它，可能会给您带来不同的操作.

示例

FAB按钮

这是 FAB按钮.(FAB表示 Floating Action Button (浮动操作按钮).它遵循Material Design中 Raised Button 的相同概念，但具有浮动功能.该FAB按钮可用于指示应用中的主要操作.

示例

选择要使用的按钮的类型

选择按钮样式取决于按钮的首要性，屏幕上容器的数量以及屏幕布局.-

I want to know the basic difference between Flat button and Raised Button. According to the new Android material design guidelines i want to use raised button but i don't know what are they. there are forums on the web that display a button which is raised but they call it Flat.

can any one tell me the base difference between the two ? (By Look specifically)

解决方案

Both Buttons are following the new Flat Design concept instead of the old Gradient Design concept.

Those concept used to give the user the feeling of this is a Clickable button not just a colored area with text or image.

Raised button

This is the Raised Button that gives you the feeling that it is relatively above the surface on part of it. Which give the user the feeling that he/she can push it down expecting a specific action. More Elegant and give better UX

Example

Flat button

This is the Flat Button. Which is only depend on change part of the surface color to give the user the feeling of this is a different place that might give you different action if you clicked on it.

Example

FAB button

This is the FAB Button. (FAB stands for Floating Action Button) Which is following the same concept of the Raised Button in Material Design, but with a floating feature. This FAB button can be used to indicate a primary action in an app.

Example

Choosing the type of button to use

Choosing a button style depends on the primacy of the button, the number of containers on screen, and the screen layout. - Material Design guidelines

According to the Material Design guidelines, you can choose which type of button to use based on these 3 factors:

• Function: Is it important and ubiquitous enough to be a floating action button?
• Dimension: Choose raised or flat depending on the container it will be in and how many z-space layers you have on screen. There should not be many layers of objects on the screen.
• Layout: Use primarily one type of button per container. Only mix button types when you have a good reason to, such as emphasizing an important function.

Possible usages

• Dialogs -> flat buttons
• Inline -> flat/raised buttons
• Always available -> FAB button/persistent footer button

这篇关于扁平按钮与凸起按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！