#3 – Zaokrąglone rogi przycisków – SWIFT

W poprzedniej części dodawaliśmy przyciski do ekranu powitalne, jak można było zauważyć miały one prostokątne lub kwadratowe obramowanie. A co w sytuacji jeżeli chcielibyśmy wprowadzić ładne zaokrąglenia? Otóż w ustawieniach opcji jakie znajdziemy po prawej stronie nie było nigdzie możliwości ustawienia zaokrąglenia, dlatego musimy zrobić to programowo, a sposób wydaje się dosyć prosty.

W tym celu ustawiamy podział ekranu (dwa kółka w prawym górnym rogu) tak abyśmy widzieli zarówno widok jak i kontroler tego widoku.

Następnie przeciągamy przycisk do naszego kodu i nadajemy mu odpowiednią nazwę.

Teraz mamy w kontrolerze zmienną o nazwie „przycisk„, która jest powiązana z naszym przyciskiem w widoku. Dzięki temu możemy podpinać różne zdarzenia np. kliknięcie, a także ustawiać wszelkie opcje bezpośrednio z kodu programu, lub dynamicznie je zmieniać. My póki co zajmiemy się tylko obramowaniem i zaokrągleniem. Do tego celu użyjemy 3 poniższe linijki kodu:

przycisk.layer.borderColor = UIColor.blueColor().CGColor // kolor przycisku
przycisk.layer.borderWidth = 1 // grubość obramowania
przycisk.layer.cornerRadius = 5 // stopień zaokrąglenia rogów

Ich działanie jak sami widzicie jest bardzo proste, a jednocześnie mogą uatrakcyjnić wygląd naszych zwykłych prostokątnych przycisków. Wprowadzamy takie zmiany dla wszystkich przycisków menu, zapisujemy projekt i sprawdzamy czy wszystko wyświetla się poprawnie w emulatorze.

Na potrzeby projektu, całość spakowałem do jednej funkcji aby można było łatwiej i szybciej używać zaokrąglenia dla innych przycisków.

func roundedBtn(btn: UIButton, width: CGFloat, radius: CGFloat) {
        btn.layer.borderColor = UIColor.blueColor().CGColor
        btn.layer.borderWidth = width
        btn.layer.cornerRadius = radius
    }

Jeżeli wszystko jest ok wysyłamy zmiany do naszego repozytorium.

Dodaj komentarz