未分類

systemImageを使ってボタンをカスタマイズする

投稿日:

標準で用意されているsystemImageを使って、以下のような追加ボタンを作る。

StoryBoardでImageに「plus」を設定して、テキストは消す。

systemImageのサイズ、色はコードで設定する。

以下の3行で、ボタンいっぱいに画像を表示させることができる。

button.imageView?.contentMode = .scaleAspectFit
button.contentHorizontalAlignment = .fill
button.contentVerticalAlignment = .fill

大きすぎる場合は、.imageEdgeInsetsでマージンを調整できる。

button.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10);

すべてのコード

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var button: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        //角丸
        button.layer.cornerRadius = 20
        
        //画像の色
        button.imageView?.tintColor = .white
        
        //ボタンいっぱいに画像を表示する
        button.imageView?.contentMode = .scaleAspectFit
        button.contentHorizontalAlignment = .fill
        button.contentVerticalAlignment = .fill
        
        //画像にマージンを追加する
        button.imageEdgeInsets = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10);

    }
}

完成

参考:【swift・iOS】UIボタン(Button)の装飾の仕方。ボーダー・角丸・背景色など【Xcode】

-未分類

執筆者:

関連記事

no image

マーケティングの基本「3NOTの壁」への対策

基本的なマーケティングの考え方。 動画制作でも文章でも同じ。 3NOTの壁 視聴者は「見ない・信じない・行動しない」のが前提と考える。 そのための対策は、以下のようなものがある。 見ないへの対策 ・冒 …

no image

Realmの保存できるプロパティ

realmでは保存できる型が決まっている。 対象外のUIColor型で保存しようとしたら以下のエラーが出た。 ‘Property Color.color is declared as Op …

no image

テロップ文字位置を一括で変更する方法

字幕の位置を全てのクリップで上方向に移動させたい時など。   ①任意の字幕クリップにて、エフェクトコントロールのモーションで文字位置を修正 ②モーションを右クリックでコピー ③位置を変更した …

動画制作の基本的な知識

フレームレートとは 1秒間に何コマあるか。 多いと滑らかに動く、少ないとカクカク動く。 基本的に29.97選べばOK。(ほとんどのデバイスはこれで撮影されるから) ちなみに映画やアニメは24で作られて …

レガシータイトルで綺麗な角丸四角形を作る方法

レガシータイトルで綺麗な角丸四角形を作りたい。 角丸長方形(可変)ツールで作ると角が歪む 角丸長方形を作成し、右の「フィレットサイズ」で角を調整できる。 ただし、角が歪んでしまう。(画像の下の長方形の …