【SwiftUI】Color とは一体何なのか

ふと思ったのですが。


Color
  .red
  .frame(width: 200, height: 200)

ただの「色」なのに、

「縦横寸法が指定できる」

「枠や対象がないのに表示される」

なんだか気持ち悪くないですか。

一体何者なんだ。

 

🎨 何者であるかの種類

思いつくものを、いくつか挙げておきます。

このうちのどれかだと思います。

View
A type that represents part of your app’s user interface and provides modifiers that you use to configure views.
アプリのユーザーインターフェイスの一部を表し、ビューの設定に使用する修飾子を提供するタイプ。

👉 View | Apple Developer Documentation hatena-bookmark

Shape
A 2D shape that you can use when drawing a view.
ビューを描くときに使用できる2D形状。

👉 Shape | Apple Developer Documentation hatena-bookmark

ShapeStyle
A color or pattern to use when rendering a shape.
図形をレンダリングするときに使用する色またはパターン。

👉 ShapeStyle | Apple Developer Documentation hatena-bookmark

眺めてるとなんとなくわかります。

何者かの種類のことが

「Protocol」

だったのですね !

 

🎨 よく使うあれは何者なのか

ドキュメントの「Conforms To」のところを見ます。

よく使うやつを見てみます。

Text
A view that displays one or more lines of read-only text.


Conforms To
Equatable
Sendable
View // *

👉 Text | Apple Developer Documentation hatena-bookmark

→ Text は View。

Button
A control that initiates an action.


Conforms To
View // *

👉 Button | Apple Developer Documentation hatena-bookmark

→ Button は View。

VStack
A view that arranges its subviews in a vertical line.


Conforms To
View // *

👉 VStack | Apple Developer Documentation hatena-bookmark

→ VStack は View。

Circle
A circle centered on the frame of the view containing it.


Conforms To
Animatable
ChartSymbolShape
InsettableShape
Sendable
Shape // *
View // *

👉 Circle | Apple Developer Documentation hatena-bookmark

→ Circle は Shape であり、View でもある。

RoundedRectangle
A rectangular shape with rounded corners, aligned inside the frame of the view containing it.


Conforms To
Animatable
InsettableShape
Sendable
Shape // *
View // *

👉 RoundedRectangle | Apple Developer Documentation hatena-bookmark

→ RoundRectangle は Shape であり、View でもある。

Material
A background material type.


Conforms To
Sendable
ShapeStyle // *

👉 Material | Apple Developer Documentation hatena-bookmark

→ Material は ShapeStyle である。

では、

Color
A representation of a color that adapts to a given context.


Conforms To
CustomStringConvertible
Equatable
Hashable
Sendable
ShapeStyle // *
Transferable
View // *

👉 Color | Apple Developer Documentation hatena-bookmark

→ Color は、 ShapeStyle であり、View でもある !

 

🎨 まとめ

Color は、

Material のような塗りつぶし方法の「ShapeStyle」であり、

Text のような表示の具の 「View」 でもある。

だったのだ !

👉 The many faces of ShapeStyle in SwiftUI | Swift with Majid hatena-bookmark
👉 Every SwiftUI protocol explained | FIVE STARS hatena-bookmark


関連ワード:  iOS・iPhone・mac・macOS・Swift・SwiftUI・今さら聞けない・初心者・開発