#08 Segmented Control，Slider，Switch，Activity Indicator View，Progress View，Page Control，Date Picker，Visual Effect View with Blur，Color Well(hw#2–1)
研究以下 UI 元件:
1. ☑ Segmented Control，
2. ☑ Slider，
3. ☑ Switch，
4. ☑ Activity Indicator View，
5. ☑ Progress View，
6. ☑ Page Control，
7. ☑ Date Picker，
8. ☑ Visual Effect View with Blur，
9. ☑ Color Well
1. Segmented Control
Segmented Control 日曆UI
不實用的設計，純粹亂玩 Content Offset 及 frame 的設定。日曆畫面全部由 Segmented Control 組成。
參考：
1. 研究 UI 元件: Segmented Control
2. human-interface-guidelines ：Segmented controls
3. A better segmented control
4. Spring-Loaded : 內容可以用拖拽的方式
5. SDK：UIKit — UISegmentedControl
筆記：
Momentary
State：Momentary (var isMomentary: Bool) 決定會不會有滑塊效果
該屬性的預設值為 false。 如果設定為 true，則控制項中的段不會顯示選定狀態，並且在追蹤結束後不會更新 selectedSegmentIndex 的值。
修正元件的高度
User Defined Runtime Attributes
frame / Rect / {{X,Ｙ}, {Width,Height}}
springLoaded
一個布林值，指示是否為控制啟用彈簧加載(spring loading)。
如果為控制項啟用了彈簧加載，則此屬性的值為 YES，否則為 NO。 預設為“否”。
在壓力敏感系統（例如具有Force Touch 觸控板的系統）上，彈簧加載是一項功能，允許用戶透過將所選項目拖曳到分段控制並用力點擊（用力按壓）來啟動分段控件中的分段，而無需放下所選項目。
然後，使用者可以繼續拖曳項目，可能會執行其他操作。 此功能的實際範例可以在日曆應用程式中找到。 可以將選定的日曆事件拖曳到工具列中的日、週、月或年部分。 用力點選某個段落可切換日曆視圖，而無需釋放選取的日曆事件。 然後可以將日曆事件拖曳到新日曆檢視中的所需位置。
當在分段控制項上啟用彈簧加載並且使用者在分段上拖曳某些內容時，該分段會被反白以指示它對強制單擊做出回應。 在這種情況下，如果使用者用力按壓，則會出現額外的突出顯示以指示該段落已啟動。 在不支援壓力敏感度的系統上，只需將滑鼠停留在該段上一小段時間就足以啟動該段。
2. Slider
- 設定數值：最大值、最小值和目前的值
2. 設定圖示：最大值及最小值圖示
3. 設定顏色：線條及圓點
4. 設定背景
5. SDK: UISlider
3. Switch
1 State：開or關
2 On Tint：前景色
3 Thumb Tint：圓點顏色
4 Background：背景色
5. SDK: UISwitch
4. Activity Indicator View
研究欄位
1. Style
2. Color
3. Animating
4. SDK: UIActivityIndicatorView
5. Progress View
跟 Slider 設定差不多
1. Style
2 Progress
3 Progress Tint
4 Track Tint
5 Progress Image
6 Track Image
7. SDK：UIProgressView
6. Page Control
顯示一系列水平點的控件，每個點對應於應用程式文件或其他資料模型實體中的一個頁面。
研究欄位
1. # of Pages：要出現幾個點
var numberOfPages: Int { get set }
此屬性的值是頁面控制項顯示為點的頁數。 預設值為 0。
2. Current：目前在第幾頁
var currentPage: Int { get set }
此屬性值是整數，指定目前顯示的頁面減一； 因此零值（預設值）表示第一頁。 頁面控制項將目前頁面顯示為白點。 超出可能範圍的值將固定為 0 或 numberOfPages — 1。
3. Hides for Single Page
var hidesForSinglePage: Bool { get set }
賦值true，當只有一頁時隱藏頁面控制項； 如果只有一頁，則指定 false（預設值）以顯示頁面控制項。
4. Tint Color：非目前頁，點的顏色
var pageIndicatorTintColor: UIColor? { get set }
頁面指示點的預設顏色是半透明白色。 頁面指示點用於所有在螢幕上不可見的頁面。 為此屬性指派新值不會自動變更 currentPageIndicatorTintColor 屬性中的顏色，因為這兩個屬性的值不會自動從另一個屬性衍生出來。 這兩個屬性必須單獨指定。 同樣，不會為您套用 alpha 到此屬性。 建議（但不要求）您為此參數指定的顏色包含一定程度的透明度，即 alpha 值應小於 1.0。
5. Current Page ：目前頁，點的顏色
var currentPageIndicatorTintColor: UIColor? { get set }
套用於目前頁面指示器的色調顏色。
目前頁面指示點的預設顏色是不透明的白色。 目前頁面指示點用於指示目前可見頁面。 為此屬性指派新值不會自動變更 pageIndicatorTintColor 屬性中的顏色，因為這兩個屬性的值不會自動從另一個屬性衍生出來。 這兩個屬性必須單獨指定。
6. SDK：UIPageControl
7. Date Picker
研究欄位
1 Preferred Style : Wheels 、Compact、Inline
2 Mode：時間(Time、Date、Date and Time)、倒數(Count Down Timer)
3 Locale：本地表示方式
4 Interval：最小調整單位
5 Date：預設顯示時間
6 Minimum Date：調整的最小時間
7 Maximum Date：調整的最大時間
8. Visual Effect View with Blur
對視覺效果視圖後面分層的內容套用模糊效果的物件。
API：UIBlurEffect
class UIBlurEffect : UIVisualEffect
新增至視覺效果視圖的 contentView 的視圖不受模糊效果的影響。
enum Style : Int, @unchecked Sendable
主題
附加款式
case extraLight：視圖的區域比底層視圖更亮。case light：視圖區域的亮度與底層視圖的亮度大致相同。case dark：視圖區域比底層視圖更暗。case extraDark：視圖區域甚至比底層視圖更暗。case regular：適應使用者介面風格的常規模糊風格。case prominent：一種模糊樣式，使內容更加突出，適應使用者介面風格。適應性強的風格
case systemUltraThinMaterial一種自適應模糊效果，可創造超薄材質的外觀。case systemThinMaterial：一種自適應模糊效果，可創造薄材質的外觀case systemMaterial：一種自適應模糊效果，可創造具有正常厚度的材質外觀。case systemThickMaterial：一種自適應模糊效果，可創造比正常情況更厚的材質外觀。case systemChromeMaterial：一種自適應模糊效果，可創造系統鑲邊的外觀。
燈光風格
case systemUltraThinMaterialLight：一種模糊效果，營造出超薄材料的外觀，並且始終輕盈。case systemThinMaterialLight：一種模糊效果，營造出薄材質的外觀，並且始終很輕。case systemMaterialLight：模糊效果，可創造具有正常厚度且始終較輕的材質外觀。case systemThickMaterialLight：一種模糊效果，可創造比正常材質更厚且始終較輕的材質外觀。case systemChromeMaterialLight：一種模糊效果，可創建系統鑲邊的外觀並且始終為淺色。
深色風格
case systemUltraThinMaterialDark：一種模糊效果，可產生超薄材料的外觀，並且始終是黑暗的。case systemThinMaterialDark：一種模糊效果，可產生薄材質的外觀，並且始終呈現黑色。case systemMaterialDark：模糊效果，可創造具有正常厚度且始終為黑色的材質外觀。case systemThickMaterialDark：一種模糊效果，可創造比正常情況更厚且始終呈現黑色的材質外觀。case systemChromeMaterialDark：一種模糊效果，可創建系統鑲邊的外觀並且始終為暗色。
9. Color Well
GitHub
參考：
