未分類

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

CGColorをRGBで指定する方法

uiViewの色指定はUIColorでなく、CGColorになってる。 CGColorをUIColorと同じやり方でRGB指定するとエラーが出る。 一度定数化してから、入れたら解決した。 let cu …

no image

collectionViewCellにラベルを設置する2つの方法

collectionViewCellの中にLabelを配置したい。 1. StoryBoardで設置する方法 新たなファイルを作らず簡単に設置できる。 cell内にLabel配置→Tagを1にする→コ …

no image

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

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

no image

APIとは

APIとは、自分がソフトウェアの一部を公開して、他のソフトウェアと機能を共有できるようにしたもの。 こんなイメージ: 企業<うちのサイトの機能の一部を使ってもいいよ。機能を取得するための仕様書を用意し …

no image

AVPlayer()で動画を使う方法

AVPlayer()で動画を扱える。 1.AVFoundationをインポートする。 import AVFoundation 2.コードを書く //インスタンス生成 var player = AVPl …