dt shiny_为SwiftUI引入Shiny

最新推荐文章于 2024-05-17 09:49:40 发布

weixin_26638123

最新推荐文章于 2024-05-17 09:49:40 发布

阅读量141

点赞数

原文链接：https://medium.com/better-programming/introducing-shiny-for-swiftui-7fe4567af77

版权

dt shiny

Today, I’m excited to share my latest SwiftUI package: Shiny.

今天，我很高兴分享我最新的SwiftUI软件包： Shiny 。

闪亮介绍 (Introducing Shiny)

With just one word, you can add meaningful motion effects to your app.

仅需一个字，您便可以为应用程序添加有意义的动作效果。

Shiny uses your iOS device’s gyroscope to simulate lighting and motion effects on colors. It works on almost every native SwiftUI view.

Shiny使用iOS设备的陀螺仪模拟颜色的照明和运动效果。它几乎适用于所有本机SwiftUI视图。

Inspired by the Apple Cash Card, Shiny lets you quickly build a playful user experience. Wiggle your iPhone to see shiny effects like rainbow, iridescent, matte, glossy, and more!

受Apple Cash Card的启发，Shiny可让您快速构建有趣的用户体验。摆动您的iPhone，即可看到闪亮的效果，例如彩虹，虹彩，磨砂，光泽等等！

闪亮入门 (Getting Started With Shiny)

添加包裹 (Add the package)

Adding a Swift package to your Xcode project is easy: File > Swift Packages > Add Package Dependency.

将Swift软件包添加到Xcode项目很容易：“文件”>“ Swift软件包”>“添加软件包依赖性”。

Then, paste this URL: https://github.com/maustinstar/shiny.

然后，粘贴此URL： https : //github.com/maustinstar/shiny 。

使用闪亮 (Use Shiny)

It just takes one word to get started: .shiny(). To get started, add the shiny view modifier to views like Text, a Toggle, or a VStack.

只需一个词即可开始： .shiny() 。首先，将shiny视图修改器添加到诸如Text ， Toggle或VStack 。

Shiny Text

闪亮文字

Shiny works on almost every native SwiftUI view.

Shiny几乎适用于所有本机SwiftUI视图。

Note: Shiny needs a gyroscope to simulate lighting effects. Xcode previews and simulators don’t have a gyroscope, so test your shiny views on a real device.

注意：Shiny需要陀螺仪来模拟照明效果。 Xcode预览版和模拟器没有陀螺仪，因此请在真实设备上测试您的闪亮视图。

演示：光泽和哑光纹理 (Demo: Glossy and Matte Textures)

My favorite texture combination is matte black with glossy black. With Shiny’s variety of gradient textures, we can create two black surfaces that react differently to simulated light.

我最喜欢的纹理组合是哑光黑色和光泽黑色。使用Shiny的各种渐变纹理，我们可以创建两个黑色表面，它们对模拟光的React不同。

The card is matte black. This means the simulated light source is diffused throughout the texture. The text is a glossy black with a more intense and focused light source.

该卡为磨砂黑。这意味着模拟光源会散布在整个纹理中。文本是有光泽的黑色，带有更强烈和更集中的光源。

The color combination (both based on black) appears distinct because they react differently to the iPhone’s motion.

颜色组合(均基于黑色)看起来很鲜明，因为它们对iPhone的动作有不同的React。

Does it remind you of Apple’s Space Grey?

它使您想起苹果的太空灰吗？

Image for post — Glossy black text on a matte black card

With Shiny, it’s really easy to add custom lighting effects. The functions .matte() and .glossy() generate gradients from any UIColor, so the effects match your native color palette.

使用Shiny，添加自定义照明效果非常容易。函数.matte()和.glossy()从任何UIColor生成渐变，因此效果与您的本机调色板匹配。

See more examples on GitHub.

在GitHub上查看更多示例。