Архив рубрики: Swift

Создание SwiftUI iOS приложения “Карта с поиском”  в тандеме с ИИ Gemini 2.5 Pro Experimental 

Опубликовано автором
Ответить

iOS 17 принесла разработчикам SwiftUI настоящий подарок от MapKit — кучу новых фишек, которые не потребуют никаких шаманских бубнов и костылей из UIKit: 

  • новый Map (position:selection:content:) задает положение камеры position и отслеживает  выбор selection на карте,
  • внутрь карты Map можно добавлять аннотации, маркеры, полигоны, маршруты через обычный SwiftUI DSL (ForEach, Marker, Annotation и т.д.), который называется MapContentBuilder и позволяет строить карты декларативно, как обычный View,
  • LookAroundPreview (аналог панорам улиц) можно показать для конкретной точки на карте,  
  • теперь стандартные элементы управления картой добавляются через модификаторы: компас .mapControl(.compass), пользователь mapControl(.userLocation), масштабная линейка .mapControl(.scaleView),
  • данные поисковых подсказок  MKLocalSearchCompletion теперь легко попадают в SwiftUI через @State.

Чтобы разобраться с новыми API, я решила поработать с небольшим скромным iOS приложением, которое описывается в посте Building a searchable map with SwiftUI and MapKit  (перевод этого поста на русский находится здесь) вместе с блестящим ИИ от Google, Gemini 2.5 Pro Experimental, чтобы привести его в работоспособное состояние.

Читать далее →

Google AI Studio c Gemini 2.5 для создания iOS приложения на основе макетов из Figma

Опубликовано автором

Мне случайно попалось задание с собеседования 2-х годичной давности на позицию «iOS разработчик» , в котором требовалось создать iOS приложения для бронирования номера в Отеле на основе макетов экранов из Figma, в которых использовалась «карусель» из фото. 

Я решила попробовать использовать ИИ для разработки такого iOS приложения по макетам из Figma. Прямо скажем, что текст на прототипах экранов не очень отчетливо виден, так что ИИ предстоит его сначала прочитать, а уже потом создать iOS приложение.

Для меня приоритетными ИИ при создании iOS приложений являются ChatGPT 4.o-mini, Claude 3.5 (3.7) Sonnet и Grok 3, ну, может быть, DeepSeek R1, но Gemini 1.5 всегда давал хотя и корректный, но не самый лаконичный и интересный код.

Однако Gemini всегда прекрасно читал текст на изображениях ( в том числе на русском), кроме того, появилась более продвинутая Gemini 2.5 Pro Experimental —  мультимодальная, рассуждающая модель AI, которую компания называет самой интеллектуальной моделью на сегодняшний день.

Так что у нас есть все шансы на успех.

Забегая вперед, сразу скажу, что Gemini 2.5 Experimental превзошел ожидания: точное воспроизведение Figma-макетов в SwiftUI (стили, функционал) + нешаблонный код, а изобретательные решения (FlexibleGridView и др.). Стартовый код — база для масштабируемого приложения с реализацией загрузки данных с сервера (REST API). Код находится на Github.

Читать далее →

Создание игральных карт в SwiftUI с помощью ИИ Grok 3

Опубликовано автором

Мне всегда хотелось создать в SwiftUI «родное» View для игральных карт, не уступающее по качеству игральным картам, которые уже создал Пол Хэгерти на далеком стэнфордском курсе CS193P 2017 Лекция 6 в UIKit. Наиболее сложной частью было правильное расположение на карте символов масти для числовых карт (2 -10). Я даже интегрировала созданную Полом Хэгерти в UIKit игральную карту в SwiftUI, учитывая легкость интеграции UIViews в  SwiftUI. Но это все-таки не «родное» SwiftUI View.

Я обратилась к ИИ: Grok 3 Think, ChatGPT 3.0-mini Reason, Claude 3.7, Gemini 2.0 Flash, DeepSeek, Qwen 2.5 Max — с запросом о создании игральных карт в SwiftUI.

