SwiftUI, SpriteKit и липсващият жест с докосване

SpriteKit съществува вече почти десет години, като излезе на WWDC 2013, беше преработен през 2014, 2016, 2017 и 2019 и дори беше споменат на WWDC 2020.

Това е рамката на Apple за създаване на 2D игри. Той е лесен за използване и е много добър начин да научите млади програмисти на занаята си. Потърсете във всички ваши любими източници документи, в които се говори за това как да го приложите. Повечето от статиите, които ще откриете, се фокусират или върху основите (както Фелисити Джонсън прави в тази статия), или се стремят докрай (напр. Дилън Шайн заедно a супер-впечатляващо ръководство за изграждане на игра).

И двете са страхотни статии и аз също искам да създам игра, но искам да погледна на това повече от гледната точка на Артури Джали. Това не е игра, но илюстрира как да използвате SpriteKit заедно със SwiftUI.

Нека се върнем към 2019 г., когато Apple се изплъзна, че вече можете да добавите SKScene в интерфейс SwiftUI. Вие правите това с тези безсмъртни редове:

GameScene, посочен в този код, е изработен със следното:

Вярвам, че този кодов фрагмент е от едно от прессъобщенията на Apple, документиращи новата функционалност. Показва черен квадрат, върху който генерирате спрайтове с докосване. Докато използвате докосването си, те падат на земята. Това е нещо като игра, но почакайте. Прочетете този параграф отново.

Звънна ли звънец? Преди известно време написах статия за използването на плъзгане за емулиране на липсващ жест в арсенала на SwiftUI — touch.



Работи добре — получавате нещо като touch и трябва само да преместите пръста си достатъчно, за да се регистрира. Това е добре, но можем да го направим по различен начин. Бях изкушен да кажа по-добре, но има едно предупреждение, което ще спомена по-късно.

Използвайки SpriteKit в SwiftUI, имате истински touch жест. Нека проучим как можете да внедрите touch във вашия SwiftUI с помощта на SpriteKit. Ще направим това, като изградим проста игра.

Кодер

Искам да внедря игра, която имах на първия си калкулатор. Това беше ранна версия на Space Invaders. Начинът, по който работи, е, че имахте прост дисплей, на който ще се появят числата, и както го направиха, трябваше да натиснете въпросния номер, за да изчезне. Работеше така:

Деветте полета са всички случаи на SceneKit, в които имате SKLabelNode. Клетките са разположени с помощта на LazyHGrid в SwiftUI. Във всеки SceneKit обект наблюдавам дали екранът вижда touch събитие.

Когато се случи докосване, той променя фона на моя SpriteView на червен. Когато докосването приключи, той се връща в черно. Белите кръгове просто са нарисувани в рамките на SwiftUI върху SpriteKit Views.

Сега, когато натиснете „reset“, играта започва и числото в горната част на дъската бавно нараства по размер. Вашата задача е да намерите посочените числа на клавиатурата, да ги натиснете и да ги накарате да изчезнат.

Ако успеете да накарате всички числа да изчезнат, тогава времето, необходимо на низа да стане по-голям, ще бъде намалено наполовина и ще трябва да свършите работата два пъти по-бързо. Ако размерът на числото достигне десет цифри, тогава играта приключва.

Трябва да покажете таймер, както и използваното забавяне. Направете това и можете да предизвикате приятелите си, за да видите кой може да издържи най-дълго с най-кратко забавяне на място. Тъй като това е лесната версия, можете да натискате числа на клавиатурата в произволен ред. Твърдата версия трябва да ви ограничи първо до най-лявата цифра. Втора задача за допълнителен кредит.

Сега не е лесно да се види тук, но разберете какво се случва. Въпреки че на пръв поглед може да изглежда така, сякаш използваме tap, не сме. Ние използваме touch.

Използвайки SceneKit, всъщност можем да приложим жеста touch с компилация на SwiftUI, въпреки че има едно предупреждение, което искам да спомена. Кръговете, които съм нарисувал върху бутоните, всъщност ще блокират touch жестовете. Мога да се измъкна в този пример, но трябва да го имате предвид, ако смятате, че можете да използвате тази техника.

Ето кода за анимирания GIF/игра, който можете да актуализирате:

Заключение

Това ме довежда до края на тази статия. Надявам се да ви е харесало да го прочетете толкова, колкото и аз да го напиша. Последвайте ме в Medium, за да получите повече статии за кодиране в Swift или потърсете някои от моите други.