Amarengo

Articles and news

Hogyan építsünk egy iOS Share kiterjesztést a Swift-ben

eredetileg kiadta Scotty Fister július 30-án 2016 24,887 olvas

Megjegyzés: Frissítve Swift 4.

egy hack nap a munkahelyen úgy döntöttem, hogy kipróbálom a kezem egy részvénybővítés létrehozásában. Felfedeztem, hogy nincs teljes funkcionalitású oktatóanyag, és ennek eredményeként információkat kellett összeállítanom (ezek nagy része meglepő módon az Apple dokumentációjának tulajdonítható).

a cél

menteni egy weboldal URL gazdag tartalmat a mi app, és lehetővé teszi a konfiguráció néhány lehetőséget. Kezdetben azt hittem, hogy egy kiterjesztési műveletre van szükség — de úgy tűnik, hogy ez jobban megfelel a tartalom módosításának (például a vörösszem-hatás eltávolítása egy fényképen egy érintéssel). Úgy tűnik, mások, beleértve az Apple-t is, a share kiterjesztést használják elemek létrehozására.

ezt fogjuk építeni a végére:

a befejezett kiterjesztés

mint látható, kicsit testre szabtam a tervet, és hozzáadtam az úgynevezett “konfigurációs elemet”, amelyek a lap alján található cellák; általában fiókok vagy más lehetőségek kiválasztására használják. Ezt használják itt, hogy válasszon a felhasználó meglévő “pakli” menteni. Amit nem lát, az az, hogy néhány JavaScript kódot is futtat a böngésző aktuális URL-jének letöltéséhez, amelyet később elküldünk a szervernek. Mindent előre fedezünk!

Kezdeti lépések

vagy hozzon létre egy új projektet, vagy nyisson meg egy meglévőt, amelyhez hozzá szeretné adni a kiterjesztést. Ezután nyomja Fájl > új > cél. Az iOS lapon válassza a kiterjesztés megosztása lehetőséget, majd nyomja meg a Tovább gombot. Adj neki egy nevet; az egyszerű “ShareExtension”mellett döntöttem.

megkérdezi, hogy szeretné-e aktiválni a sémát. Ez azt jelenti, hogy az alkalmazás futtatásakor lehetővé teszi, hogy egyenesen a Safariba vagy hasonlóba nyissa meg a kiterjesztés tesztelését, szemben a fő alkalmazással. Ezt akarjuk-érintse meg az aktiválást.

tesztelje az eddigieket a cmd + R projekt futtatásával — amint említettük, lehetőséget ad arra, hogy melyik alkalmazást tesztelje, válassza a Safari lehetőséget, majd koppintson a Futtatás elemre.

a kiterjesztés futtatásakor bemutatott párbeszédpanel.

amikor a Safari megnyílik, koppintson a megosztás ikonra, és a kiterjesztés neve a helyőrző ikonnal együtt megjelenik a listában. Ha nem, koppintson a Tovább gombra, és engedélyezze. Az ikon megérintésével megjelenik az SLComposeServiceViewController alapértelmezett megvalósítása, ami elég ügyes a dobozból.

az URL megszerzése

a megosztási lap automatikusan lekéri az oldal címét, és törzsszövegként állítja be, de általában ennél többet szeretne — legyen az URL vagy egy kép az oldalon. Ehhez a Safari futtathat egy JavaSript fájlt, hogy elemezze a dokumentumot, és letöltse, amire szükségünk van.

először kattintson a jobb gombbal az extensions mappára az Xcode-ban, majd válassza az új fájl lehetőséget. A másik fülön belül üres lesz, nyomja meg a Next gombot, és nevezze el a fájlt ” GetURL.js”.

szerkesztenie kell a bővítmények adatait.plist file and in ” NSExtension “van egy másik szótár, az úgynevezett” NSExtensionAttributes “— adjunk hozzá egy kulcsot” NSExtensionJavaScriptPreprocessingfile “az érték a fájl most létrehozott,” GetURL ” (megjegyzés hiánya kiterjesztés).

adjon hozzá egy “NSExtensionActivationRule” szótársort is, amelynek tartalmaznia kell az “NSExtensionActivationSupportsWeburlwithmaxcount” kulcsot a számmal 1:

hogy a kiterjesztés Info.plist kell nézni nézve, mint egy tulajdonság lista

NSExtensionJavaScriptPreprocessingfile: ez lehetővé teszi a app tudni egy JavaScript fájlt kell futtatni végrehajtása a kiterjesztés.

NSExtensionActivationRule: ezzel a szótárral olyan Műveletbővítő kulcsokat adhat hozzá, amelyek segítenek a rendszernek meghatározni, hogy milyen típusú tartalomhoz aktiválja a bővítményt.

illessze be a következőket a “GetURL.js”:

a fent beállított kulcsokkal együtt az iOS most egy “ExtensionPreprocessingJS” nevű objektumot keres futásidőben. Ezt részletesebben az Apple dokumentációja magyarázza.

