# implicit vs. explicit

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="success" %}
* <mark style="color:red;">**implicit**</mark>: use <mark style="color:purple;">**`view.animation()`**</mark>, SwiftUI will automatically render the animation based on the <mark style="color:red;">**state changes**</mark> of the view.
* <mark style="color:red;">**explicit**</mark>: tell SwiftUI what <mark style="color:red;">**state changes**</mark> you want to animate inside the <mark style="color:purple;">**`withAnimation()`**</mark> block.
{% endhint %}

{% hint style="info" %}
An <mark style="color:red;">**implicit animation**</mark> is **part of the&#x20;**<mark style="color:orange;">**view tree**</mark>: by adding <mark style="color:purple;">**.animation()**</mark> to a view, **any change** to that view is **automatically animated**.
{% endhint %}

{% hint style="success" %}
we create an <mark style="color:orange;">**animatable view**</mark> by calling <mark style="color:purple;">**.animation()**</mark> on a view. When we create an <mark style="color:orange;">**implicit animation**</mark>, anytime the **view tree** is **recomputed**, changes of <mark style="color:red;">**animatable properties**</mark> in this view tree are animated.
{% endhint %}
{% endtab %}

{% tab title="💈範例" %}
* [spinner](examples/spinner "mention")
{% endtab %}

{% tab title="📗 參考" %}
* Thinking in SwiftUI, Ch. 6: Animations (p.113)
{% endtab %}

{% tab title="📘 手冊" %}
* [SwiftUI](https://developer.apple.com/documentation/swiftui) ⟩&#x20;
  * [Drawing and Animation](https://developer.apple.com/documentation/swiftui/drawing-and-animation) ⟩
    * [Animation](https://developer.apple.com/documentation/swiftui/animation) (<mark style="color:red;">**struct**</mark>)
    * [Animatable](https://developer.apple.com/documentation/swiftui/animatable) (<mark style="color:red;">**protocol**</mark>) - describes how to animate a property of a view
    * [withAnimation(_:_:)](https://developer.apple.com/documentation/swiftui/withanimation\(_:_:\))
  * View ⟩ [Graphics and Rendering](https://developer.apple.com/documentation/swiftui/view-graphics-and-rendering) ⟩
    * [.animation(\_:)](https://developer.apple.com/documentation/swiftui/view/animation\(_:\)-7mq1i) - applied to <mark style="color:red;">**equatable**</mark> view
    * [.animation(\_:value:)](https://developer.apple.com/documentation/swiftui/view/animation\(_:value:\)) - applied to <mark style="color:red;">**equatable**</mark> value (<mark style="color:red;">**non-equatable view**</mark>)
{% endtab %}
{% endtabs %}
