투케이2K

270. (ios/swift) CAGradientLayer 사용해 button 버튼에 그라데이션 백그라운드 배경 색상 설정 본문

IOS

270. (ios/swift) CAGradientLayer 사용해 button 버튼에 그라데이션 백그라운드 배경 색상 설정

투케이2K 2022. 11. 11. 13:18

[개발 환경 설정]

개발 툴 : XCODE

개발 언어 : SWIFT

 

[소스 코드]

    // MARK: - [테스트 함수 정의]
    func testMain() {
        print("")
        print("===============================")
        print("[ViewController >> testMain() :: 테스트 함수 수행]")
        print("===============================")
        print("")
        
        
        // [로직 처리 수행]
        DispatchQueue.main.async {
            
            // [현재 연결된 뷰 화면 얻어오기 : IOS 15 대응]
            let scenes = UIApplication.shared.connectedScenes
            let windowScene = scenes.first as? UIWindowScene
            let window = windowScene?.windows.first
            
            
            // [뷰 화면 사이즈 확인 실시]
            let deviceHeight = self.view.frame.size.height
            let deviceWidth = self.view.frame.size.width
            
            
            // [디바이스 휴대폰 상태 바 높이 사이즈 확인 실시]
            var statusBarHeight: CGFloat = 0
            var statusBarWidth: CGFloat = 0
            
            if #available(iOS 13.0, *) {
                statusBarHeight = window?.windowScene?.statusBarManager?.statusBarFrame.height ?? 0
                statusBarWidth = window?.windowScene?.statusBarManager?.statusBarFrame.width ?? 0
            }
            else {
                statusBarHeight = UIApplication.shared.statusBarFrame.height
                statusBarWidth = UIApplication.shared.statusBarFrame.width
            }


            // [컴포넌트가 생성될 값 지정 실시]
            let componentsHeight = 100.0; // [width 크기]
            let componentsWidth = 200.0; // [height 크기]
            let componentsX = (deviceWidth - componentsWidth) / 2; // [width 가운데 중앙]
            let componentsY = (deviceHeight - statusBarHeight - componentsHeight) / 2; // [height 가운데 중앙]
            
            
            // [CGRect 사용해 컴포넌트가 생성 될 사이즈 및 위치 설정 실시]
            let cgRect = CGRect.init(
                        x:componentsX, // [x]
                        y:componentsY, // [y]
                        width:componentsWidth, // [width]
                        height:componentsHeight // [height]
                    )
            
            
            // [버튼 생성 실시]
            let button = UIButton(frame: cgRect) // button 생성 및 초기화
            button.setTitle("2k_Button", for: .normal) // 타이틀 지정
            button.setTitleColor(UIColor.white, for: .normal) // 타이틀 색상
            //button.backgroundColor = UIColor.blue // 단색 배경 색상
            
            
            // [배경 색상 그라데이션 적용 실시]
            //let colors = [UIColor.red.cgColor, UIColor.green.cgColor] // 그라데이션 적용할 색상 [2색]
            let colors = [UIColor.lightGray.cgColor, UIColor.black.cgColor, UIColor.lightGray.cgColor] // 그라데이션 적용할 색상 [3색]
            let gradientLayer = CAGradientLayer()
            gradientLayer.colors = colors // 색상 설정
            
            //gradientLayer.transform = CATransform3DMakeRotation(270 / 180 * CGFloat.pi, 0, 0, 1) // 그라데이션 표시 설정 (가로 = 2색 기준)
            //gradientLayer.locations = [0.0, 0.5] // 각각 색상이 표시될 공간 [2색 기준]
            
            gradientLayer.transform = CATransform3DMakeRotation(270 / 180 * CGFloat.pi, 0, 0, 1) // 그라데이션 표시 설정 (가로 = 3색 기준)
            gradientLayer.locations = [0.0, 0.3, 0.7] // 각각 색상이 표시될 공간 [3색 기준]
            
            gradientLayer.frame = button.bounds // 그라데이션 전체 표시 크기
            button.layer.insertSublayer(gradientLayer, at: 0) // 그라데이션 추가

            
            // [뷰에 추가 실시]
            self.view.addSubview(button)


        }
        
    }
 

[결과 출력]


 

반응형
Comments