iOS

[Swift3] Segmentを使った画面切り替え (Extra View)

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

はじめに

こんにちははじめです。
Segmentを使って画面の切り替えを行うにはいくつか方法はあると思いますが、
今回は[Extra Views]というものを使用して画面の切り替えを行いたいと思います。

 

前提条件

Swift 3.1

 

Segmentの用意

StoryboradにSegmentを追加し、

Segmentがタップされた時の処理を用意しておきます。

 

 

表示したいViewを用意

storyboardにUIViewを追加し、「First」をタップされた時に表示したい画面を作成します。

今回はタップされたセグメントがわかるように背景色とTextLabelを追加し「First」と表示しておきます。

 

Extra Viewsに追加

先ほど作成したViewをstoryboardの上部にある「First Responder」と「Exit」の間に

ドラックアンドドロップします。

※controlやoption、command等を押す必要はありません。

 

以上で先ほど作成したViewが「Extra Views」に追加されました。

同じ要領で「Second」をタップされた時に表示したいViewも「Extra Views」に追加します。

 

追加後は下の画像のようになります。

 

Segmentでの切り替え

デフォルトで表示されるViewを設定

「Extra Views」に追加されているものはaddSubViewするまで画面上に表示されないため、

ロード時に「First」のViewを表示するように追記しておきます。

 

※addSubViewをした際画面に表示されたViewがSegmentと重なってしまうので、

Segmentの下に表示されるようにframeを設定する必要があります。

 

Segmentがタップされた時に実行されるメソッドを作成

「First」がタップされた時は

「Second」をSuperViewから削除し、「First」をSuperViewに追加。

「Second」がタップされた時は

「First」をSuperViewから削除し、「Second」をSuperViewに追加するメソッド

を用意しておきます。

 

Segmentがタップされた時にメソッドが実行されるように追記

Segmentがタップされた時に先ほど作成したメソッドを実行するように

追記をします。

 

以上で完成になります。

 

完成後のソースは以下のようになります。

 

さいごに

最近見た目やautolayoutに頭を悩まされることが増えてきた気がします。

まだまだ勉強不足なので、今後とも理解を深めていこうと思います。

 

この記事が少しでも何かの参考になれば幸いです。

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

 

page_footer_300rect




page_footer_300rect




-iOS
-

執筆者:


comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

swift

[Swift]UITableViewのセルの入れ替えが簡単に実装できるライブラリ「SwiftReorder」

1 はじめに2 準備3 実装4 さいごに はじめに こんにちは、nukkyです。 今回は、UITableViewでセルを入れ替えたい際に、ドラッグ&ドロップ操作を簡単に実装できるライブラリ「S ...

iOS Chartsライブラリを使い移動平均線を描画してみる。

1 はじめに2 Chartsライブラリについて2.1 ライブラリの導入2.2 描画の準備3 折れ線グラフを描画する3.1 LineChartViewの設定3.2 LineChart用のデータ作成3.3 ...

[Swift]プロトコルの拡張で既定値を設定する。

1 はじめに2 プロトコルの拡張について2.1 プロトコルに既定値を設定2.2 プロトコルを設定したクラスの作成2.3 制約をつけてプロトコルに既定値を設定3 さいごに4 おすすめ書籍 はじめに こん ...

Sign in with Appleの実装

1 はじめに2 Sign in with Appleとは2.1 iOS レビューガイドライン2.2 つまり3 準備4 実装5 デザイン6 さいごに7 おすすめ書籍 はじめに こんにちは、nukkyです ...

swift

[Swift4]UITextViewにプレースホルダをつける

1 はじめに1.1 前提条件2 実装3 さいごに はじめに こんにちは、nukkyです。 UITextFieldにはプレースホルダが標準で用意されていますが、UITextViewには用意されていません ...

フォロー

follow us in feedly

page_side_300rect

2017年6月
« 5月 7月 »
 123
45678910
11121314151617
18192021222324
252627282930 

アプリ情報

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