Самый впечатляющий результат я получила от Grok 3 Think, который предложил компактный и очень гибкий способ конструирования числовых карт (2-10) в современном SwiftUI, тот же самый способ предложил и ChatGPT 3.0-mini Reason с небольшими различиями в реализации, а вот остальные представили довольно громоздкие способы конструирования таких карт, которые фактически сводились к индивидуальным комбинациям HStack и VStack для отдельных символов масти  («♥️», «♦️», «♣️», «♠️») для каждого ранга (2-10).

Я хочу поделиться с вами протоколом взаимодействия с Grok 3 Think, в результате которого и был предложен этот самый оптимальный вариант.

Код находится на Github.

Представленный в этом посте материал может успешно использоваться для обучения программированию на SwiftUI.

Читать далее →

Grok 3 xAI в разработке iOS приложения «Страны Мира» (отображение границ)

Опубликовано автором

В предыдущей статье я писала о создании с помощью различных ИИ довольно простого тестовое iOS приложение Countries («Страны Мира»), которое показывает все страны Мира по регионам (Европа, Азия, Латинская Америка и т.д.) и для каждой страны отображается её название, флаг, численность населения и ВВП. Если вы выбираете какую-то страну, то на карте будет представлена страна с местоположением её столицы..

Я хочу добавить на карту границы страны:

На данный момент я ничего не знаю о том, где взять информацию о границах стран, но это должен быть либо JSON файл, либо JSON информация из интернета, которую можно считать с помощью async / await и декодировать в Swift.

Я хочу обратиться к Grok 3 xAI и попросить его написать для меня Swift код, который бы добавил границы выбранной страны на карту. 

Сразу скажу, что я не считаю, что какой-то ИИ может вместо вас написать целое iOS приложение. В лучшем случае ИИ может предложить вам действительно замечательный код с небольшим количеством ошибок (2-5), которые кстати иногда трудно найти даже опытному программисту высшей квалификации ( у меня так было с Claude 3.5 Sonnet, хотя считаю его одним из лучших ИИ для кодинга). Если вы находите эти ошибки самостоятельно или, продолжая спрашивать ИИ, вы действительно получаете высокопрофессиональное iOS приложение, потратив на его разработку существенно меньше времени.

Вот под таким углом мы и будем рассматривать нашу задачу о границах стран на карте, которую будем решать вместе с Grok 3 xAI. 

Забегая вперед, скажу, что Grok 3 xAI практически полностью справился со всеми моими запросами, предложив совершенно неожиданное для меня решение со встроенным в MapKit декодером MKGeoJSONDecoder. Тем не менее я попросила Grok 3 создать Codable Модель в Swift для декодирования GeoJSON данных, имеющих не тривиальную JSON структуру, и он с ней превосходно справился. По ходу дела Grok 3 вообще выдал целый «Комплексный обзор о получении GeoJSON данных стран» и предоставил очень четкие «рассуждения», которые вполне можно использовать как отличный обучающий материал.

Так что Grok 3 xAI в этой конкретной задаче зарекомендовал себя серьезным помощником в iOS программировании.

Код iOS приложения Countries с границами стран находится на Github.

Полностью протокол взаимодействия с Grok 3 можно посмотреть здесь. Ниже представлены лишь отдельные фрагменты этого протокола.

Читать далее →

Cursor AI в iOS разработке. Приложение «Фото с Flickr.com». Часть 2.

Опубликовано автором

Мы исследуем как работает Cursor AI на примере создания iOS приложения с выборкой данных с ресурса публичных фотографий на Flickr.com.
UI этого iOS приложения представляет собой строку поиска вверху и сетку Grid под ней для отображения миниатюр этих фотографий. Вы можете кликнуть на любую из фотографий и получить подробную информацию о ней:

Начальное решение этой задачи, то есть создание такого iOS приложения, описано в предыдущем посте «Cursor AI в iOS разработке. Приложение «Фото с Flickr.com». Часть 1.»
Окончательный вариант iOS приложения PhotomaniaCursor находится на Github.com.
Здесь мы продолжим совершенствовать наше приложение PhotomaniaCursor, которое может выбирать публичные фотографии с Flickr.com. И вот наш первый вопрос:

