iOS 앱에서 HUD(HeadUp-Display)를 자작하기 위한 라이브러리를 만들어 보았다
iOS 앱에서 HUD(HeadUp-Display)를 자작하기 위한 라이브러리를 만들어 보았다
안녕하세요, natmark 입니다.
이번, HUDMakerKit 라고 하는 HUD를 자작하기 위한 라이브러리를 만들어 보았으므로, 그쪽을 소개합니다.
HUD(HeadUp-Display)란?
자주 보는 화면에 팝업하여 인디게이터 등을 표시하는 사람입니다. iOS에서이 HUD를 구현하고 싶을 때 다음과 같은 라이브러리가 자주 사용됩니다.
단순히 빙글빙글을 표시하는 것만으로는, 위와 같은 라이브러리를 사용하는 것으로 간단하게 실현할 수 있습니다만, 굳은 애니메이션 첨부의 HUD를 만들려고 하면(자), 자작할 필요가 나옵니다.
거기서, 굳은 애니메이션 첨부 HUD의 구현을 돕는 라이브러리로서, 애니메이션의 묘화를 심플한 묘화 함수로 실시할 수 있는 ProcessingKit 를 이용해 작성해 보았습니다.
만든 것
HUDMakerKit : htps : // 기주 b. 코 m / 나 t 마 rk / 후 D 마케 r t
ProcessingKit 을 이용하여 간단한 드로잉 함수로 애니메이션 가능한 HUD를 구현할 수 있습니다.
ProcessingKit에 대한 설명은 여기
샘플
예를 들어, 위와 같은 움직임을 하는 HUD를 만들고 싶은 경우, 아래와 같은 코드를 쓰는 것으로 구현 가능합니다.
익숙하지 않은 함수가 포함되어 있지만
clear()
, translate()
, point()
등이 ProcessingKit
ProcessingKit에서는 처리 이라는 프로그래밍 언어의 드로잉 함수를 같은 인터페이스로 제공하고 있으므로, 이러한 간단한 구문으로 드로잉이나 도형 변환을 실시할 수 있습니다.
소개
Carthage
혹은 CocoaPods
를 사용해 도입할 수가 있습니다.Carthage를 이용하는 경우
Cartfile
github "natmark/HUDMakerKit" ~> 0.2.4
$ carthage update --platform iOS --no-use-binaries
참고 : htps : // 코 m / 유타 t93 / ms / 97 9bc2bf2 97 7 e c1
CocoaPods를 이용하는 경우
$ pod init
Podfile
# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'
target 'HUDMakerKitExample' do
# Comment the next line if you're not using Swift and don't want to use dynamic frameworks
use_frameworks!
# Pods for PKPodsExample
pod "HUDMakerKit","~>0.2.4"
end
구현
HUDMaker
를 상속받은 사용자 정의 클래스 만들기 SimpleHUD
import HUDMakerKit
class SampleHUD: HUDMaker {
func draw(frameCount: Int) {
// HUDが表示されている間、毎フレーム呼ばれる関数
}
}
func draw(frameCount:Int)
함수 안에 드로잉 처리를 작성합니다.SampleHUD
class SampleHUD: HUDMaker {
func draw(frameCount: Int) {
// MARK: Examples
fill(255, 0, 0) // 赤色で塗りつぶす
ellipse(50, 50, 100, 100) // x:50, y50を中心に、幅100、高さ100の円を描く
}
}
HUDRunner
customHUD
속성에 만든 사용자 지정 HUD 클래스를 설정하고 표시 ViewController.swift
import UIKit
import HUDMakerKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let customHUD = SampleHUD(frame: CGRect(x: 0, y: 0, width: 150, height: 150)) // カスタムHUDクラスのインスタンスを作る
customHUD.backgroundColor = UIColor(red: 0.1, green: 0.1, blue: 0.1, alpha: 0.3) // HUDの背景色を設定したり
customHUD.layer.cornerRadius = 10 // 角丸にしたり
HUDRunner.shared.customHUD = customHUD // HUDRunnerのcustomHUDにカスタムHUDクラスのインスタンスを設定する
}
@IBAction func didTapShowButton(_ sender: Any) {
HUDRunner.shared.show() // HUDを表示する
}
}
샘플 정보
Reference
이 문제에 관하여(iOS 앱에서 HUD(HeadUp-Display)를 자작하기 위한 라이브러리를 만들어 보았다), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/natmark/items/186419f28a0be719a6f0텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)