Андроид. Обучение пользователя новым функциям приложения

[Yarpda]

В серьезных приложениях (Сбербанк-онлайн или Ютюб и т.п.) когда выходят обновления с новыми функциими, они запускают своеобразный интерактивный ролик. Когда экран затемняется и остается не затемненным только новый элемент экрана например, а на затемненном фоне описывается что делает этот новый элемент.Потом все это плавно переходит к другому элементу и т.д. Выглядит все довольно красиво.

Задался вопросом, как сделать что-то подобное под FMX. Для себя не нахожу никаких очевидных решений.
Подскажите если кто знает, направления решения этой задачи?

Заранее спасибо.

[Barbanel]

Тоже задумывался об этом, правильного ответа не знаю, но мысли есть:

Вариант 1
-сделать скриншот всего экрана (программно из дельфи, даже не экрана а формы)
-затенить весь скриншот, предположим на 40-50% (т.е. снизить интенсивность каждого пикселя)
-зная местоположение вашей кнопки с новой фичей, вырезать эту область из альфаканала скриншота (если делать круто - то вырез должен быть не прямоугольным а круглым, соотв. нужно както преобразовать прямоугольную кнопку в подходящих размеров круг)
-вывести этот скришнот поверх всех контролов формы, не забыть положить на скриншот текст с описанием фичи и кнопкой перехода к следующей фиче.

Вариант 2
-сделать скриншот всего экрана тупо чтобы знать его размеры
-залить черным цветом
-залить весь альфаканал на те же 40-50% (т.о. если вывести эту картинку поверх, она будет лишь затенять все что под ней)
-аналогично предыдущему пункту вырезать дырку в альфаканале
-аналогично предыдущему пункту вывести поверх формы

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

Также буду раз услышать другие варианты.

[#WAMACO]

1. Сделать скриншот формы.

2. Показать новую форму с фоном скриншота (слегка размыв скриншот)

3. На новой форме лепить что душе угодно, переходы и т.д.

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

это если изолированный ролик, как таковой. если нужны подсказки к контролам, то можно выводить кастомные toast-ы, например с помощью Layout и обычного Rectangle поверх.

Изменено 11 апреля, 2019 пользователем #WAMACO

[OnePeople]

1.Можно взять Rectangle, залить его с Alpha 70%. И поместить в него изображение.

2.Затем расчитать абсолютное положение контрола на форме, его размеры,сделать его скриншот.

3.Изображению задать соответствующие размеры, координаты и скриншот контрола, можно добавить свечение.

[Yarpda]

Ну идеи со скриншотами не хотелось бы рассматривать, а то можно дойти до идеи "делаем видео со всем и вставляем в приложение плеер".
Это не совсем то что хочется.

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

Вот был бы  в FMX графический компонент в виде бублика, т.е. с возможностью установки внешнего и внутреннего радиуса, вот с ним наверное было бы интересно попробовать, но к сожалению его нет. А как его сделать я совсем не знаю.

Изменено 11 апреля, 2019 пользователем Yarpda
дополнил

[#WAMACO]

4 минуты назад, Yarpda сказал:

Ну идеи со скриншотами не хотелось бы рассматривать, а то можно дойти до идеи "делаем видео со всем и вставляем в приложение плеер".
Это не совсем то что хочется.

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

Вот был бы  в FMX графический компонент в виде бублика, т.е. с возможностью установки внешнего и внутреннего радиуса, вот с ним наверное было бы интересно попробовать, но к сожалению его нет. А как его сделать я совсем не знаю.

ну так, все что выше написали, оформите, как компонент и будет счастье! заодно потом и с нами поделитесь! :))

[Barbanel]

Только что, #WAMACO сказал:

ну так, все что выше написали, оформите, как компонент и будет счастье!

Прям с языка сняли

[Yarpda]

1 минуту назад, #WAMACO сказал:

ну так, все что выше написали, оформите, как компонент и будет счастье! заодно потом и с нами поделитесь! :))

Так нет же бублика.... ((

[Barbanel]

Так руки же есть? Пишите)))
Или у вас лапки?)))

[#WAMACO]

5 минут назад, Yarpda сказал:

Так нет же бублика.... ((

не очень понял, что за "бублик"

2 круга имеется ввиду? так нарисовать можно на канвасе, что душе угодно! 

[Yarpda]

Только что, Barbanel сказал:

Так руки же есть? Пишите)))
Или у вас лапки?)))

В плане графики просто их нет... )

[#WAMACO]

2 минуты назад, Yarpda сказал:

В плане графики просто их нет... )

сверху написал рекомендацию - 2 круга, один диаметром по-больше, другой внутри - по-меньше...

[Barbanel]

6 минут назад, #WAMACO сказал:

Вот был бы  в FMX графический компонент в виде бублика, т.е. с возможностью установки внешнего и внутреннего радиуса,

Кстати есть. TCircle
Задайте ему размер и толщину Stroke и будет вам счастье)

[Yarpda]

7 минут назад, Barbanel сказал:

Кстати есть. TCircle
Задайте ему размер и толщину Stroke и будет вам счастье)

О! А это идея. сделал Stroke побольше, а Fill.kind убрал в ноль, и получился нужный мне бублик!
Вот видите, коллективный разум в очередной раз доказал свою эффективность.
Буду пробовать, спасибо!

Изменено 11 апреля, 2019 пользователем Yarpda
о

[Brovin Yaroslav]

Я бы не делал скриншот. А просто поместил поверх прозрачный TPaintBox. А в OnPaint просто вычислил область ,которую не надо закрашивать и просто закрасил paintBox кистью с прозрачностью с учетом выреза.

[Barbanel]

В аттаче пример того как я себе представляю такую реализацию. Будем использовать в нашем проекте.
Буду рад критике, предложениям, и все такое.

TestWhatsNew.zip

[Yarpda]

33 минуты назад, Barbanel сказал:

В аттаче пример того как я себе представляю такую реализацию. Будем использовать в нашем проекте.
Буду рад критике, предложениям, и все такое

 

Да, как раз что-то типа этого я и хотел. Возможно только с какой-то анимацией, но это и самому можно поиграться. Спасибо за пример, много времени сэкономлю!

[OnePeople]

Тоже свой вариант по быстрому накидал, как пример

WhatNew.rar