同态加法
The technological world is growing quick, every day some talented people come up with new technologies. If you are one of those people, you are a great guy! But if you are not, stop them from overtaking you, by learning what they have achieved.
技术世界发展Swift，每天都有一些人才提出新技术。 如果您是其中一个人，那么您就是个好人！ 但是，如果您不是，则通过学习他们所取得的成就，阻止他们超越您。
I have answered two fundamental questions in this story:
我已经回答了这个故事中的两个基本问题：
- What is Neumorphism? 什么是同态？
- How to implement Neumorphism in WPF? 如何在WPF中实现同态？
I hope my explanation will help you apply this new technology to your upcoming projects.
希望我的解释能帮助您将这项新技术应用于即将进行的项目。
什么是同态？ (What is Neumorphism?)
Neumorphism is a new Design Style trend in 2020. Actually, its first use was in the last of 2019.
Neumorphism是2020年一种新的设计风格趋势。实际上，其首次使用是在2019年末。
Before we define Neumorphism, Let us see the previous design styles:
在定义Neumorphism之前，让我们看一下以前的设计风格：
Skeuomorphism: is a style of interface elements that mimic their real-world equivalents in how they appear and how the user can interact with them.
拟态：是一种界面元素， 模仿它们在现实世界中的外观以及用户与之交互的方式。
Flat design: is a style of interface design emphasizing minimalist use of simple elements, typography, and flat colors. It is a commonly used style for designing a web or mobile interface.
平面设计：一种界面设计风格，强调简约元素，版式和平面颜色的简约使用。 它是设计Web或移动界面的常用样式。
Skeuomorphism style seems like reality. Flat design looks digital, but it is simple.
拟态风格看起来像现实。 平面设计看起来很数字化，但是很简单。
Neumorphism combines Skeuomorphism and Flat design: It is real and simple at the same time. With this style, we can give a unique experience to our users.
拟态结合了拟态和平面设计：它既真实又简单。 通过这种风格，我们可以为用户提供独特的体验。
Neumorphism cares about making realistic elements with simple shapes and colors.
Neumorphism致力于制作具有简单形状和颜色的逼真的元素。
如何在WPF中实现同态？ (How to implement Neumorphism in WPF?)
Together, we will implement Neumorphic Button like this:
我们将共同实现这样的Neumorphic Button：
1.概述 (1. Overview)
A Neumorphic element has a different way of representations (See images below), and based on the element behavior, we can decide which representation should we use.
Neumorphic元素具有不同的表示方式(请参见下图)，根据元素的行为，我们可以决定应使用哪种表示形式。
To apply Neumorphism style for any element, you must implement these three main properties:
要将Neumorphism样式应用于任何元素，必须实现以下三个主要属性：
background of the element must be as same as its Main container.
元素的背景必须与其主容器相同。
Dark shadow must be applied to one of the element’s corner.
必须将Undertow应用于元素的一角。
Light shadow must be applied to the opposite corner.
阴影必须应用到对角。
2.让我们开始编码 (2. Let’s start coding)
I divided the coding process into 4 parts:
我将编码过程分为四个部分：
- Making outer Neumorphic Button style. 制作外部Neumorphic Button样式。
- Making inner Neumorphic Button style. 制作内部Neumorphic Button样式。
- Applying animations. 应用动画。
- Adding a nice Icon. 添加一个不错的图标。
You can get all the code samples from here. Although the code was written with XAML language, you can still turn the same concepts into code with your favorite language.
您可以从此处获取所有代码示例。 尽管代码是使用XAML语言编写的，但是您仍然可以使用自己喜欢的语言将相同的概念转换为代码。
1.制作外部Neumorphic Button样式 (1. Making outer Neumorphic Button style)
Open Visual Studio, create a new WPF application, and name it “Neumorphism”. In this example, the solution name is “Neumorphism”.
打开Visual Studio，创建一个新的WPF应用程序，并将其命名为“ Neumorphism”。 在此示例中，解决方案名称为“ Neumorphism”。
Open Neumorphism.xaml, and add the following code:
打开Neumorphism.xaml ，并添加以下代码：
<Window x:Class="Neumorphism.Neumorphism"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Name="OuterGrid" Background="#E0E5EC">
<Border x:Name="OuterLowerBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
<DropShadowEffect x:Name="OuterDarkShadow" BlurRadius="12"
ShadowDepth="5" Direction="315"
Color="#000000" Opacity="0.2"/>
</Border.Effect>
</Border>
<Border x:Name="OuterUpperBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
<DropShadowEffect x:Name="OuterLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
</Border>
</Grid>
</Window>We have a grid element named OuterGrid which represents the main background color, also we have two Border elements: OuterLowerBorder to represent the dark shadow, and OuterUpperBorder to represent the Light shadow.
我们有一个名为OuterGrid的网格元素，它代表主要的背景色，还有两个Border元素： OuterLowerBorder代表暗阴影，而OuterUpperBorder代表浅阴影。
Very easy, right? With just two elements(grid and borders) we have obtained Neumorphism to our design.
很简单，对吧？ 仅用两个元素(网格和边界)，我们就获得了设计的同态性。
2.制作内部神经变形按钮样式 (2. Making Inner Neumorphic Button style)
If we just change the background of OuterLowerBorder and OuterUpperBorder from (#E0E5EC) to (Transparent), we will get another Neumorphism representation, I call it outer inner style because it is a mix between outer and inner style.
如果仅将OuterLowerBorder和OuterUpperBorder的背景从(＃E0E5EC)更改为(透明)，我们将获得另一个Neumorphism表示形式，我将其称为外部内部样式，因为它是外部样式和内部样式之间的混合。
<Window x:Class="Neumorphism.Neumorphism"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid x:Name="InnerGrid" Background="#E0E5EC">
<Border x:Name="InnerLowerBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerDarkShadow" BlurRadius="12"
ShadowDepth="5" Direction="315"
Color="#000000" Opacity="0.2"/>
</Border.Effect>
</Border>
<Border x:Name="InnerUpperBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
</Border>
</Grid>
</Window>
In order to change this to Inner style, we must hide the outer shadows (light and dark) that surrounding the borders and keep the inner shadow visible. We can do this by surrounding our borders with another border. This new border named SurroundingBorder must have the same properties as our main borders. Insert InnerGrid implementation into MainGrid implementation as following:
为了将其更改为内部样式，我们必须隐藏边界周围的外部阴影(浅色和深色)，并使内部阴影可见。 我们可以通过用另一个边界包围边界来做到这一点。 这个名为SurroundingBorder的新边界必须具有与我们的主要边界相同的属性。 将InnerGrid实现插入到MainGrid实现中，如下所示：
<Grid x:Name="MainGrid" Background="#E0E5EC">
<Border x:Name="SurroundingBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Grid x:Name="InnerGrid" Background="#E0E5EC">
<Border x:Name="InnerLowerBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerDarkShadow" BlurRadius="12"
ShadowDepth="5" Direction="315"
Color="#000000" Opacity="0.2"/>
</Border.Effect>
</Border>
<Border x:Name="InnerUpperBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
</Border>
</Grid>
</Border>
</Grid>
3.应用动画 (3. Applying Animations)
We have reached the most important part of this tutorial: How to make our Button? And How to make it clickable?
我们已经达到了本教程最重要的部分：如何制作按钮？ 以及如何使其可点击？
All we need to do is add the outer style above the inner style and make it disappear and appear according to user interaction.
我们需要做的就是在内部样式之上添加外部样式 ，并根据用户交互使其消失并显示。
The following code shows how to combine between outer and inner style:
以下代码显示了如何在外部和内部样式之间进行组合：
<Window x:Class="Neumorphism.Neumorphism"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid x:Name="MainGrid" Background="#E0E5EC">
<Border x:Name="SurroundingBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Grid x:Name="InnerGrid" Background="#E0E5EC">
<Border x:Name="InnerLowerBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerDarkShadow" BlurRadius="12"
ShadowDepth="5" Direction="315"
Color="#000000" Opacity="0.2"/>
</Border.Effect>
</Border>
<Border x:Name="InnerUpperBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Border.Effect>
<DropShadowEffect x:Name="InnerLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
</Border>
</Grid>
</Border>
<Grid Name="OuterGrid">
<Border x:Name="OuterLowerBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
<DropShadowEffect x:Name="OuterDarkShadow" BlurRadius="12"
ShadowDepth="5" Direction="315"
Color="#000000" Opacity="0.2"/>
</Border.Effect>
</Border>
<Border x:Name="OuterUpperBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
<DropShadowEffect x:Name="OuterLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
</Border>
</Grid>
</Grid>
</Window>To make these borders interact with the user, as you can see in the animated image above, we need to add some triggers to the Upper border in MainGrid which is OuterUpperBorder.
为了使这些边界与用户交互，你可以动画图像中看到上述情况，我们需要一些触发器添加到MainGrid上边界是OuterUpperBorder。
In OuterUpperBorder triggers, I have implemented two events: The MouseDown event, and the MouseUp event.
在OuterUpperBorder触发器中，我实现了两个事件： MouseDown事件和MouseUp事件。
<Border x:Name="OuterUpperBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
<DropShadowEffect x:Name="OuterLightShadow" BlurRadius="12"
ShadowDepth="5" Direction="135"
Color="#FFFFFF" Opacity="0.8"/>
</Border.Effect>
<Border.Triggers>
<EventTrigger RoutedEvent="MouseDown">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="OuterGrid"
Storyboard.TargetProperty="Opacity"
From="1" To="0" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterUpperBorder"
Storyboard.TargetProperty="Width"
From="90" To="80" Duration="0:0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterUpperBorder"
Storyboard.TargetProperty="Height"
From="90" To="80" Duration="0:0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLowerBorder"
Storyboard.TargetProperty="Width"
From="90" To="80" Duration="0:0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLowerBorder"
Storyboard.TargetProperty="Height"
From="90" To="80" Duration="0:0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterDarkShadow"
Storyboard.TargetProperty="ShadowDepth"
From="5" To="0" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLightShadow"
Storyboard.TargetProperty="ShadowDepth"
From="5" To="0" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="InnerDarkShadow"
Storyboard.TargetProperty="ShadowDepth"
From="0" To="5" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="InnerLightShadow"
Storyboard.TargetProperty="ShadowDepth"
From="0" To="5" Duration="0:0:0:0.2">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseUp">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="OuterGrid"
Storyboard.TargetProperty="Opacity"
From="0" To="1" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterUpperBorder"
Storyboard.TargetProperty="Width"
From="90" To="100" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterUpperBorder"
Storyboard.TargetProperty="Height"
From="90" To="100" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLowerBorder"
Storyboard.TargetProperty="Width"
From="90" To="100" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLowerBorder"
Storyboard.TargetProperty="Height"
From="90" To="100" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterDarkShadow"
Storyboard.TargetProperty="ShadowDepth"
From="0" To="5" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="OuterLightShadow"
Storyboard.TargetProperty="ShadowDepth"
From="0" To="5" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="InnerDarkShadow"
Storyboard.TargetProperty="ShadowDepth"
From="5" To="0" Duration="0:0:0:0.2">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="InnerLightShadow"
Storyboard.TargetProperty="ShadowDepth"
From="5" To="0" Duration="0:0:0:0.2">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
</Border>In the MouseDown event trigger, I’ve made four animated changes to our Neumorphic Button to transform it from outer style to inner style:
在MouseDown事件触发器中，我对Neumorphic Button进行了四个动画更改，以将其从外部样式转换为内部样式：
Hiding OuterGrid by reducing its Opacity to 0.
通过将其不透明度降低到0来隐藏OuterGrid 。
Reducing the Width and Height of OuterUpperBorder and OuterLowerBorder (outer borders).
减少OuterUpperBorder和OuterLowerBorder (外部边界)的宽度和高度。
Decreasing the ShadowDepth of OuterDarkShadow and OuterLightShadow (shadows of outer borders).
减小OuterDarkShadow和OuterLightShadow (外部边界的阴影)的ShadowDepth 。
Increasing the ShadowDepth of InnerDarkShadow and InnerLightShadow (shadows of inner borders).
增加InnerDarkShadow和InnerLightShadow (内部边界的阴影)的阴影深度 。
In the MouseUp event trigger, I’ve made four animated changes to our Neumorphic Button to transform it from inner style to outer style (as same as the MouseDown event trigger but in the opposite direction):
在MouseUp事件触发器中，我对Neumorphic Button进行了四个动画更改，以将其从内部样式转换为外部样式(与MouseDown事件触发器相同，但方向相反)：
Displaying OuterGrid by turning its Opacity to 1.
通过将其不透明度设置为1来显示OuterGrid 。
Expanding the Width and Height of OuterUpperBorder and OuterLowerBorder (outer borders).
扩展OuterUpperBorder和OuterLowerBorder (外部边界)的宽度和高度。
Increasing the ShadowDepth of OuterDarkShadow and OuterLightShadow (shadows of outer borders).
增加OuterDarkShadow和OuterLightShadow (外部边界的阴影)的ShadowDepth 。
Decreasing the ShadowDepth of InnerDarkShadow and InnerLightShadow (shadows of inner borders).
减小InnerDarkShadow和InnerLightShadow (内部边界的阴影)的ShadowDepth 。
4.添加一个漂亮的图标 (4. Adding a nice Icon)
This part is not important: you can put whatever content you want in MainGrid (Upper layer).
这部分并不重要：您可以将所需的任何内容放入MainGrid (上层)。
I used an Icon from Material design icons. If you want to keep going with me, you must install Material Design In Xaml Toolkit on your project. This guide Super QuickStart will help you with that.
我使用了Material design图标中的Icon。 如果您希望与我保持联系，则必须在项目上安装Material Design In Xaml Toolkit 。 本指南超级快速入门将为您提供帮助。
The following code demonstrates how to add Icon to MainGrid children:
以下代码演示了如何向MainGrid子级添加Icon：
<Grid x:Name="MainGrid" Background="#E0E5EC">
<Border x:Name="SurroundingBorder"
Height="100" Width="100" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="Transparent" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="12">
<Grid x:Name="InnerGrid" Background="#E0E5EC">
...
</Grid>
</Border>
<Grid Name="OuterGrid">
...
</Grid>
<materialDesign:PackIcon Name="LoveIcon" Kind="Heart"
HorizontalAlignment="Center" VerticalAlignment="Center"
Width="60" Height="60" Foreground="LightGray"/>
</Grid>Now, add Icon’s animations to the MouseDown and MouseUp event trigger:
现在，将Icon的动画添加到MouseDown和MouseUp事件触发器：
<Border x:Name="OuterUpperBorder"
Height="90" Width="90" Cursor="Hand"
VerticalAlignment="Center" HorizontalAlignment="Center"
Background="#E0E5EC" BorderBrush="#E0E5EC"
BorderThickness="5" CornerRadius="7">
<Border.Effect>
...
</Border.Effect>
<Border.Triggers>
<EventTrigger RoutedEvent="MouseDown">
<BeginStoryboard>
<Storyboard>
...
<ColorAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="(materialDesign:PackIcon.Foreground).(SolidColorBrush.Color)"
To="LightGray" Duration="0:0:0:0.2">
</ColorAnimation>
<DoubleAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="Width"
From="60" To="50" Duration="0:0:0:0.2" >
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="Height"
From="60" To="50" Duration="0:0:0:0.2" >
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseUp" >
<BeginStoryboard>
<Storyboard>
...
<ColorAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="(materialDesign:PackIcon.Foreground).(SolidColorBrush.Color)"
From="LightGray" To="Red" Duration="0:0:0:0.2">
</ColorAnimation>
<DoubleAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="Width"
From="60" To="70" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="LoveIcon"
Storyboard.TargetProperty="Height"
From="60" To="70" Duration="0:0:0:0.2" AutoReverse="True">
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Border.Triggers>
</Border>When the Mouse down:
当鼠标按下时：
LoveIcon color will return to its original state (LightGray).
LoveIcon颜色将恢复为其原始状态(浅灰色)。
LoveIcon width and height will decrease.
LoveIcon的宽度和高度将减小。
When the Mouse Up:
鼠标向上移动时：
LoveIcon color will change to Red.
LoveIcon颜色将变为红色。
LoveIcon width and height will increase.
LoveIcon的宽度和高度会增加。
Finally, you did it! Run the project and see what you have achieved.
最后，您做到了！ 运行该项目，并查看所取得的成就。
Thank you for your time. I hope you found your purpose and enjoyed reading my article. If you have any questions or notes, feel free to write it in the responses here.
感谢您的时间。 希望您找到了目标，并喜欢阅读我的文章。 如果您有任何疑问或笔记，请随时在此处的答复中写下。
翻译自: https://towardsdatascience.com/neumorphism-with-animation-1c24a4c0e2b4
同态加法
扫一扫
1020
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