a fenti javascript fájllal lekapart adatok lekéréséhez ezt a kódblokkot a “ShareViewController.swift ” viewDidLoad funkció:

akkor is kell ezt az import kUTTypePropertyList:

import MobileCoreServices

a kiterjesztés futtatásának most sikeresen ki kell nyomtatnia az URL-t a konzolra!

Mellékjegyzet: adja hozzá a következő részletet, ha szeretné testreszabni a navigációs sávot, ahogy van (helyettesítve a saját képével vagy csak egy címmel).

konfigurációs cellák hozzáadása

a megosztási kiterjesztés létrehozásával kapott kazánlap tartalmaz egy módszert a konfigurációs elemek opcionálisan történő ellátására (a megosztási lap alján található cellák)

override func configurationItems() -> ! {

helyezze be az alábbi részletet, amely az “SLComposeSheetConfigurationItem”tömböt adja vissza:

futtassa újra az alkalmazást, és egy cellát fog látni az alján.

a modell a konfigurációs elem

hozzon létre egy alapmodell úgynevezett “Deck.swift”, amelyet előre használnak az adatok továbbítására a nézetvezérlők között.

a TableView

a gif elején, akkor észrevette, ha megérinti a konfigurációs cella tolja egy új nézet egy tableview. Hozzon létre egy új fájlt, amely örökli az ” UIViewController “nevű” ShareSelectViewController.gyors”. Hozzon létre egy tableview tulajdonságot, és adja hozzá a nézethez.

beállítottam a cím és a cím színét is ehhez a nézethez, és inkább az állandókat, például a cellaazonosítókat egy struktúrában tartom:)

hozzon létre egy tulajdonságot az eredeti nézetvezérlőből átadott fedélzet tárolására:

var userDecks = ()

és megfelelnek a szükséges protokollok a tableview:

vissza a ” ShareViewController.swift”, hozzon létre egy tulajdonságot néhány dummy adat tárolására és feltöltésére a viewDidLoad-on belül:

végül, az általunk létrehozott konfigurációs elem taphandlerén belül hozzon létre egy példányt a Shareselectviewcontrollerből, és nyomja meg a csapot, átadva a fedélzeteket is:

futtassa az alkalmazást. Ha megérinti a konfigurációs cellát, nyomja meg a tableview-t a dummy adatokkal.

észre fogja venni azonban, hogy a konfigurációs cella továbbra is kódolva van a “Deck Title” – re. A frissítés elvégzéséhez hozzon létre egy tulajdonságot a kiválasztott fedélzet tárolására, majd alapértelmezés szerint válassza ki az elsőt:

, majd frissítse a configurationtems () konfigurációs celláját annak használatához:

deck.value = selectedDeck?.title 

futtassa újra az alkalmazást, és látni fogja, hogy frissült.

a kiválasztott fedélzet frissítésének protokollja

szüksége lesz egy módra, hogy visszatérjen a Shareviewcontrollerbe, amikor egy új fedélzetet érint, és frissítse a felhasználói felületet. Egy protokoll elég lesz. Adja hozzá a következőket A Shareselectviewcontrollerhez:

végül módosítsa a Shareviewcontrollert az imént elkészített protokollhoz, és győződjön meg arról, hogy a ShareSelectViewController megbízottja self értékre van állítva:

a kiválasztott fedélzet frissül, és a konfigurációs elemek újratöltődnek az érték frissítéséhez. Aztán pop, hogy menjen vissza a fő képernyőn.

futtassa az alkalmazást, és most képesnek kell lennie arra, hogy megváltoztassa a fedélzeteket, amelyek frissítik a helyesen kiválasztott fedélzetet 🙂

Befejezés

csak annyit kell tennie, hogy elküldi az összegyűjtött információkat a szerverre vagy az alkalmazásra, hogy tegyen valamit, amit egy másik boilerplate módszeren belül megtehet:

override func didSelectPost()

nem megyek bele részletesen erről, de egy NSURLSession-t használtam a szerverünkre. A próbabábu adatokat valódi fedélzetekre is cseréltem egy alkalmazáscsoport létrehozásával és egy megosztott NSUserDefaults használatával a korábban a fő iOS alkalmazásban letöltött adatok tárolására és lekérésére.

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

végül észre fogod venni, hogy a kiterjesztésem neve “vurb” a művelet párbeszédpanelen, és van egy ikonja. Beállíthat egy ikont, ha követi ezt a bejegyzést. A név megváltoztatásához egyszerűen módosítsa a” Megjelenítési név ” elemet a kiterjesztés projektbeállításaiban.

ez minden, ha hasznosnak találta ezt, kérjük, segítsen másoknak megtalálni ajánlásával.

a projektet teljes egészében itt tekintheti meg.

címkék

Csatlakozz Hacker Noon

hozzon létre INGYENES fiókot, hogy kinyit az egyéni olvasási élményt.

Vélemény, hozzászólás?

Az e-mail-címet nem tesszük közzé.