【SwiftUI】

SF Symbols list を確認する方法

SF Symbols appのダウンロード方法

投稿日 2021/01/14 更新日 2021/09/26


こんにちは。当サイトの管理者「元木皇天」です。

iOSアプリ開発を行うにあたって標準で用意されているSF Symbolsというアイコン画像があります。

しかし、いざアプリ作成時にSF Symbolsを使用しようと思った時に「アイコン画像の一覧ってどこにあるんだろう・・・。」と 私はつまづきました。今回は、そのような人の助けになればいいなと思い本記事を作成しましたので、よかったら見ていってください。

環境
OS:MacOS

参考文献:SwiftUIではじめるiPhoneアプリプログラミング入門

SF Symbolsとは

そもそも「SF Symbols」とは何か知らない方のために簡単に説明すると、iOS13以降に標準で用意されている画像のことです。

アプリ開発時にImageビューで自分で用意した画像の代わりに、SF Symbolsを使用することができます。

以下に例としてSF Symbolsで使用できる画像を表示します。

SF Symbolsの画像例

SF Symbolsの画像を使用するためには、その画像の名称のようなIDのようなものを知らないと使用できません (上記画像の「house」のようなもの)。

SF Symbolsで用意されている画像一覧を確認するにはSF Symbols というアプリを取得する必要があります。

今回は、このアプリをダウンロード・インストールする方法について解説していきたいと思います。

アプリのダウンロードの方法

SF Symbolsのアプリは、App Storeでは入手できません。 Apple社のデベロッパーサイトから入手できます。まずは下記リンクからデベロッパーサイトに飛んでください。

以下の画像のようなサイトが表示されればOKです。

Appleデベロッパーサイト Appleデベロッパーサイトの画像

デベロッパーサイトに移動したら、少しスクロールして以下の画像の箇所を探します。

そして、「Download SF Syybols」と表示されている箇所をクリックします。

SF Symbolsダウンロードサイトの画像

下の画像のように表示されればダウンロードは完了です。

SF Symbolsダウンロード完了の画像

続いてインストールを行います。

アプリのインストールの方法

先程ダウンロードしたdmgファイルを開きます。下の画像のようなウィンドウが開きますので、pkgファイルをクリックします。

SF Symbolsdmgファイル展開の画像

インストーラーが起動しますので画面の案内に従ってインストールを行います。

右下の「続ける」を押します。

SF Symbolsインストーラー起動の画像

使用許諾契約内容の画面が開きます。契約書の内容を読み終わったら右下の「続ける」を押します。

SF Symbols使用許諾契約の画像

使用許諾契約に同意するのであれば「同意する」を押します。

SF Symbols使用許諾契約同意の画像

インストール先は変える必要は基本ないので、そのまま右下の「インストール」を押します。

SF Symbolsインストール先設定の画像

インストールの許可を求められるので、ユーザ名を確認してPCのパスワードを入力します。

ソフトウェアインストールの許可画面

インストールが開始します。しばらく待ちます。

SF Symbolsインストール中の画像

以下のような画面が表示されたらインストールが完了です。

SF Symbolsインストール完了の画像

SF Symbolsの起動確認

無事にインストールが完了すればSF Symbols.appがアプリケーションフォルダとLaunchpadに追加されています。

SF Symbols.appを起動できるか確認しましょう。

Launchpadを開き「SF Symbol.app」をクリックします。

Launchpad起動画面

問題なく起動できれば、SF Symbols一覧を確認するとができます。

SF Symbols.app起動画像

まとめ

以下今回のまとめです。


・SF Symbolsの一覧はデベロッパーサイトのアプリをインストールして確認する。

・ダウンロードは こちらのサイトから行う。

・AppStoreからではSF Symbolsのアプリは入手できない

最後まで読んでいただきありがとうございました。

今後もSwift関連の記事をあげていこうと思いますのでよろしくお願いします。

ではまたお会いしましょう。バイバイ!

参考文献・おすすめ文献