KotlinとSwiftでアナログ時計を作るーー見た目の時計文字盤
こんにちは。川上です。
KotlinでAndroidアプリ作成で、最初にお調べさせていたのは
「ConstraintLayoutのCircular positioningでアナログ時計を作った」
です。
このサンプルアプリのカタチ似をみながら、KotlinとSwiftでアナログ時計アプリを作ってみました。
動作見た目は、おんなじ様に見えたけど、SwiftとKotlinの中身はあんまりちゃいますw。
Swiftでの文字盤位置は、サイン、コサインをシラーと使っています。（ミー的には凄い！！）
// MARK: ⚡️--ライフサイクル：レイアウト処理終了メソッド
override func viewDidLayoutSubviews() {
// MARK:+++++ Clock Base Setting
makeClockBaseSetting()
}
// MARK:+++++ Clock Base Setting
func makeClockBaseSetting() {
//既存の子Viewの削除
self.view.removeAllSubviews()
let selfsize = self.view.frame.size
let bsWorH = (selfsize.width > selfsize.height ? selfsize.height : selfsize.width ) - 20
・・・
// MARK: -- 時計盤の数文字表示
drawClockBoardMoji( bsWorH / 2 - 20)
・・・
}
// MARK: -- 時計盤の数文字表示
func drawClockBoardMoji(_ hankei:CGFloat) {
let lblwh :Int = 20
let bs_center = self.view.center
for tm in 1...12 {
// MARK:Status用Label
let lbl: UILabel = UILabel(frame: TotnCGRect.CGRectMake(0,0,CGFloat(lblwh),CGFloat(lblwh)))
//＝＝＝ ※ SwiftとAndroidでは、度数角度設定が90度違うみたい！？
let θ = Double.pi / Double(180) * Double(getKakuDo(tm) - 90 )
let x = Double(hankei) * cos(θ)
let y = Double(hankei) * sin(θ)
let lbl_x:CGFloat = bs_center.x + CGFloat(x)
let lbl_y:CGFloat = bs_center.y + CGFloat(y)
// MARK: ==== Status用Label ==
lbl.text = tm.description
lbl.textColor = UIColor.blue
lbl.textAlignment = NSTextAlignment.center
lbl.center = CGPoint(x: lbl_x, y: lbl_y )
self.view.addSubview(lbl)
}
}
// MARK: --- 数文字（1-12）位置用の角度の取得
func getKakuDo(_ idx:Int) -> CGFloat{
let CIRCLE_RADIUS = 360
let angleUnit : CGFloat = CGFloat(CIRCLE_RADIUS / 12)
return CGFloat(idx) * angleUnit
}ちなみに、
//既存の子Viewの削除 self.view.removeAllSubviews()
を外すと、縦横置きの動作で文字表示がダブります。
iPhone用の動画はココです。
Kotli向けの時計盤文字には、コチラでした。
Kotlinの時計針の回転処理に詰まりました。
ー そのうち・・・でけへんかなぁ・・
ので、SwiftのNonClockに背びれ腹ビレに蛇足しとこかなぁ。。です。
ではでは。