Amarengo

Articles and news

Slik Bygger du en iOS-Delingsutvidelse I Swift

Opprinnelig publisert av Scotty Fister på juli 30th 2016 24,887 leser

Merk: Oppdatert For Swift 4.

for en hack dag på jobben bestemte jeg meg for å prøve meg på å lage en delutvidelse. Jeg oppdaget at det ikke var en fullverdig opplæring der ute, og som et resultat måtte jeg samle informasjon (mye av det tilskrives overraskende apple-dokumentasjonen).

Målet

for å lagre en nettside URL som rikt innhold i vår app, og tillate konfigurasjon av noen alternativer. I utgangspunktet trodde jeg at en utvidelseshandling var det som var nødvendig-men det ser ut til at det er bedre egnet for å endre innhold (for eksempel å fjerne røde øyne på et bilde med ett trykk). Det ser ut til at Andre, Inkludert Apple, bruker delutvidelsen til å lage elementer i stedet.

Dette er hva vi har bygget på slutten:

den fullførte utvidelsen

som du kan se, har jeg tilpasset designet litt, og lagt til det som refereres til som et» konfigurasjonselement » som er celler nederst på arket; vanligvis brukt til å velge fra kontoer eller andre alternativer. Den brukes her for å velge fra brukerens eksisterende «Dekk» for å lagre til. Det du ikke kan se er at Det også kjører Noen JavaScript-kode for å hente den nåværende NETTADRESSEN til nettleseren, som vi sender til serveren senere. Vi vil dekke alt dette fremover!

Innledende Trinn

opprett et nytt prosjekt, eller åpne en eksisterende du vil legge til utvidelsen i. Deretter treffer Fil > Nytt > Mål. Velg Del Utvidelse under iOS-fanen, og trykk På Neste. Gi det et navn; jeg valgte den enkle «ShareExtension».

det vil spørre om du vil aktivere ordningen. Dette betyr at når du kjører programmet, vil det tillate deg å åpne Rett inn I Safari eller lignende for å teste utvidelsen, i motsetning til hovedappen din. Vi ønsker dette — trykk Aktiver.

Test hva du har så langt ved å kjøre project Cmd + R – som nevnt gir det deg muligheter for hvilken app du vil teste fra, velg Safari og trykk På Kjør.

dialogen presenteres når du kjører en utvidelse.

når Safari åpnes, trykker Du på del-ikonet og utvidelsesnavnet med plassholderikonet skal vises i listen. Hvis ikke, trykk På Mer og aktiver det. Tapping på ikonet vil presentere SLComposeServiceViewController standard implementering, som er ganske ryddig rett ut av boksen.

Få URL

delingsarket henter automatisk sidetittelen og setter den som brødtekst, men generelt vil du ha mer enn det — enten DET ER NETTADRESSEN eller et bilde på siden. For Dette Kan Du Få Safari til å kjøre En JavaSript-fil for å analysere dokumentet og hente det vi trenger.

høyreklikk først på utvidelsesmappen Din I Xcode og velg Ny Fil. Du finner Tom innsiden av den andre kategorien, trykk Neste og navnet på filen » GetURL.js».

du må redigere utvidelsesinformasjonen din.»nsextensionattributes» – legg til en nøkkel «NSExtensionJavaScriptPreprocessingfile» med verdien av vår fil nettopp opprettet, «GetURL» (merk mangelen på forlengelse).

legg Også til en ordliste rad «NSExtensionActivationRule» som skal inneholde nøkkelen «NSExtensionActivationSupportsWeburlwithmaxcount» med nummeret 1:

hvordan utvidelsen Info.plist bør se når sett på som en eiendom liste

NSExtensionJavaScriptPreprocessingfile: dette lar vår app vet Om En JavaScript-fil som skal kjøres på utførelse av utvidelsen.

NSExtensionActivationRule: bruk denne ordlisten til å legge Til Handlingsutvidelsestaster som hjelper systemet med å bestemme hvilke typer innhold du vil aktivere utvidelsen for.

Lim inn følgende i » GetURL.js»:

sammen med tastene vi angir ovenfor, vil iOS nå se etter et objekt som heter «ExtensionPreprocessingJS» for å utføre under kjøring. Dette forklares mer detaljert I Apples dokumentasjon.

