Давайте создадим цифровые часы с помощью нового просмотра на холсте
Вы слышали о crontab? Нет, он не герой DC. Он существует с 1975 года, целую вечность. iOS раньше запускала crontab, хотя просматривая сообщения SO, он давно исчез. Конечно, он все еще присутствует в OS X, введите «crontab -l» под оболочкой, и вы получите ответ.
Но, возможно, еще не все потеряно, поскольку с iOS 15 Apple запустила новое представление, посвященное запуску заданий по расписанию, немного похожее на crontab. Я говорю «запустить работу», я имею в виду обновление обзора по расписанию. Теперь; Я должен признаться, что не совсем понимал, как мне следует использовать эту новую точку зрения. Я не был уверен, потому что у нас уже был планировщик в SwiftUI. Планировщик, который выглядит так.
let timer = Timer.publish(every: 0.5, on: .main, in: .common).autoconnect()
Планировщик, который вы можете поймать в своем коде и принудительно обновить вид. Обновление каждые 0,5 секунды в показанном случае.
.onReceive(timer) { _ in refresh += 1 }.id(refresh)
Я могу только предположить, что они решили создать представление, посвященное планированию, потому что оно соответствует единому источнику философии истины в SwiftUI. Единый источник для планирования всего кода, на который должно ссылаться ваше приложение. Присоединяйтесь ко мне в путешествии, чтобы узнать об этом новом представлении.
Начнем с самого простого TimelineView
, которое я могу построить.
Фрагмент кода, который выдаст это как результат.
Краткое
Я хочу превратить это в часы, цифровые часы с цифрами. Он должен показывать секунды, минуты и часы… не более того.
Для этого моей первоначальной идеей было проанализировать строку, которую я получил от TimelineView
, хотя вскоре у меня возникли сомнения, так как я был уверен, что она не выдержит хорошего возраста - кто знает, что Apple будет сообщать здесь по умолчанию в SwiftUI 4.0. Я решил, что лучшим решением будет использовать директиву onChange
, чтобы наблюдать за изменением этой строки. Вот мой первый фрагмент кода для часов:
Приведенный выше код генерирует очень простые цифровые часы, которые выглядят следующим образом:
Теперь, помимо того, что скучно; есть более серьезная проблема - небольшой джиттер, который вы видите при его изменении. Все зависит от ширины отображаемых чисел. Ширина числа 2, например, больше 1. Я пытался исправить это с помощью рамки, но это все равно не сработало.
Теперь, если вы посмотрите, как это работает, и немного подумайте о проблеме - имеет смысл сосредоточиться на исправлении одной цифры. Если мне удастся заставить работать однозначное число, значит, я в деле. Я также хотел воспользоваться возможностью, чтобы сделать часы более интересными, и вспомнил статью, которую я опубликовал много лет назад, эту. Я решил, что попробую использовать и здесь Rotation3DEffect. После нескольких попыток я получил этот код.
Правильная дорога с точки зрения анимации, менее скучная. Чистый результат выглядит так:
Но, как вы видите на этом анимированном GIF-изображении, у меня все еще есть мерцание. Конечно, я мог бы избавиться от границы, но если бы я поместил два из этих представлений рядом друг с другом, они бы спорили о пространстве, поскольку значения менялись. Меня все еще трясет.
Что мне нужно было сделать, так это использовать изображение. Идеальная возможность использовать другое новое представление в iOS 15, а именно Canvas.
Код, который я бы встроил в предыдущую структуру, которую я создал для текстовых объектов. Легкое обновление.
Я уверен, что вы согласны, это намного лучше. Я не только избавил дисплей от сбоев, но, как вы можете видеть, я начал экспериментировать с тем, как он пролистывает числа. В раскрывающемся списке секунд каждые десять секунд число увеличивается.
Затем я установил переключатель, чтобы выбрать различные виды 3D-эффектов в зависимости от того, какая цифра поворачивается. У тебя есть выбор.
Приведенный выше код представляет представление, которое я бы неоднократно называл в timelineView
фигурных скобках. С чистым результатом вы видите заголовок этой статьи. Признаюсь, я немного отредактировал его, чтобы вы могли видеть, как время течет быстрее, и я включил больше TimelineView
, чем показываю здесь, всего шесть.
Каждое представление синхронизировано со всеми остальными, выполняясь время от времени, которое имеет смысл. Первый просмотр считает до девяти, а затем снова обнуляется. Второй вид считает только до 5, а затем снова возвращается к нулю.
В общем, что подводит меня к концу этой статьи. Спасибо за прочтение.