Material 3 图标/按钮默认尺寸为何异常巨大?

huangapple go评论63阅读模式
英文:

Why Material 3 Icon/Button sizes are abnormally huge by default?

问题

我最近简要了解了Compose中的Material 3,并在我目前正在构建用于学习的应用中实施了它(谷歌日历克隆)。在谷歌日历应用中,我猜想它遵循Material 2,按钮和开关的大小似乎正常。但是在我的应用中使用Material 3,一切都显得异常巨大。这是否是Material 3应该如何的?我选择制作克隆是因为我想要一个良好的UI参考。我想我不应该在这个应用中使用Material 3。您对M2与M3中的默认尺寸有什么看法?

我附上了我尝试从谷歌日历应用中复制的相同屏幕。

Material 3 图标/按钮默认尺寸为何异常巨大?

Material 3 图标/按钮默认尺寸为何异常巨大?

我尝试使用Button/TextButton组件的contentPadding参数来减少填充,但并没有成功。

英文:

I recently learnt briefly about material 3 in compose & implemented it in the current app I'm building for learning purposes (google calendar clone). In google calendar app, which I guess follows material 2, the size of buttons and switches seem normal. But with material 3 in my app, everything seems abnormally huge. Is it how material 3 is supposed to be? I chose to make a clone because I wanted a good UI reference. I guess I shouldn't have used material 3 for this app. What are your thoughts on the default sizes in M2 VS M3?

I've attached the same screen I tried to replicate from google calendar app.

Material 3 图标/按钮默认尺寸为何异常巨大?

Material 3 图标/按钮默认尺寸为何异常巨大?

I tried reducing the padding with contentPadding parameter in Button/TextButton composables. But it didn't work outm

答案1

得分: 0

有关M2M3设计的大小和形状存在差异,以及switch的设计,两者看起来也非常不同。

这是因为这两种设计系统和它们各自的库在其UX/UI设计和Compose实现方面有显着差异。

Google还建议不要从M2迁移到M3 Compose,除非您已经将您的应用设计从M2迁移到M3

如果您的应用程序使用了设计系统,比如使用Figma创建的设计系统,在这种情况下,我们还强烈建议您或您的设计团队在开始Compose迁移之前将其从M2迁移到M3。如果应用的UX/UI设计基于M2,迁移到M3是没有意义的。

更多详细信息可在此处找到:从M2迁移到M3设计

英文:

Yes there are difference in size and shape of both M2 and M3 design, also as you can see the design of switch, both looks quite different.

> This is due to the fact that the two design systems and respective
> libraries differ significantly in terms of their UX/UI designs and
> Compose implementations.

Google also recommends not to migrate from M2 to M3 compose unless you have migrate your app design M2 to M3.

> Your app may use a design system, such as one created using Figma. In
> such cases, we also highly recommend that you or your design team
> migrate it from M2 to M3 before starting the Compose migration. It
> doesn’t make sense to migrate an app to M3 if its UX/UI design is
> based on M2.

More details can be found on : Migrate M2 to M3 Design

huangapple
  • 本文由 发表于 2023年3月9日 15:26:34
  • 转载请务必保留本文链接:https://go.coder-hub.com/75681538.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定