[iPhone] cornerRadiusを使って画像を角丸にする

画像の角を丸くしたアイコンなど、角を処理してレイアウトをまとめたい時にCALayerのcornerRadius, clipsToBoundsを使うと簡単にでき、円形に切り取ったようにすることもできます。
 

Swift 5.1
Xcode 11.3.1

 

cornerRadius

 
画像UIImageViewをSwiftコードで設定するにあるように以下の画像をスクリーンに表示させます。
 

 
画像をスクリーンの90%に合うようにリサイズを入れます。
 
この画像の角を丸くするためにCALayerのcornerRadiusを画像frame幅の10%に設定します。
 

 
これをまとめたコードにするとこのようになります
 
ViewController.swift

 
画像を選んで Assets.xcassets に入れます。

これで実行すると角が丸くなりました。
 

 
この角を更に丸くして50%にして見ます。
 

 

 
元の画像をcropなどを使って正方形にすると
 

 

 
円形で切り取ったような処理になりました。
 
 
関連ページ:

References:
cornerRadius – CALayer | Apple Developer Documentation
clipsToBounds – UIView | Apple Developer Documentation
UIImageView – UIKit | Apple Developer Documentation
UIImage – UIKit | Apple Developer Documentation

一人でアプリ開発の限界を感じたら

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンライン・スクールがいいと思います。



TECH ACADEMY
iPhoneアプリコース


こういうものではアプリ作れないと言う意見もありますが、それは結局本人のやる気があるかないかです。やる気があっても独学では突破しにくいところは教えてもらうのが一番早い。



CodeCamp

直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。



侍エンジニア塾
侍エンジニア塾 無料体験レッスン




誤字脱字、意味不明などのご意見は 謙: e-mail まで
ブックマークしておくと便利です このエントリーをはてなブックマークに追加
Twitter:


シェアする

  • このエントリーをはてなブックマークに追加

フォローする