iOS

[Swift3] ナビゲーションバーとステータスバーの色変更

投稿日:2017年10月6日 更新日:

はじめに

どうも、はじめです。

今回はナビゲーションバー、ナビゲーションアイテム、ナビゲーションタイトル、
ステータスバーの色変更を行いたいと思います。

完成形は以下になります。

 

前提条件

・Swift 3.1
・Xcode 8.3.3

 

事前準備としてストーリーボードを以下のようにしておきます。

では早速。

 

ナビゲーションアイテムの色変更

・アプリ全体への反映

・ページ単位での変更

 

 

ナビゲーションバーの色変更

・アプリ全体への反映

 

・ページ単位での変更

 

 

ナビゲーションタイトルの色変更

・アプリ全体への反映

 

・ページ単位での変更

 

 

ステータスバーの色変更

ステータスバーの色変更はInfo.plistで行います。
1. Targets [プロジェクト名] -> info -> Custom iOS Target Properties
のKey列で+ボタンを押して[View controller-based status bar appearance]と入力し追加
2. Valueを[No]に変更
3. 1と同じ場所で[Status bar style]を追加
4. Valueを[Opaque black style]に変更

上記手順でステータスバーを白色に変更することが可能です。

変更完了後のイメージが以下になります。

 

さいごに

ステータスバーをページ単位で変更することは可能ではありますが、
かなり面倒な上にモーダルでの画面遷移等が発生した場合挙動が不安定だったりするそうです。
今後機会があれば書いてみたいと思います。

最後まで見て頂きありがとうございました。

blog-page_footer_336




blog-page_footer_336




-iOS
-

執筆者:

免責事項

このブログは、記事上部に記載のある投稿日時点の一般的な情報を提供するものであり、投資等の勧誘・法的・税務上の助言を提供するものではありません。仮想通貨の投資・損益計算は複雑であり、個々の取引状況や法律の変更によって異なる可能性があります。ブログに記載された情報は参考程度のものであり、特定の状況に基づいた行動の決定には専門家の助言を求めることをお勧めします。当ブログの情報に基づいた行動に関連して生じた損失やリスクについて、筆者は責任を負いかねます。最新の法律や税務情報を確認し、必要に応じて専門家に相談することをお勧めします。

関連記事

swift

[Swift3] SwitchとEnumを使ってSectionやCellを指定する

はじめに どうも、はじめです。 今回はSectionやCellの指定にSwitchとEnumを使ってみようと思います。 SwitchとEnumを使用するメリットとしてはEnumのすべてのCaseを網羅 ...

CollectionViewの並び替えを実装する

はじめに こんにちは。Yossyです。 前回まではCollectionViewのカスタムレイアウトを作成していました。 このCollectionViewのセルの並び替え処理を実装をしたので、備忘録つい ...

swift

[Swift]UIViewからUIImageを作成しローカルに保存

はじめに こんにちは、nukkyです。 今回は案件で画面の一部分を画像にして保存する対応を行ったので、備忘録がてら書いていきたいと思います。 前提条件 Xcode 9.1 iOS 11 Simulat ...

swift

SnapKItをつかってコードでも簡単にAutoLayout実装

はじめに こんにちは、nukkyです。 iOSの実装中にコードでもViewを追加したいことは 度々あるとは思いますがその際にAutoLayoutを コード側で実装するのは正直めんどくさいです。 そこで ...

【Swift】QuickActionで普段と異なる初期画面を表示する。

はじめに こんにちはsuzukiです。今回はQuickActionを利用した、ユーザーの導線の追加方法についてまとめます。 ユーザーに特定の画面や処理への導線を追加するのに便利だと思いいます。 Qui ...

フォロー

blog-page_side_responsive

2017年10月
日 月 火 水 木 金 土
1234567
891011121314
15161718192021
22232425262728
293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。