Как создать эффект раскрытия, который не является круговым?

Android имеет красивую анимацию раскрытия (называемую "CircularReveal") в форме круга (ссылка здесь и здесь) .

Мне было интересно: можно ли сделать это и в других формах?

Например, покажите вид сверху вниз в форме прямоугольника как таковой:

XXX     XXX    XXX
...  => XXX => XXX
...     ...    XXX

Видео о том, как это выглядит, можно найти здесь. .

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

Кроме того, можно ли заставить такую ​​анимацию работать на предыдущих версиях Android, а не только на Lollipop?

Просто я видел историю поиска "Google Now Launcher" таким образом, и мне интересно, как сделать нечто подобное.


android circularreveal
person android developer    schedule 01.01.2015    source источник
comment
RevealAnimator реализован вызов собственных скрытых API. Достижение аналогичного визуального эффекта для других форм возможно, но, вероятно, с помощью других методов.   -  person matiash    schedule 05.01.2015
comment
@matiash Значит, награда была даром? Я надеялся, что будет обходной путь... Или, по крайней мере, что-то лучшее, чем то, что я делал раньше... Есть ли хотя бы круговая анимация для предыдущих версий Android?   -  person android developer    schedule 05.01.2015
comment
Не то, что я знаю, извините. Надеюсь, что ошибаюсь, хотя :)   -  person matiash    schedule 06.01.2015

Ответы (4)


arrow_upward
4
arrow_downward

Вы можете создать нового аниматора следующим образом: http://cogitolearning.co.uk/?p=1451 и определите свой собственный прямоугольный аниматор. Здесь ссылка на исходный код GitHub, опубликованный автором.

person asethi    schedule 09.01.2015
comment
Прохладно ! не могли бы вы опубликовать пример кода того, как использовать для примера, о котором я написал (чтобы открыть вид сверху вниз, например, занавес)? На самом деле, я помню, что видел нечто похожее на это, сделанное Роменом Гаем (здесь любопытно-creature.com/category/android ). Будет ли он хорошо работать с ListView? Используют ли они одну и ту же технику? - person android developer; 09.01.2015

arrow_upward
0
arrow_downward

Анимация истории поиска Google Now кажется мне простым переводом. Похоже, что верхняя панель поиска находится перед раскрывающимся списком истории. Я думаю, что, анимировав виды впереди (от вашего вида, который вы хотите раскрыть), вы получите раскрытие, которое ищете. См.: https://stackoverflow.com/a/19766034/2832027

person TTransmit    schedule 07.01.2015
comment
Итак, решение, которое я предложил для ImageView (здесь: stackoverflow.com/questions/19519921/ ) о так же, как они? - person android developer; 08.01.2015
comment
Конечный результат и лежащая в его основе стратегия те же, но с помощью стандартной анимации перевода API 1 этого можно достичь за 5-10% от количества строк кода. - person TTransmit; 08.01.2015
comment
Это не похоже на перевод анимации. он показывает все большую и большую область списка последних элементов. Может быть, вы могли бы показать пример кода, который демонстрирует это? Было бы еще лучше, если бы вы справились с появлением клавиатуры, хотя у меня уже есть решение для этого. - person android developer; 08.01.2015
comment
Я хотел проверить, что мы говорим об одной и той же анимации. Вы можете увидеть это на 0:14 в этом видео youtu.be/ma-DGvCajWM?t=14s . Если это то же самое, это просто выглядит так, как будто он переводится за линейный макет с серым фоном, на котором присутствует EditText для поиска. - person TTransmit; 08.01.2015
comment
Нет, это не то же самое. Может быть, это потому, что я пробовал Lollipop, или у вас старая версия приложения. Это происходит также в Google Now (не в лаунчере), когда вы начинаете что-то печатать. - person android developer; 08.01.2015
comment
Да это оно. Я написал возможное решение сейчас, но я не думаю, что это то, что делает Google. - person android developer; 08.01.2015

arrow_upward
0
arrow_downward

Единственное решение, которое я придумал, - это поместить представление в качестве второго слоя (поверх listView), идентичного фону, который имеет уменьшенную анимацию.

так что в макете XML:

<FrameLayout >
 <ListView/>
 <View/>  
</FrameLayout>

Это должно сработать, но это скорее обходной путь.

Также у него есть некоторые недостатки:

  1. другой слой означает больше перерисовки.
  2. может быть сложно, если у вас сложный фон.
  3. это, вероятно, не так приятно использовать, как настоящую анимацию раскрытия.
person android developer    schedule 08.01.2015
comment
Я думаю, так это делается. Если только у них нет нового аниматора. В старой версии фоновое изображение пролистывается до того, как появится новая версия, чтобы избежать перерисовки. Они также могут анимировать высоту ListView с помощью Transformation, чтобы избежать перерисовки. Поскольку это список, его можно прокручивать вниз, и он должен отображаться таким образом по мере увеличения высоты. - person TTransmit; 08.01.2015
comment
Либо так, либо сделали действительно кастомизированный вид. Я не думаю, что если они используют решение, которое я написал, они используют 2 анимации. одного достаточно, и после того, как это будет сделано, они могут удалить маскирующий вид (или оставить его, когда им нужно его изменить. - person android developer; 09.01.2015
comment
Google — огромная компания, Now — крупное приложение, и это очень заметная анимация. Они могли легко позволить кому-то потратить несколько часов на написание пользовательского аниматора, а затем потратить остаток недели на его оптимизацию. Зная, насколько серьезно эти компании относятся к дизайну, у них, вероятно, была команда разработчиков и дизайнеров, которые в течение нескольких месяцев тестировали сотни небольших вариаций. Кроме того, еще один способ избежать двойного рисования фона — сделать так, чтобы представления для каждой строки списка становились видимыми только после того, как они прошли нижнюю часть окна поиска. - person TTransmit; 09.01.2015
comment
На самом деле, теперь, когда я подумал об этом, вот образец, который может быть полезен: curious-creature.com/2012/12/13/ . Может быть, с некоторой работой это может быть полезно и в этом случае. - person android developer; 09.01.2015

arrow_upward
0
arrow_downward

Проверьте мой проект: https://github.com/mageRabbitStudios/coolandroidstuff/tree/master/MyCircularReveal_12_3_19

Там вы можете создать любую анимацию раскрытия, которую пожелаете. Это будет звучать сложно, но довольно просто. Я создал собственный ImageView, где я получаю доступ к свойству clipPath его холста. (Единственный способ, которым я нашел, чтобы изменить маску клипа представления, есть более простое решение, показанное в третьем ImageView, где я получаю доступ только к свойству clipBounds ImageView и при этом нет необходимости создавать пользовательский вид) я обновляю clipPath при каждом рисовании, которое вызывается только во время выполнения анимации с помощью AnimatorUpdateListener и с помощью ObjectAnimators и пользовательского Evaluator, мне удается создать анимацию от круга до прямоугольника :)

Преобразуйте его в Java, если вы не понимаете Kotlin

person Stanislav Kinzl    schedule 12.03.2019
comment
Хотя эта ссылка может ответить на вопрос, лучше включить сюда основные части ответа и предоставить ссылку для справки. Ответы, содержащие только ссылки, могут стать недействительными, если связанная страница изменится. Прочитайте это. - person Shanteshwar Inde; 12.03.2019