[ios] 배경에 Gradient 적용하기 (CAGradientLayer)
첨부 '6' |
|
---|
Gradient backgrounds started becoming popular around the time of iOS 7 (2013). With just a little code, adding a gradient background can uplift a dull looking user interface (UI).
There are many ways to create background gradients, below is just one simple approach:
In a new Xcode iOS project, open Main.storyboard, from the Object Library drag a new View onto the View Controller. Set the View’s top, bottom, left and right constraints to be zero and ensure ‘Constrain to margins’ is deselected.
Add an IBOutlet to ViewController.swift with the name backgroundGradientView and connect it to the newly added View.
Below super.viewDidLoad(), create a gradient layer and apply it to your View.
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var backgroundGradientView: UIView!
override func viewDidLoad() {
super.viewDidLoad()
// Create a gradient layer.
let gradientLayer = CAGradientLayer()
// Set the size of the layer to be equal to size of the display.
gradientLayer.frame = view.bounds
// Set an array of Core Graphics colors (.cgColor) to create the gradient.
// This example uses a Color Literal and a UIColor from RGB values.
gradientLayer.colors = [#colorLiteral(red: 0, green: 0.5725490196, blue: 0.2705882353, alpha: 1).cgColor, UIColor(red: 252/255, green: 238/255, blue: 33/255, alpha: 1).cgColor]
// Rasterize this static layer to improve app performance.
gradientLayer.shouldRasterize = true
// Apply the gradient to the backgroundGradientView.
backgroundGradientView.layer.addSublayer(gradientLayer)
}
override var shouldAutorotate: Bool {
return false
}
}
By default the gradient is rendered vertically from top to bottom, you can further customise the gradient by setting gradient start and end positions.
// Diagonal: top left to bottom corner. gradientLayer.startPoint = CGPoint(x: 0, y: 0) // Top left corner. gradientLayer.endPoint = CGPoint(x: 1, y: 1) // Bottom right corner. // Horizontal: left to right. gradientLayer.startPoint = CGPoint(x: 0, y: 0.5) // Left side. gradientLayer.endPoint = CGPoint(x: 1, y: 0.5) // Right side.
Finding colours that blend well together can be a little hit and miss, thankfully uiGradients and iOS 7 Colors have a nice collection of gradient swatches.
[출처] https://techion.com.au/blog/2018/11/14/creating-gradient-backgrounds-in-swift
번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 수 |
---|---|---|---|---|---|
62 | Etc |
원어민이 매일 쓰는 일상표현 150개
![]() |
hooni | 2023.09.17 | 5045 |
61 | Etc |
영어. 반드시 외워야 할 문장 패턴 100개
![]() |
hooni | 2023.06.08 | 4823 |
60 | Etc |
RSVP 란?
![]() |
hooni | 2017.11.22 | 3455 |
59 | Etc | How to completely Uninstall Coda | hooni | 2017.10.24 | 5426 |
58 | Etc |
영어. 불규칙 동사 정리
![]() |
hooni | 2017.10.04 | 5764 |
57 | Etc |
캘리포니아 운전면허 문제
![]() |
hooni | 2017.07.22 | 3638 |
56 | Etc |
IT감사 기법 시험
![]() |
hooni | 2017.06.14 | 3881 |
55 | Etc |
사이버보안실무 시험.
![]() |
hooni | 2017.04.20 | 0 |
54 | Etc | 사이버보안실무 수업 메모 | hooni | 2017.03.30 | 3105 |
53 | Etc |
종합시험 관련 자료
![]() |
hooni | 2017.03.15 | 0 |
52 | Etc |
모바일 프로그래머가 갖추어야 할 필수 역량
![]() |
hooni | 2017.02.16 | 6605 |
51 | Etc |
ISMS 인증기준 – 정보보호대책 (시스템개발보안)
![]() |
hooni | 2016.12.01 | 3797 |