for å hente dataene som er skrapt med javascript-filen ovenfor, må du kjøre denne kodeblokken i » ShareViewController.swift » viewDidLoad-funksjon:

Du trenger også denne importen for kUTTypePropertyList:

import MobileCoreServices

Kjører utvidelsen nå, bør du skrive UT NETTADRESSEN til konsollen!

side merk: legg til følgende utdrag hvis du vil tilpasse navigasjonsfeltet som jeg har (erstatte med ditt eget bilde eller bare en tittel).

Legge Til Konfigurasjonsceller

standardteksten som fulgte med oppretting av delingsutvidelsen, har inkludert en metode for å eventuelt levere konfigurasjonselementer (cellene i bunnen av delingsarket)

override func configurationItems() -> ! {

Sett inn koden nedenfor, som returnerer en rekke «SLComposeSheetConfigurationItem»:

Kjør appen din igjen, og du vil se en celle nederst nå.

En Modell For Konfigurasjonselementet

Lag en grunnleggende modell kalt » Deck.swift», som brukes fremover for å sende data mellom visningskontrollere.

TableView

i gif i begynnelsen har du lagt merke til når du trykker på konfigurasjonscellen, skyver den til en ny visning med en tableview. Opprett en ny fil som arver fra «UIViewController» kalt » ShareSelectViewController.rask». Opprett en tableview-egenskap og legg den til i visningen.

jeg har også satt tittel og tittelfarge for denne visningen, og foretrekker å beholde konstanter som celleidentifikatorer i en struct:)

Opprett en egenskap for å lagre Dekkets sendt inn fra den opprinnelige visningskontrolleren:

var userDecks = ()

og i samsvar med de nødvendige protokollene for tableview:

Tilbake I » ShareViewController.swift», opprett en egenskap for å lagre noen dummy data og fylle den i viewDidLoad:

Til Slutt, inne i tapHandler for konfigurasjonselementet vi opprettet, opprett en forekomst av ShareSelectViewController og få den til å trykke på trykk, passerer dekkene også:

Kjør appen. Tapping av konfigurasjonscellen skal skyve til tablettenvisning med dummy-dataene.

men du vil merke konfigurasjonen cellen er fortsatt hardkodet til «Dekk Tittel». For å få denne oppdateringen, opprett en egenskap for å lagre dekk valgt og velg den første som standard:

og oppdater konfigurasjonscellen inne configurationItems() for å bruke den:

deck.value = selectedDeck?.title 

Kjør appen igjen, og du vil se at den har oppdatert.

En Protokoll For Å Oppdatere Valgt Dekk

Du trenger en måte å avvise Tilbake til ShareViewController når et nytt Dekk er tappet, og få det til å oppdatere BRUKERGRENSESNITTET. En protokoll er nok. Legg til Følgende I ShareSelectViewController:

til Slutt må ShareViewController samsvare med protokollen som nettopp er laget, og sikre at representanten for ShareSelectViewController er satt til selv:

det valgte Dekk oppdateres, og konfigurasjonselementene lastes på nytt for å oppdatere verdien. Så vi pop å gå tilbake til hovedskjermen.

Kjør app og nå bør du være i stand til å endre dekk som vil oppdatere for å vise riktig valgt dekk 🙂

Etterbehandling

alt som er igjen er å sende den innsamlede informasjonen til serveren eller appen din for å gjøre noe med, som du kan gjøre i en annen standardmetode:

override func didSelectPost()

jeg vil ikke gå i detalj om dette, men jeg brukte En NSURLSession å legge til vår server. Jeg har også erstattet dummy data med ekte dekk ved å opprette en app gruppe og bruke en delt NSUserDefaults å lagre og hente data tidligere hentet i hoved iOS app.

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

Til Slutt vil du legge merke til at utvidelsen min heter «Vurb» i handlingsdialogen, og har et ikon. Du kan sette et ikon ved å følge DETTE INNLEGGET. Og for å endre navnet bare endre «Visningsnavn» i prosjektinnstillingene for utvidelsen.

Det er alt, hvis du fant dette nyttig, vennligst hjelp andre med å finne det ved å anbefale.

du kan se hele prosjektet her.

Tags

Bli Hacker Noon

Opprett en gratis konto for å låse opp din egendefinerte leseopplevelse.

Legg igjen en kommentar

Din e-postadresse vil ikke bli publisert.