Share
Denne opplæringen vil lære deg å kombinere UIKit utsikt og SKTransition klassen for å skape vakre, tilpassede overganger mellom forskjellige SKScenes. Les videre!
Illustrasjon av endelig resultat. Scener er grensesnitt som inneholder flere visningsobjekter. Normalt designer du flere scener for hver del av spillet ditt, og bruker deretter overganger mellom scenene etter behov. For eksempel kan du opprette forskjellige sceneklasser for å representere noen av eller alle følgende konsepter:
Som du kan se, kan en scene være noe som programmøren ønsker å skape. Vanligvis overgår du til en ny scene basert på spillspillsmål eller direkte brukerinngang. For eksempel, hvis timeren løper ut, kan en ny scene som presenterer et "spill over" bli presentert. Alternativt, hvis en bruker trykker på en valgknapp, kan du kanskje overgå til en ny scene for å konfigurere spillinnstillingene. Merk at ved overgangstrinnet blir sceneegenskapen oppdatert umiddelbart for å peke på den nye scenen. Etter dette skjer overgangen.
En overgang kan også ha et overgangsobjekt (en effekt eller en animasjon). Det objektet vil skape en dynamisk, vakker presentasjon når overgangen skjer. Flere gjenstander eksisterer, og for en komplett og offisiell referanse bør du konsultere SKTransition-klassen referansen.
De SKTransition Klassen presenterer flere metoder og to egenskaper (mer om de senere). Målet med alle metoder er å skape en skinnende og dynamisk overgang mellom scener. Klassemetodene kan deles inn i fire hoveddeler:
Accentsconagua
UIColor motsette seg farge den iboende overgangen.Varighet og Farge er enkle objekter, men begge deler Retning og CIFilter er ikke.
Som navneforslag betyr retningsegenskapen at overgangen vil skje i en bestemt retning. Retningsegenskapen kan ha en av fire konstanter. Disse konstantene er erklært som en NS_ENUM, som dette:
typedef NS_ENUM (NSInteger, SKTransitionDirection) SKTransitionDirectionUp, SKTransitionDirectionDown, SKTransitionDirectionRight, SKTransitionDirectionLeft,;
CIFilter er enda sterkere enn Retning siden det også er en referanseklasse med klassemetoder, eksempelmetoder og egenskaper. Denne opplæringen vil ikke dekke CIFilter klasse i dybden, men det vil vise et eksempel på hvordan du bruker det til å lage et egendefinert filter og det iboende SKTransition. Et ekstra notat om CIFilter klasse: den støtter dusinvis av effekter, men ikke alle støttes av den nyeste versjonen av IOS. Du bør konsultere Core Image Filter Reference for å se kompatibilitetslisten.
Merk at du kan bruke flere "grupperte metoder" for å opprette en SKTransiton. Men hvordan vet du hvilke som kan kombineres? For dette må du se på metodesignaturen og bestemme egenskapene som aksepteres av hver metode.
La oss for eksempel analysere tre metoder for å se hva de kan håndtere:
doorsOpenVerticalWithDuration:fadeWithColor: varighet:revealWithDirection: varighet:Som tidligere nevnt lar metodene navnene deg raskt å forstå hva hver metode kan gjøre. For å utarbeide, doorsOpenVerticalWithDuration: Metoden vil bare ta hensyn til en varighet fadeWithColor: varighet: Metoden bruker både en farge og en varighet. Du må først definere a UIColor objekt og deretter en varighetstid. De revealWithDirection: varighet: Metoden vil bare bruke en retning, som igjen kan være en av fire egenskaper. Legg merke til at du også kan utvide SKTransition klasse for å lage tilpassede overganger og bli med Varighet, Farge, Retning, og CIFilter.
De SKTransition Klassen har kun to egenskaper: pausesIncomingScene og pausesOutgoingScene. Begge konfigurerer om animasjoner spiller under overgangen, og begge egenskapene er boolean verdier. Forskjellen er som følger:
pausesIncomingScene bestemmer om innkommende scene er pauset under overgangen.pausesOutgoingScene bestemmer om utgående scenen er stoppet under overgangen.Siden begge er boolean verdier, definisjonen er enkel og kan forstås i neste kutt:
// annen kode ... transitionCrossFade = [SKTransition crossFadeWithDuration: 1]; transitionCrossFade.pausesIncomingScene = TRUE; transitionDoorsCloseHorizontal = [SKTransition doorsCloseHorizontalWithDuration: 2]; transitionDoorsCloseHorizontal.pausesOutgoingScene = FALSE;
De pausesIncomingScene og pausesOutgoingScene egenskaper på overgangsobjektet definerer hvilke animasjoner som spilles under overgangen. Som standard fortsetter begge scenene å behandle animasjon under overgangen. Men du vil kanskje sette en eller begge scenene på pause til overgangen fullfører.
Nå som du kjenner grunnleggende om SKTransition klasse, kan du nå starte programmeringsfasen.
Det første trinnet er å åpne Xcode og starte en ny SpriteKit prosjekt. Deretter skal du legge til en annen Objective-C klassen heter TransitionResult og en superklasse av SKScene.
Målet med dette prosjektet er å ha to klasser som skal byttes mellom dem. Den første (MyScene allerede definert av Xcode) vil inneholde en UITableView som vil holde referansen til hver SKTransition. Den andre (TransitionResult) blir destinasjonsscenen etter en overgang.
Når brukeren tapper skjermen etter en overgang, blir den igjen overført til MyScene.
I MyScene.h, Du vil erklære 3 gjenstander: a UITableView, UISlider, og en NSArray. De UITableView vil vise navnene på hver overgang, den UISlider vil definere Varighet av den overgangen, og NSArray vil inneholde navnene på hver SKTransition. Finalen MyScene.h koden vil lignes på denne koden:
@property (behold, nonatomic) IBOutlet UITableView * tableView; @property (nonatomic, behold) IBOutlet UISlider * sliderTimer; @property (strong, nonatomic) NSArray * overgangerArray;
Nå fokuser din oppmerksomhet i MyScene implementeringsfil.
Det første trinnet er å bruke -(Id) initWithSize: (CGSize) størrelse metode for å initialisere de nevnte objektene. En mulig konfigurasjonsoppsett er følgende:
_tableView = [[UITableView alloc] initWithFrame: CGRectMake (CGRectGetMinX (self.frame), CGRectGetMinY (self.frame) +20, CGRectGetMaxX (self.frame), CGRectGetMaxY (self.frame) -80)]; _tableView.dataSource = selv; _tableView.delegate = selv; _sliderTimer = [[UISlider allokering] initWithFrame: CGRectMake (CGRectGetMidX (self.frame) -70, CGRectGetMaxY (self.frame) -40, 140, 3)]; [_sliderTimer addTarget: selvhandling: @selector (sliderAction) forControlEvents: UIControlEventValueChanged]; [_sliderTimer settBackgroundColor: [UIColor clearColor]]; _sliderTimer.minimumValue = 1; _sliderTimer.maximumValue = 4; _sliderTimer.continuous = YES; _sliderTimer.value = 1; _transitionsArray = [[NSArray alloc] initWithObjects: @ "crossFadeWithDuration", @ "doorsCloseHorizontalWithDuration", @ "doorsCloseVerticalWithDuration", @ "doorsOpenHorizontalWithDuration", @ "doorsOpenVerticalWithDuration", @ "doorwayWithDuration", @ "fadeWithColor: duration", @ "fadeWithDuration" , @ "flipHorizontalWithDuration", @ "flipVerticalWithDuration", @ "moveInWithDirectionDown: duration", @ "moveInWithDirectionUp: duration", @ "moveInWithDirectionLeft: duration", @ "moveInWithDirectionRight: duration", @ "pushWithDirection: duration", @ "revealWithDirection: varighet ", @" transitionWithCIFilter: duration ", null);
Imidlertid presenteres en advarsel siden sliderAction mangler. Metoden vil oppdatere i sanntid transitionTimerText tar hensyn til UISlider verdi.
-(void) sliderAction transitionTimerText.text = [[NSString alloker] initWithFormat: @ "Overgangsvarighet:% f", _sliderTimer.value];
Merk at visningene, plasseringen, konfigurasjonen og oppsettet er helt konfigurerbare. Hvis du vil, kan du stille dette inn for dine beste interesser. I tillegg vil du legge til en SKLabelNode å lagre og vise UISlider verdi. Den verdien vil være representativ for SKTransition Varighet effekter. Legg til SKLabelNode * transitionTimerText til implementeringsfilen din og den tilsvarende initialiseringen vil være:
transitionTimerText = [SKLabelNode labelNodeWithFontNamed: @ "Chalkduster"]; transitionTimerText.text = [[NSString alloker] initWithFormat: @ "Overgangsvarighet:% f", _sliderTimer.value]; transitionTimerText.fontSize = 10; transitionTimerText.color = [SKColor colorWithRed: 0 grønn: 0 blå: 0 alfa: 1]; transitionTimerText.position = CGPointMake (CGRectGetMidX (self.frame), CGRectGetMinY (self.frame) +45);
Nå som du har objektene konfigurert, trenger du bare å legge dem til scenen. For det vil du bruke -(void) didMoveToView: (SKView *) visning metode. Legg det til din fil og innsiden legg til de nevnte visningene i hovedvisningen:
-(void) didMoveToView: (SKView *) visning [self addChild: transitionTimerText]; [self.scene.view addSubview: _sliderTimer]; [self.scene.view addSubview: _tableView];
Hvis du kjører prosjektet nå, vil du se to objekter på skjermen: a UISlider og a SKLabelNode.
Det neste trinnet er å vise SKTransition metoder i UITableView. For dette må du endre din MyScene.h fil og utvide klassen din med MyScene.h skal se slik ut:
@interface MyScene: SKScene
Gå tilbake til implementasjonsfilen, og du vil bli presentert med en advarsel. Denne advarselen sier at du må implementere ytterligere metoder som er knyttet til UITableView. De nødvendige metodene er: -(NSInteger) tableView: (UITableView *) tableView numberOfRowsInSection: (NSInteger) seksjon og -(UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath. Den første vil returnere antall rader i tabellen, mens den andre vil håndtere logikken for hver celle inne i bordet. For ytterligere notater vedrørende UITableView klasse, bør du konsultere den offisielle referanseklassen.
Den første metoden er enkel og er bare en enkelt linje:
-(NSInteger) tableView: (UITableView *) tableView numberOfRowsInSection: (NSInteger) seksjon return [_transitionsArray count];
Den andre metoden er mer kompleks siden vi må definere tabellcellens egenskaper og konfigurasjoner (celleinnhold). I dette eksemplet vil du bruke en enkel UITableViewCellStyleSubtitle. Hvis du har problemer med å skrive metoden, presenteres den fullstendige versjonen under:
-(UITableViewCell *) tableView: (UITableView *) tableView cellForRowAtIndexPath: (NSIndexPath *) indexPath NSString * overganger = [_transitionsArray objectAtIndex: indexPath.row]; UITableViewCell * celle = [tableView dequeueReusableCellWithIdentifier: @ "Identifier"]; hvis (celle == nil) celle = [[UITableViewCell allokere] initWithStyle: UITableViewCellStyleSubtitle reuseIdentifier: @ "Identifier"]; [cell.textLabel setText: overganger]; returcelle;
Kjør koden din nå, og du bør se hver cellelinje med et unikt navn. Hvert navn representerer det iboende SKTransiton Brukes hvis brukeren tapper den cellen. Du vil også merke at UITableView har ikke en tittel La oss fikse det!
Legg til følgende metode: - (NSString *) tableView: (UITableView *) tableView titleForHeaderInSection: (NSInteger) seksjon. Innenfor denne metoden legger du til følgende kode:
NSString * sectionName; bytte (seksjon) case 0: sectionName = NSLocalizedString (@ "SKTransition List", @ "SKTransition List"); gå i stykker; standard: sectionName = @ ""; gå i stykker; Return SectionName;
Denne metoden har lov til å ha flere titler for flere UITableView seksjoner. Vi vil imidlertid bare ha en seksjon, så tittelen vil bli "SKTransition List" (eller noe annet du velger).
På dette tidspunktet må du legge til brukerinteraksjon til cellene. For å gjøre dette, er det nødvendig med en annen metode. Denne gangen -(void) tableView: (UITableView *) tableView didSelectRowAtIndexPath: (NSIndexPath *) indexPath Metoden skal kalles. Denne metoden er lang, men det er lett å forstå. Du vil tildele de nødvendige ressursene for hver SKTransition og, basert på cellen tappet, vil du presentere en annen SKScene.
Det første trinnet er å importere TransitionResult header-fil, og definer deretter a TransitionResult gjenstand for den resulterende SKScene. Ta en titt på følgende for å se dette i aksjon:
TransitionResult * transitionResult; SKTransition * overgangCrossFade; SKTransition * transitionDoorsCloseHorizontal; SKTransition * transitionDoorsCloseVertical; SKTransition * overgangsdørerOpenHorizontal; SKTransition * transitionDoorsOpenVertical; SKTransition * transitionDoorway; SKTransition * transitionFadeWithColor; SKTransition * transitionFadeWithDuration; SKTransition * transitionFlipHorizontal; SKTransition * transitionFlipVertical; SKTransition * transitionMoveInWithDirectionDown; SKTransition * transitionMoveInWithDirectionUp; SKTransition * transitionMoveInWithDirectionLeft; SKTransition * transitionMoveInWithDirectionRight; SKTransition * transitionPushWithDirection; SKTransition * transitionRevealWithDirectionUp; SKTransition * transitionWithCIFilter;
Nå, i -(void) tableView: (UITableView *) tableView didSelectRowAtIndexPath: (NSIndexPath *) indexPath Metode, det er på tide å tildele de nødvendige ressursene. Den komplette koden er:
transitionCrossFade = [SKTransition crossFadeWithDuration: _sliderTimer.value]; transitionCrossFade.pausesIncomingScene = TRUE; transitionDoorsCloseHorizontal = [SKTransition doorsCloseHorizontalWithDuration: _sliderTimer.value]; transitionDoorsCloseHorizontal.pausesOutgoingScene = FALSE; transitionDoorsCloseVertical = [SKTransition doorsCloseVerticalWithDuration: _sliderTimer.value]; transitiondoorsOpenHorizontal = [SKTransition doorsOpenHorizontalWithDuration: _sliderTimer.value]; transitionDoorsOpenVertical = [SKTransition doorsOpenVerticalWithDuration: _sliderTimer.value]; transitionDoorway = [SKTransition doorwayWithDuration: _sliderTimer.value]; transitionFadeWithColor = [SKTransition fadeWithColor: [UIColor yellowColor] varighet: _sliderTimer.value]; transitionFadeWithDuration = [SKTransition fadeWithDuration: _sliderTimer.value]; transitionFlipHorizontal = [SKTransition flipHorizontalWithDuration: _sliderTimer.value]; transitionFlipVertical = [SKTransition flipVerticalWithDuration: _sliderTimer.value]; transitionMoveInWithDirectionDown = [SKTransition moveInWithDirection: SKTransitionDirectionDown varighet: _sliderTimer.value]; transitionMoveInWithDirectionUp = [SKTransition moveInWithDirection: SKTransitionDirectionUp varighet: _sliderTimer.value]; transitionMoveInWithDirectionLeft = [SKTransition moveInWithDirection: SKTransitionDirectionLeft varighet: _sliderTimer.value]; transitionMoveInWithDirectionRight = [SKTransition moveInWithDirection: SKTransitionDirectionRight varighet: _sliderTimer.value]; transitionPushWithDirection = [SKTransition pushWithDirection: SKTransitionDirectionDown duration: _sliderTimer.value]; transitionRevealWithDirectionUp = [SKTransition revealWithDirection: SKTransitionDirectionUp varighet: _sliderTimer.value]; CGRect screenRect = [[UIScreen mainScreen] grenser]; CIVector * omfang = [CIVector vectorWithX: 0 Y: 0 Z: screenRect.size.width W: screenRect.size.height]; transitionWithCIFilter = [SKTransition transitionWithCIFilter: [CIFilter filterWithName: @ "CIFlashTransition" keysAndValues: @ "inputExtent", omfang, @ "inputCenter", [CIVector vectorWithX: 0.3 * screenRect.size.width Y: 0.7 * screenRect.size.height], @ "inputColor", [CIColor colorWithRed: 1.0 green: 0.8 blue: 0.6 alpha: 1], @ "inputMaxStriationRadius", @ 2,5, @ "inputStriationStrength", @ 0.5, @ "inputStriationContrast", @ 1,37, @ "inputFadeThreshold" @ 0,85, null] varighet: _sliderTimer.value]; transitionResult = [[TransitionResult alloc] initWithSize: CGSizeMake (CGRectGetMaxX (self.frame), CGRectGetMaxY (self.frame))]; bytte (indexPath.row) case 0: [self.scene.view presentScene: transitionResult overgang: transitionCrossFade]; [self removeUIKitViews]; gå i stykker; tilfelle 1: [self.scene.view presentScene: transitionResult overgang: transitionDoorsCloseHorizontal]; [self removeUIKitViews]; gå i stykker; tilfelle 2: [self.scene.view presentScene: transitionResult overgang: transitionDoorsCloseVertical]; [self removeUIKitViews]; gå i stykker; tilfelle 3: [self.scene.view presentScene: transitionResult overgang: transitiondoorsOpenHorizontal]; [self removeUIKitViews]; gå i stykker; tilfelle 4: [self.scene.view presentScene: transitionResult overgang: transitionDoorsOpenVertical]; [self removeUIKitViews]; gå i stykker; sak 5: [self.scene.view presentScene: transitionResult overgang: transitionDoorway]; [self removeUIKitViews]; gå i stykker; sak 6: [self.scene.view presentScene: transitionResult overgang: transitionFadeWithColor]; [self removeUIKitViews]; gå i stykker; sak 7: [self.scene.view presentScene: transitionResult overgang: transitionFadeWithDuration]; [self removeUIKitViews]; gå i stykker; sak 8: [self.scene.view presentScene: transitionResult overgang: transitionFlipHorizontal]; [self removeUIKitViews]; gå i stykker; sak 9: [self.scene.view presentScene: transitionResult overgang: transitionFlipVertical]; [self removeUIKitViews]; gå i stykker; sak 10: [self.scene.view presentScene: transitionResult overgang: transitionMoveInWithDirectionDown]; [self removeUIKitViews]; gå i stykker; sak 11: [self.scene.view presentScene: transitionResult overgang: transitionMoveInWithDirectionUp]; [self removeUIKitViews]; gå i stykker; sak 12: [self.scene.view presentScene: transitionResult overgang: transitionMoveInWithDirectionLeft]; [self removeUIKitViews]; gå i stykker; sak 13: [self.scene.view presentScene: transitionResult overgang: transitionMoveInWithDirectionRight]; [self removeUIKitViews]; gå i stykker; sak 14: [self.scene.view presentScene: transitionResult overgang: transitionPushWithDirection]; [self removeUIKitViews]; gå i stykker; tilfelle 15: [self.scene.view presentScene: transitionResult overgang: transitionRevealWithDirectionUp]; [self removeUIKitViews]; gå i stykker; sak 16: [self.scene.view presentScene: transitionResult overgang: transitionWithCIFilter]; [self removeUIKitViews]; gå i stykker; standard: break;
Du vil motta en advarsel som sier at en metode (removeUIKitViews) mangler. Denne metoden er en enkel samtale for å fjerne noen visninger fra overordnet og supervisning. Mens det er forenklet, er den nødvendige koden:
-(void) removeUIKitViews [transitionTimerText removeFromParent]; [_tableView removeFromSuperview]; [_sliderTimer removeFromSuperview];
Nå for flere notater om -(void) tableView: (UITableView *) tableView didSelectRowAtIndexPath: (NSIndexPath *) indexPath metode.
SKTransition Overgangsinitialisering ligner alle overganger.Varighet tiden er definert av UISlider verdi.For å kjøre koden og teste overgangene, må du fylle ut TransitionResult klasse. Flytt den klassen og legg til -(Id) initWithSize: (CGSize) størrelse metode. Det ligner på MyScene.m metode. Du kan prøve å skrive det selv. Kopier og lim inn fra den andre klassen slik at den ser ut som den neste metoden:
-(id) initWithSize: (CGSize) størrelse hvis (selv = [super initWithSize: size]) self.backgroundColor = [SKColor colorWithRed: 0.35 green: 0.45 blue: 0.23 alpha: 1.0]; SKLabelNode * myLabel = [SKLabelNode labelNodeWithFontNamed: @ "Chalkduster"]; myLabel.text = @ "Trykk på gå tilbake"; myLabel.fontSize = 15; myLabel.position = CGPointMake (CGRectGetMidX (self.frame), CGRectGetMidY (self.frame)); [self addChild: myLabel]; returner selv;
Du kan nå kjøre koden og teste overgangene. Gå videre og prøv dem!
Som du kanskje allerede har lagt merke til, må du kaste koden hver gang du vil teste en ny overgang. Så, la oss endre TransitionResult.m fil som muliggjør en uendelig navigasjon. Hver gang brukeren tapper skjermen, blir den flyttet til startscenen.
Du trenger den -(void) berørerBegan: (NSSet *) berører medEvent: (UIEvent *) hendelse metode og du må importere MyScene.h klasse. Så, det siste trinnet er å tildele og initiere et klasseobjekt og bytte scenene. Neste utdrag vil hjelpe deg med å gjøre nettopp det:
-(void) berørerBegan: (NSSet *) berører medEvent: (UIEvent *) hendelse MyScene * home = [[MyScene alloker] initWithSize: CGSizeMake (CGRectGetMaxX (self.frame), CGRectGetMaxY (self.frame))]; [self.scene.view presentScene: home];
Endelig kjør programmet og test alle SKTransitions. Det neste bildet representerer en av overgangene:
I løpet av dette SKTransition opplæring, har vi dekket følgende:
SKTransition klasse.SKTransition opsjoner.SKTransition eiendommer.UITableView og UISlider og bruk dem parallelt med Sprite Kit.Hvis du har spørsmål eller kommentarer, vær så snill å la dem være under!
