Amarengo

Articles and news

SwiftでiOS共有拡張機能を構築する方法

もともとJuly30th2016 24,887読み取りにScotty Fisterによって公開されました

注:Swift4用に更新されました。

仕事でハックの日のために私は共有拡張機能を作成することで私の手を試してみることにしました。 私はそこに完全な機能を備えたチュートリアルがなかったことを発見し、その結果、私は情報をまとめなければならなかった(その多くは驚くべきことに、

目標

私たちのアプリにリッチコンテンツとしてwebページのURLを保存し、いくつかのオプションの設定を可能にします。 最初は拡張アクションが必要だと思っていましたが、コンテンツを変更するのに適しているようです(ワンタップで写真の赤目を削除するなど)。 Appleを含む他の人が、代わりにアイテムを作成するためにshare拡張機能を使用しているようです。

これは私たちが最後までに構築したものです:

完成した拡張子

ご覧のように、デザインを少しカスタマイズし、シートの下部にあるセルである”構成項目”と呼ばれるものを追加しました。 ここでは、保存するユーザーの既存の”デッキ”から選択するために使用されます。 あなたが見ることができないのは、ブラウザの現在のURLを取得するためにいくつかのJavaScriptコードを実行していることです。 私たちは先にこのすべてをカバーします!

初期手順

新しいプロジェクトを作成するか、拡張機能を追加する既存のプロジェクトを開きます。 次に、File>New>Targetをヒットします。 IOSタブの下で共有拡張機能を選択し、次へを押します。 私は単純な”ShareExtension”を選択しました。

スキームを有効にしたいかどうか尋ねられます。 これは、アプリケーションを実行すると、メインアプリとは対照的に、Safariなどに直接開いて拡張機能をテストできるようになることを意味します。 私たちは、これをしたい—タップ有効にします。

プロジェクトCmd+Rを実行してこれまでのテスト—前述のように、テストするアプリのオプションが表示され、Safariを選択して実行をタップします。

拡張機能を実行するときに表示されるダイアログ。

Safariが開いたら、共有アイコンをタップすると、プレースホルダのアイコンが付いた拡張子名がリストに表示されます。 そうでない場合は、「その他」をタップして有効にします。 アイコンをタップすると、S L C O M P O Seserviceviewcontrollerのデフォルトの実装が表示されます。

URLの取得

共有シートは自動的にページタイトルを取得し、本文テキストとして設定しますが、一般的にはそれ以上のものが必要になります。 このためには、SafariにJavaSriptファイルを実行させて文書を解析し、必要なものを取得させることができます。

まず、Xcodeの拡張機能フォルダを右クリックし、新しいファイルを選択します。 他のタブの中に空のものがあり、[次へ]を押して、ファイルに”GetURL”という名前を付けます。js”。

拡張機能情報を編集する必要があります。plistファイルと”NSExtension”には”NSExtensionAttributes”という別の辞書があります—作成したばかりのファイルの値”GetURL”を持つキー”N S E X T E N S I O N J A Vascriptpreprocessingfile”を追加します(拡張子の欠如に注意してください)。

また、キー”N S E X T E N S I O N A C T I O N A T I O N S U P T O R T S U P T O R Tsupportsweburlwithmaxcount”を含む辞書行”N S E X Tensionactivationrule”を追加します1:

どのようにあなたの拡張機能の情報。plistは、プロパティリスト

N S E X T E N S I O N J A Vascriptpreprocessingfileとして表示される必要があります:これは、拡張機能の実行時に実行する必要があるJavaScriptファイルをアプリに知らせることができます。

NSExtensionActivationRule:この辞書を使用して、拡張機能をアクティブ化するコンテンツの種類をシステムが決定するのに役立つアクション拡張キーを追加します。

以下を”GetURL.js”:

上記で設定したキーと組み合わせると、iOSは実行時に実行する”ExtensionPreprocessingJS”という名前のオブジェクトを探します。 これは、Appleのドキュメントでより詳細に説明されています。

上記のjavascriptファイルでスクレープされたデータを取得するには、”ShareViewController”内でこのコードブロックを実行する必要があります。swift”viewDidLoad関数:

kUTTypePropertyListにもこのインポートが必要です:

import MobileCoreServices

拡張機能を実行すると、URLがコンソールに正常に出力されます!

サイドノート:私が持っているようにナビゲーションバーをカスタマイズしたい場合は、次のスニペットを追加します(独自の画像またはタイトルに置

設定セルの追加

共有拡張機能の作成に付属の定型文には、オプションで設定項目(共有シートの下部にあるセル)を提供する方法が含まれています)

override func configurationItems() -> ! {

「S L C O M P O Sesheetconfigurationitem」の配列を返す以下のスニペットを挿入します。

アプリを再度実行すると、下部にセルが表示されます。

設定項目のモデル

“デッキ”という基本モデルを作成します。ビューコントローラ間でデータを渡すために先に使用されるswift”。

tableview

最初のgifでは、設定セルをタップすると、tableviewで新しいビューにプッシュされます。 “ShareSelectViewController”という名前の”UIViewController”から継承する新しいファイルを作成します。スウィフト”。 Tableviewプロパティを作成し、それをビューに追加します。

このビューのタイトルとタイトルの色も設定し、セル識別子のような定数を構造体に保持することを好みます:)

元のview controllerから渡されたデッキを保:

var userDecks = ()

そして、tableviewに必要なプロトコルに準拠してください:

“ShareViewControllerに戻ります。最後に、作成した構成項目のtapHandler内で、ShareSelectViewControllerのインスタンスを作成し、タップを押してデッキを渡します。

アプリを実行します。

最後に、作成した構成項目のtapHandler内で、ShareSelectViewControllerのインスタンスを作成し、タップを押してデッキを渡します。

アプリを実行します。 設定セルをタップすると、ダミーデータでtableviewにプッシュされます。

しかし、設定セルはまだ”デッキタイトル”にハードコードされていることに気付くでしょう。 この更新を行うには、選択したデッキを保存するプロパティを作成し、デフォルトで最初の

を選択し、configurationItems()内の構成セルを更新して使用します:

deck.value = selectedDeck?.title 

アプリを再度実行すると、アプリが更新されていることがわかります。

選択したデッキを更新するためのプロトコル

新しいデッキがタップされたときにShareViewControllerに戻って却下し、UIを更新する方法が必要になります。 プロトコルで十分です。 ShareSelectViewControllerに以下を追加します。

最後に、ShareViewControllerを先ほど作成したプロトコルに準拠させ、ShareSelectViewControllerのデリゲートがselfに設定されていることを確認します。

選択したデッキが更新され、設定項目がリロードされて値が更新されます。 その後、メイン画面に戻るためにポップします。

アプリを実行すると、正しく選択されたデッキを表示するように更新されるデッキを変更できるはずです 🙂

を終了すると、収集した情報をサーバーまたはアプリに送信して何かを行うことができます。:

override func didSelectPost()

これについて詳しくは説明しませんが、NSURLSessionを使用してサーバーに投稿しました。 また、アプリグループを作成し、共有NSUserDefaultsを使用して、メインのiOSアプリ内で以前に取得したデータを保存および取得することで、ダミーデータを実際のデッキに

let userDefaults = NSUserDefaults(suiteName: "some.group.name")
let decks = userDefaults?.objectForKey("userDecks") as? NSArray

最後に、私の拡張機能がアクションダイアログで”Vurb”という名前で、アイコンがあることがわかります。 このSO投稿に従うことでアイコンを設定できます。 また、名前を変更するには、拡張機能のプロジェクト設定で「表示名」を変更するだけです。

それはすべてです、あなたがこれを見つけた場合は、他の人が推薦してそれを見つけるのを助けてください。

ここでプロジェクト全体を見ることができます。

タグ

コメントを残す

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