iOS

iOSアプリのチュートリアルに便利なMMPopLabel

投稿日:

はじめに

こんにちは、nukkyです。
今回はチュートリアル等、ユーザーへの
画面説明に便利なMMPopLabelを紹介したいと思います

このライブラリはObjective-Cで書かれていますが、
この記事ではSwift3での使いかたを書いていきます

準備

インストールにはCocoaPodsを使用しますのでPodfileに以下を記載してください

そうしたらターミナルから以下のコマンドを実行してください。

それと、MMPopLabelはObjective-Cで書かれているので
Bridging-Header.hに以下のimport文を記載してください

実装

Storyboard

MMPopLabelの表示がわかりやすいように今回は図のようなViewを作成しました

3つボタンを用意しているのでIBOutletで接続します

MMPopLabelの準備

まずはMMPopLabelをimportしてください
準備の項目でも記載しましたがMMPopLabelは
Objective-Cで書かれているのでBridging-Header.hに
importされていないとエラーになります

ViewControllerにDelegateを設定しMMPopLabelを用意します

MMPopLabelの外観を設定します

MMPopLabelをNewしDelegateを設定します

ポップアップ内のボタンを設定します
今回はskipとokの二つのボタンをaddします

最後にMMPopLabelをaddSubviewします

MMPopLabelの表示

MMPopLabelは以下のメソッドで画面に表示されます
まずはhelpButtonに対して表示させてみたいと思います

そうすると、このように表示されます

この際、表示位置はMMPopLabelが自動で判断してくれます
ですので、他のボタンにpopさせるとこのようになります

基本的にポップアップ内のボタンを押下すれば表示は消えるのですが
コードで任意にポップアップを消したいときは以下です

 

Delegate

MMPopLabelはDelegateでポップアップ内のボタン押下と
ポップアップがdismissした時が取得できます

 

さいごに

MMPopLabel如何だったでしょうか、
個人的には表示位置やポップアップ自体のサイズ感を
気にせずすむ上に、簡単に表示まで持っていけるので
人気があるのも頷けますね、ただswiftでの使い方があまり紹介されていないので
こちらの記事が誰かのお役に立てば幸いです

page_footer_300rect




page_footer_300rect




-iOS
-

執筆者:


comment

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

CAPTCHA


関連記事

swift

[Swift3] コードで動的にオートレイアウトを変更する

1 はじめに1.1 前提条件2 事前準備3 1.NSLayoutConstraintのActiveを切り替える4 2.NSLayoutConstraintのActiveを切り替える(複数同時)5 3. ...

swift

iOSでライブラリFSCalendarをつかって簡単にカレンダー表示

1 はじめに2 準備3 実装3.1 Storyboard3.2 コード3.3 タップの取得4 さいごに はじめに こんにちは、nukkkyです。 ツール系アプリ開発時にカレンダー表示を よく使うと思い ...

iOS13ダークモード対応

1 はじめに2 一時しのぎ3 実装3.1 UI Element Colors3.2 Color Set3.3 コードで描きたい3.4 カスタムのカラーを定義する3.5 画像をモードで動的に変更したい4 ...

swift

Swift3で動的にUIViewを切り替える Part2

1 はじめに1.1 前提条件2 完成イメージ3 StoryBoardの準備3.1 Viewの配置3.1.1 ① Segmentを配置するView3.1.2 ② ContainerViewを表示するVi ...

swift

Swift3でRealmを使ってみる

1 はじめに1.1 前提条件2 事前準備2.1 Realmのインストール・設定2.1.1 Carthageファイルの生成2.1.2 CarhageにてRealmをインストール2.1.3 Realmをイ ...

フォロー

follow us in feedly

page_side_300rect

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

アプリ情報

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