Как (или как бы) Apple сделать эту анимацию? - PullRequest
17 голосов
/ 22 ноября 2011

Что я пытаюсь сделать:

Нижние (и верхние) ячейки «сгруппированного стиля» UITableView имеют закругленные углы - как это используется по умолчанию во многих приложениях Apple iOS и других производителей. Иногда ячейки вставляются с помощью анимации, то есть:

[tableView insertRowsAtIndexPaths:[NSArray arrayWithObject:indexPath] withRowAnimation:UITableViewRowAnimationTop];

Теперь это работает нормально. За исключением: Когда ячейка вставлена ​​ниже нижней ячейки или над верхней ячейкой (для сгруппированной таблицы стилей) - кажется, что плавная анимация отсутствует.

1010 *
*

Проблема:

То, что я имею в виду, состоит в том, что углы верхних / нижних ячеек должны анимироваться от округленных до необоснованных (так как они больше не верхние / нижние) - и это происходит очень резко и в отличие от Apple.

Делает ли Apple когда-либо это в приложении - если да, то как они делают это плавно? Иначе, как это можно сделать правильно?

NB. Я знаю, что это довольно незначительная деталь, но я немного перфекционист ...!

Ответы [ 5 ]

6 голосов
/ 23 ноября 2011

Взгляните на приложение Weather, которое поставляется с iOS, на оборотной стороне, где вы настраиваете свои города, вы увидите таблицу, в которой размещены эти анимации. Как отмечает Марк Адамс, в iOS 5 есть перечисление для ОС, чтобы автоматически определять, какую анимацию следует использовать. Если вы хотите использовать таргетинг на pre-iOS5, то в методе делегата, который фиксирует удаление, вы должны определить, какая ячейка удаляется, основываясь на ее позиции в строке, если в ее 0 вы бы использовали UITableViewRowAnimationBottom, если это последняя строка, которую вы использовали бы UITableViewRowAnimationTop и если он находится где-то посередине, вы, вероятно, будете использовать UITableViewRowAnimationTop, чтобы группа перемещалась вверх с анимацией, хотя вы можете поиграть с этим.

3 голосов
/ 31 декабря 2011

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

Одним из способов сделать это может быть определение пользовательского UITableViewCell с CAShapeLayer в качестве фона. CAShapeLayer взят из кварцевых дорожек: см. http://developer.apple.com/library/IOS/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_paths/dq_paths.html#//apple_ref/doc/uid/TP30001066-CH211. Путь CAShapeLayer является анимируемым, но не с неявной анимацией. Вам нужно будет использовать CAPropertyAnimation или выполнить собственную интерполяцию. По моему опыту, например, в http://itunes.apple.com/us/app/blaster-through-asteroid-field/id414827482?mt=8, ваша собственная интерполяция быстрее и надежнее (но кроме интерполяции и обнаружения столкновений все, что в большинстве игр основано на кварцевом ядре, так что я не думаю, что вы есть проблемы с производительностью).

РЕЗЮМЕ: Пользовательская ячейка имеет подложку CAShapeLayer. CAShapeLayer имеет путь с 2 закругленными углами. Вы анимируете свойство пути, когда положение ячейки перемещается к определенной точке на экране. Готово, плавно анимированные скругленные углы. Дайте мне знать, если вы попробуете это :-)

Другие ссылки: http://developer.apple.com/library/IOS/#documentation/GraphicsImaging/Reference/CAShapeLayer_class/Reference/Reference.html#//apple_ref/doc/uid/TP40008314

http://developer.apple.com/library/IOS/#documentation/GraphicsImaging/Reference/CGPath/Reference/reference.html

1 голос
/ 31 декабря 2011

Поскольку в настоящее время нет реального (завершенного кода) ответа, вот список лучших обходных путей.

  1. Измените свой интерфейс, чтобы эта прерывистая анимация никогда не происходила.Это может означать использование простого стиля tableView в отличие от сгруппированного стиля или использование альтернативного стиля, видимого в приложении Weather (см. Ответ Криса Вагнера. Спасибо, Крис!).Это может даже означать использование совершенно другого интерфейса, который не включает эту анимацию - это было решение, к которому я стремился, мне удалось разработать UX-изменение, которое, возможно, даже лучше, чем оригинал.

  2. Разобраться с этим.Apple, кажется, в некоторых из менее используемых частей ОС или их приложений.

  3. Подайте отчет об ошибке на bugreport.apple.com.Было бы неплохо, если бы Apple исправила это ... Я знаю, что это довольно незначительная деталь, но именно поэтому мне нравятся продукты Apple - потому что они правильно понимают мелкие детали!

  4. Создание пользовательскихUITableViewCell подкласс.Я немного подумал об этом, и хотя это немного сложная задача для программирования, я думаю, что это выполнимо.Вот как это делается: РЕДАКТИРОВАТЬ: см. Ответ Раба для более подробной информации.Я еще не закодировал его, но могу попробовать, когда у меня будет время.

    • У пользовательской ячейки есть свойство, которое определяет, является ли ячейка вершиной,средняя или нижняя ячейка.Это можно установить с помощью UITableViewController (или подкласса и т. Д.).

    • Свойство backgroundView пользовательских ячеек может быть нарисовано пользователем с использованием кварца для закругленных углов и т. Д.

    • Всякий раз, когда свойство, определяющее положение ячейки, изменяется, изменение в backgroundView может быть анимировано.Тяжелая часть здесь - это анимация кривой углов ... это выполнимо?Apple, кажется, делает это в углах центра уведомлений, когда его
      опускают и толкают вверх - кажется, что это возможно.

    • Если кто-то серьезно хочет это сделатьи поместите код на gitHub ... вы были бы великолепны!И вы бы улучшили пользовательский интерфейс Apple;)

0 голосов
/ 29 декабря 2011

Если вы перейдете в раздел «Теги» раздела «Отправить на Youtube» приложения «Фото», вы увидите, что анимация яблок такая же «отрывистая», как и у нас. (очевидно, вам нужно видео для загрузки на YouTube)

Полагаю, это то, о чем вы думали ...

0 голосов
/ 28 декабря 2011

Вы пытались вставить две строки одновременно? Один сверху с нулевой высотой, а другой с закругленными углами (для этого можно использовать кварцевый сердечник)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...