Как часто происходит обращение к  Flickr API при наборе текста в строке поиска?

Наша следующая версия 8 приложения PhotomaniaCursor будет работать в точности как и версия 7, но мы хотим четко увидеть, при каких тегах tags осуществляется обращение к  Flickr API при наборе пользователем текста в строке поиска searchText. Для этого мы будем печатать в FlickrViewModel теги tags, для которых этот запрос выполняется, :

if let encodedTags = tags.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) {
           print ("--------------------------- \(encodedTags)")
          urlString += "&tags=\(encodedTags)           
}
Читать далее →

Cursor AI в iOS разработке. Приложение «Фото с Flickr.com». Часть 1.

Опубликовано автором

Мне хотелось посмотреть, как работает ИИ Редактор кода Cursor AI на примере создания iOS приложения с выборкой данных с ресурса, который не требует API key и платной подписки. И этим ресурсом оказались публичные фотографии с Flickr.com.

Задача

Создать UI iOS приложения со строкой поиска вверху и сеткой Grid под ней для отображения миниатюр фотографий наподобие:

Пользователь должен иметь возможность вводить текст в строку поиска и видеть набор фотографий, теги которых tags соответствуют строке поиска. Строка поиска может содержать одно слово (например, “rose”) или разделенные пробелами слова(например, “forest bird” (лес птица)).

Функциональные требования:

  • Список фотографий извлекается с помощью API из Flickr типа: https://api.flickr.com/services/feeds/photos_public.gne?format=json&nojsoncallback=1&tags=porcupine (замените слово «porcupine» на то, которое ввел пользователь).
  • При выполнении поиска отображается индикатор хода выполнения, не блокируя UI.
  • При нажатии на изображение должно быть показано View с подробной информации о фотографии.
Читать далее →

iOS приложение игры 2048 в SwiftUI с ChatGPT. Часть 3. ИИ (AI) для игры 2048.

Опубликовано автором

В двух предыдущих постах мы рассмотрели создание логики игры 2048 и разработку UI с анимацией. В этом посте мы добавим ИИ (искусственный интеллект ) для игры 2048 в виде алгоритмов Expectimax и Monte Carlo. Код находится на Github.

ШАГ 16.  Добавление AI в игру 2048

Добавление ИИ в игру 2048 подразумевает реализацию логики, которая может автоматически выбирать лучший ход на каждом шаге. ИИ будет, например, использовать функцию bestMoveDirection(), которую мы ранее обсуждали, чтобы определить, какой ход выполнить, основываясь на максимальном увеличении счета. В этом случае ИИ может автоматически играть в игру 2048, делая оптимальные ходы.

Таким образом, нам понадобится метод выполнения хода ИИ, возможность запуска его автоматически с определенной периодичностью, и, переключатель для переключения между ручным  режимом со swipe жестом и воспроизведением ИИ.

Но давайте сначала поймем, какие в SwiftUI есть средства запуска определенного кода автоматически через равные промежутки времени:

Читать далее →

iOS приложения игры 2048 в SwiftUI  с ChatGPT 4-o. Часть 2. Анимация и UI.

Опубликовано автором

В прошлом посте «iOS приложение игры 2048 в SwiftUI с ChatGPT 4-o. Часть 1. Логика игры» показано, как реализовать логику игры 2048 c помощью ChatGPT. В этом посте мы рассмотрим проектирование UI игры 2048 с помощью ChatGPT и особое внимание уделим анимации перемещения плиток на игровой доске. Код находится на Github.

Анимация и UI

Шаг 8. Анимация

Читать далее →

iOS приложения игры 2048 в SwiftUI  с ChatGPT 4-o. Часть 1. Введение. Логика игры 2048.

Опубликовано автором

Я хочу поделиться с вами опытом создания «с нуля» iOS приложения известной игры 2048 с элементами ИИ (искусственного интеллекта) в SwiftUI с помощью ChatGPT . Код находится на Github.

