UIButton.Configuration – novinka v iOS 15

V dnešnej časti sa pozrieme na novinku, ktorú Apple predstavil v novej iOS verzí iOS – UIBUTTON.Configuration

Tlačítko je jeden z najdôležitejších a najpoužívanejších UI elementov a to nielen v mobile sfére. Apple sa za tie roky viac krát adaptoval novým dizajnovým trendom. Od verzie iOS 7 to bol Flat dizajn, ktorý skratka bol jednoduchý a ľahko aplikovateľný.

Jednoduchosť ale nebola vždy ideálna, nakoľko natívne je možné použiť tri štýli tlačítka čo pri aplikovaní custom dizajnu môže spôsobiť komplikácie pri adaptáci vlastného dizajnu a väčšinou bolo nutné si zostaviť vlastné tlačítko naskladaním viacerých elementov ako UIView, UILabel a UIButton.

Novinka v iOS ale pridala viac customizable riešenie a to pridaním Configuration struct na pokročilejšiu úpravu style parametrov tlačítka, ktorá je dostupná už priamo v storyboarde a ponuka 4 rôzne štýli – plain, tinted, gray a filled.

Novinka Style v Storyboard

Pokročilejšie úpravy a nastavenia

Úpravy začínajú modifikáciou UIButton.Configuration a v jednoduchých 3 krokoch je možné zmeniť celý štýl.

  1. Inicializácia Configuration štruktúry
  2. Modifikácia atribútov štuktúry
  3. Inicializácia tlačítka spolu s konfiguráciou, alebo priradenie vytvorenej konfigurácie do existujúceho tlačítka

Napríklad potrebujeme fialové tlačítko, oblých tvarov s bielým písmom

func setupCustomButtons() {
    // 1
    var configuration = UIButton.Configuration.filled()

    // 2
    configuration.baseBackgroundColor = .purple
    configuration.baseForegroundColor = .white
    configuration.cornerStyle = .capsule
    configuration.buttonSize = .small
    configuration.title = "Purple Capsule Button"

    // 3
    let button1 = UIButton(configuration: configuration, primaryAction: nil)

    buttonStackView.addArrangedSubview(button1)
}

Výsledne tlačítko bude vyzerať takto:

Demonštrácia fialového tlačítka vytvoreného cez Configuration

Jednoduché.

Share

Mohlo by sa Vám tiež páčiť...

Pridaj komentár

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *