Перейти к содержанию
Fire Monkey от А до Я
  • 0

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


Yarpda

Вопрос

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

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

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

Ссылка на комментарий

Рекомендуемые сообщения

  • 0

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

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

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

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

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

Ссылка на комментарий
  • 0

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

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

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

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

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

Изменено пользователем #WAMACO
Ссылка на комментарий
  • 0

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

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

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

Ссылка на комментарий
  • 0

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

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

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

Изменено пользователем Yarpda
дополнил
Ссылка на комментарий
  • 0
4 минуты назад, Yarpda сказал:

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

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

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

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

Ссылка на комментарий
  • 0
1 минуту назад, #WAMACO сказал:

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

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

Ссылка на комментарий
  • 0
5 минут назад, Yarpda сказал:

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

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

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

Ссылка на комментарий
  • 0
2 минуты назад, Yarpda сказал:

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

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

Ссылка на комментарий
  • 0
6 минут назад, #WAMACO сказал:

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

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

Ссылка на комментарий
  • 0
7 минут назад, Barbanel сказал:

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

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

Изменено пользователем Yarpda
о
Ссылка на комментарий
  • 0
  • Администраторы

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

Ссылка на комментарий
  • 0

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

Screenshot_22.thumb.png.c94bd9a2e7a9c6b23ea9f0700b5a4ab2.png

TestWhatsNew.zip

Ссылка на комментарий
  • 0
33 минуты назад, Barbanel сказал:

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

 

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

Ссылка на комментарий

Присоединяйтесь к обсуждению

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

Гость
Ответить на вопрос...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

×
×
  • Создать...