В своем классическом варианте, когда играет пользователь с помощью жестов (вверх, вниз, вправо, влево),  это довольно простая игра и создать полноценное iOS приложение для такой игры 2048 можно за короткое время, при этом  код будет понятен каждому. Но простые правила игры только подталкивают к созданию оптимальных алгоритмов решения игры 2048, то есть к созданию ИИ, который мог бы играть в эту игру автоматически и максимизировать счет игры в разумные сроки. 

Мне хотелось написать игру 2048 именно на SwiftUI, пользуясь его прекрасной и мощной анимацией и приличным быстродействием , a также  предоставить в распоряжения пользователя не только “ручной” способ игры, когда Вы руководите тем, каким должен быть следующий ход: вверх, вниз, влево и вправо, но и ряд алгоритмов с оптимальной стратегией (метода Монте-Карло, стратегий поиска по деревьям (Minimax, Expectimax) ), позволяющих АВТОМАТИЧЕСКИ выполнять ходы — вверх, вниз, влево и вправо — и добиться  плитки с числом 2048 и более (эти алгоритмы и называют алгоритмами “искусственного интеллекта” (ИИ)).  Необходимым элементом ИИ является алгоритм поиска, который позволяет смотреть вперед на возможные будущие позиции, прежде чем решить, какой ход он хочет сделать в текущей позиции. 

2048 — это очень известная игра, и мне не нужно было объяснять ChatGPT ее правила, он сам всё про неё знает. Кроме того, оказалось, что ChatGPT прекрасно осведомлен об ИИ алгоритмах для игры 2048, так что мне вообще не пришлось описывать ChatGPT контекст решаемой задачи. И он предлагал мне множество таких неординарных решений, которые мне пришлось бы долго выискивать в научных журналах.

Читать далее →

Лекция 15. Документо-ориентированная архитектура. CS193P Spring 2023.

Опубликовано автором

Ниже представлен небольшой фрагмент Лекции 15 Стэнфордского курса CS193P Весна 2023 «Разработка iOS приложений с помощью SwiftUI«.
Полный русскоязычный неавторизованный конспект Лекции 15 в формате Google Doc и в виде PDF-файла, который можно скачать и использовать offline, доступны здесь.
Код находится на GitHub.

С полным перечнем Лекций и Домашних Заданий на русском языке можно познакомиться здесь.

. . . . . . . . . . . . . .

DocumentGroup в демонстрационном примере

Вот так обычно выглядит наше приложение.

И куда нам двигаться дальше? 
Что ж, чтобы наше приложение перестало быть тем, чем оно является сейчас, давайте, кстати, посмотрим, на что наше приложение способно сейчас, пока еще не добавили поддержку документов.
Вот мое приложение, и я могу сказать: “Add another window” (“Добавить еще одно окно”), чтобы получить красивое фоновое изображение. Можно добавить сюда еще эмодзи (смайлики). 
Я  еще раз могу сказать: “Add another window” и посмотрите, что произойдет, если я кликну на  иконке нашего приложения.
Я получаю второй Emoji Art.
Итак, теперь у меня фактически есть два окна, смотрящих на один и тот же документ. Вы видите здесь два документа. Это то же самое. И у обоих есть “грузовик” 🚚. 

Это потому, что оба этих окна смотрят на один и тот же @StateObject.

Это документ EmojiArt по умолчанию — defaultDocument. Поскольку они видят одну и ту же ViewModel, они показывают вам один и тот же документ.
У каждого из них есть собственное масштабирование zoom и смещение pan, поскольку это отдельные View, они немного отличаются, но оба они просматривают один и тот же документ.
Так что это в некотором смысле довольно удобно, что вы можете иметь несколько окон, просматривающих один и тот же документ, но это не так удобно, как иметь возможность просматривать множество документов.
Итак, первое, что мы собираемся сделать, это заменить WindowGroup на DocumentGroup. Это то, что лежит в основе поведения всех документов.
И вы помните, что у DocumentGroup был аргумент config, который является его конфигурацией.
И вместо того, чтобы использовать наш документ по умолчанию defaultDocument, который у нас есть, мы просто возьмем нашу ViewModel из этой конфигурации — config.document:

Читать далее →