Реклама показывается только незарегистрированным пользователям. Вход или Регистрация

Подводные грабли разработки приложений для SmartTV

Программирование для webOS, инструменты разработки, документация, обмен опытом

Подводные грабли разработки приложений для SmartTV

Сообщение comrat » 19 сен 2018, 23:11

Подводные грабли разработки приложений для SmartTV




Примечание
Данная статья является по сути копией соответствующей статьи на хабре и публикуется самим автором оригинальной статьи. В данной статье описывается полезный инструмент для разработки для SmartTV в целом и для webOS в частности.

Вступление
Привет, webOS Forum!
Уже давно была идея написать статью о проблемах SmartTV разработки, но по ходу погружения в эту область, мы изобрели свой велосипед, который помогал нам эти проблемы решать. Поэтому, в данной статье, мы не только осветим некоторые проблемные моменты SmartTV разработки, но и расскажем о том как их решить с помощью нового фреймворка PureQML.

Зоопарк
Начнем с того, что в природе существует множество SmartTV платформ и многие из них заточены для запуска web приложений. Отсюда может появиться иллюзия, что достаточно один раз написать код и использовать его на всех платформах. Но на деле все платформы имеют некоторые отличия, которые приходится учитывать. Среди таких особенностей можно выделить следующие:

  • Обработка нажатий кнопок дистанционного пульта. Не все производители используют одинаковые кейкоды для одних и тех же кнопок пульта. В качестве примера, можно сравнить кей коды для платформы orsay и webos. Для tizen же надо явно регистрировать некоторые кнопки для дальнейшего использования.
  • Видеоплеер. Во многих платформах поддерживается html5 video плеер, но, к примеру, для tizen используется AVPlay, а для orsay используется собственное API для работы с нативным плеером.
  • Информация о девайсе. Получение информации об устройстве в каждой платформе также реализовано по разному, в NetCast создается специальный объект со особым id-шником, в других случаях используются специфические для каждой платформы методы.
  • Фокус.SmartTV приложение в первую очередь ориентировано на управление пультом, а следовательно UI/UX должны быть реализованы с учетом использования навигационных кнопок: вверх, вниз, вправо, влево, ОК и назад, при этом важно не терять фокус и явно обозначать, где он сейчас находится.

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

Установка
Опять же из-за многообразия платформ, процесс установки приложений на сами устройства для отладки также отличается. К примеру, для AndroidTV можно воспользоваться adb, на tizen есть свой аналог - sdb, для webOS специальные CLI скрипты и т. д. Каждый из этих инструментов нужно устанавливать и настраивать. Сюда же можно добавить проблему интенсивного обновления платформ, с сопутствующим обновлением SDK и IDE. В качестве примера такой проблемы можно привести случай с Tizen Studio. Скачав самую последнюю версию, вы сможете устанавливать приложения только на телевизоры TV-samsung tv4, при этом нет простого способа установить приложение на более ранние версии телевизоров, коих в природе сейчас значительно больше (если вдруг столкнулись с этой проблемой см. ссылку) и даже после успешного танца с бубном, IDE теряет возможность устанавливать приложения на телевизоры TV-samsung tv4 ¯\_ (ツ) _/¯

Модерация
Для публикации приложения необходимо пройти модерацию у соответствующего производителя, и у каждого из них свои правила и особенности. В данном случае необходимо набраться терпения, т. к. приложения могут держать на проверке не одну неделю и это следует учитывать при планировании сроков, т. е. приложение нужно публикова заблаговременно до релиза (если вдруг переживаете, что приложения появится раньше каких-либо маркетинговых мероприятий - не бойтесь, при отправке на модерацию есть пункт, в котором вы можете указать дату, раньше которой публиковать приложение не будут).
Также надо быть готовым к тому, что причиной отказа может оказаться любая мелочь, например, ошибочный ответ в self чеклисте (список вопросов, на которые должен ответить разработчик перед отправкой приложения, например: “содержит ли Ваше приложение вирусы” и т. п.) или из-за недопонимания в описании UX приложения. Может дойти и до курьезных ситуаций, например, был случай, когда завернули приложение со стримингом телеканалов, из-за того, что приняли бегущую строку в эфире одного из каналов за артефакт графики, приняв ее за часть OSD.

AndroidTV & tvOS
Отдельно стоит отметить AndroidTV и tvOS, т. к. эти платформы не поддерживают явный запуск web приложений. Для tvOS используется собственный xml-подобный язык: TVML, и что особенно интересно, на этом языке можно верстать, но только в рамках определенного набора шаблонов, сделать что-то совсем произвольное довольно непросто. С помощью таких ограничений все приложения для tvOS вынуждено придерживаются единого style-гайда и если от него далеко не отходить, то процесс написания приложения будет прост.
На андройде ситуация получше, т. к. есть способы запускать web приложения, про один из них расскажем чуть ниже.

Как мы делаем это
Столкнувшись с реальностью, сперва изучили существующие решения, но к сожалению ничего универсального и удобного не приглянулось: смартбокс неудобный, реакт не решает специфических тв проблем, как, собственно, и другие фреймворки, которые больше ориентированы на web.
Теперь рассмотрим, как с этим справляется PureQML (про который мы уже как-то писали тут и тут). Вкратце это js-фреймворк, который позволяет декларативно описывать UI на qml-like языке, что помогает быстро создавать приложения абстрагируясь от html, css и прочего. Для решения конкретно SmartTV проблем был написан отдельный модуль qmlcore-tv под лицензией CC-BY-4.0, который поддерживает следующие платформы:

  • LG webOS
  • LG NetCast
  • Samsung Tizen
  • Samsung Orsay
  • Opera TV
  • Hisense
  • AndroidTV
И вот как он решает вышеперечисленные проблемы:

  • Обработка кнопок пульта. Для поддерживаемых платформ реализован маппинг кейкодов и в клиентском коде достаточно просто написать нужный обработчик, например, для красной функциональной кнопки пульта можно написать обработчик:
    Код: Выделить всё
    onRedPressed { /* код обработчика */ }
  • Видеоплеер. Для работы с плеером есть специальная компонента VideoPlayer, которая описывает интерфейс для работы с видео, а платформенная реализация выбирается для целевой платформы на этапе сборки. Ниже приведен пример использования: проигрывание зацикленного видео по ссылке на весь экран:
    Код: Выделить всё
       VideoPlayer {
          width: 100%;
          height: 100%;
          autoPlay: true;
          source: "http://media.w3.org/2010/05/bunny/movie.mp4";
       }
  • Информация о девайсе. Для того чтобы получить сведения об устройстве достаточно использовать контрол Device, по аналогии с плеером он описывает интерфейс, а реализация берется для собираемой платформы. Ниже приведен пример кода для отображения текста с ID устройства на экране:
    Код: Выделить всё
       Device { id: device; }

       Text {
          text: “DeviceID: ” + device.deviceId;
       }
  • Фокус. Тут уже помогает базовая особенность самого фреймворка, то что в один момент времени существует только один единственный фокус, который есть и никуда не исчезает. Для работы с фокусом можно использовать декларативные свойства:
    focus - булевый флаг, указывающий, что данный элемент фокусабелен или нет
    activeFocus - булевый флаг, который принимает значение true, когда данный элемент содержит фокус, и false в противном случае
    И в рантайме у каждого элемента есть метод setFocus (), который явно передает фокус данному элементу.
  • Установка. Для удобной установки PureQML приложений на ТВ можно воспользоваться скриптом smart-tv-deployer, достаточно склонить его в корень PureQML проекта. Чтобы собрать проект, скажем, для webos телевизора с именем “myTV” (только перед этим необходимо настроить ТВ, подробнее про настройку webOS телевизора смотри тут), нужно вызвать команду:
    Код: Выделить всё
    ./smart-tv-deployer/build -p webos -t myTV
  • AndroidTV. Тут как и для андройда, нативный язык - java, и для того, чтобы портировать web приложение туда мы воспользовались проектом cordova. Этот фреймворк позволяет сгенерировать android приложение с WebView, в котором запускается уже само web приложение. Также, сейчас ведутся активные работы по трансляции PureQML кода в натив.

Пример
В качестве примера, покажем как портировать приложение из статьи на SmartTV.
Как мы уже упоминали выше, UX на ТВ отличается от десктопного браузера и в код придется добавить некоторые правки для поддержки работы с кнопками пульта:
Код: Выделить всё
   onSelectPressed: { osd.toggleActive () }

   onBackPressed: {
      if (osd.active)
         osd.toggleActive ()
      else
         _globals.closeApp ()
   }

В данном коде добавили обработку нажатия кнопок "Select" и "Back", при нажатии первой включаем/выключаем OSD (тот, что с картой и точкой местоположения станции) при нажатии "Back", если открыт OSD закрываем его, если он закрыт, то закрываем само приложение.
Конечный результат можно увидеть на видео:


Заключение
В итоге PureQML неплохо показал себя в качестве инструмента для разработки SmartTV приложений, мы и сами интенсивно пользуемся им для этих целей.
Если у вас появились вопросы или хотите больше статей про SmartTV разработку или PureQML - пишите в комментариях или на телеграм канал, постараемся на все ответить.
Спасибо за внимание! =)

Ссылки
Сайт проекта
Страница на github
Исходники earth-online
Телеграмм канал поддержки
comrat

 
Сообщения: 1
Зарегистрирован: 19 сен 2018, 22:46
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.

Подводные грабли разработки приложений для SmartTV

Спонсор » 19 сен 2018, 23:12

Реклама показывается только незарегистрированным пользователям. Войти или Зарегистрироваться
Спонсор

 
Сообщения: 100
Зарегистрирован: 15 июл 2014, 19:43
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.

Re: Подводные грабли разработки приложений для SmartTV

Сообщение Копипаста » 13 окт 2019, 14:05

Вопросы и ответы с официального форума поддержки разработчиков для LG webOS https://developer.lge.com

В: Есть ли способ заставить приложение webos запускаться при запуске ОС или в определенное время?
О: В настоящее время API-интерфейсы для автоматического запуска приложения при включении тв или назначенном времени отсутствуют.

В: Я продавец и разработчик в области LG webOS TV. Я одобрил приложение LG TV, и я загрузил обновленную версию приложения. Но все же, состояние приложения - обработка QA ... Я хочу загрузить обновленное другое приложение для QA Test.
Но я ничего не могу, потому что приложение сейчас находится в состоянии обработки QA Test. Поэтому я хочу знать, когда я смогу получить результат QA и что мне нужно сделать, чтобы как можно скорее одобрить новое приложение.
О: По вопросам подачи телевизионных приложений, пожалуйста, свяжитесь с LG Apps TV Seller Lounge (http://seller.lgappstv.com/). Они отвечают за процесс.

В: У меня проблема: когда я захожу в свою учетную запись разработчика и включаю режим разработчика, он говорит, что сеанс продлится 50 часов. На следующий день, когда я прихожу в офис (читай: примерно через 16 часов), меня приветствует экран входа в режим разработчика. Почему приложение «Developrer Mode» всегда, всегда, слишком рано выходит из системы? Я серьезно расстроен необходимостью входить в систему и переустанавливать мое приложение dev каждый день, и не в последнюю очередь, потому что другие люди также нуждаются в приложении, но они не могут установить его, поэтому, если я не в офисе, чтобы войти в Режим разработчика и переустановка приложения, никто не может ничего с ним сделать.
О: Режим разработчика отключается, когда:
1) Вы нажимаете кнопку выключения приложения Режим разработчика.
2) Вы получаете обновление TV S/W и выключаете и включаете телевизор.
3) Время сеанса истекло.
4) Быстрый запуск + выключен, и телевизор включается и выключается более 10 раз без сети.
 
В: Есть ли способы встроить видео с YouTube в приложение на базе HTML? и не дать перейти на ссылки на YouTube ... как смотреть позже ... смотреть на YouTube и т.д.? Или как запустить Youtube-клиент с указанным идентификатором видео, чтобы воспроизвести его там?
О: Вы можете воспроизвести видео с YouTube, скопировав и вставив исходный код видео в приложение, как показано ниже.
<iframe width = "1280" height = "720" src = "https://www.youtube.com/embed/R-QA_6Aq31k" frameborder = "0" allowfullscreen> </ iframe> 
Дополнительную информацию см. на странице https://developers.google.com/youtube/i ... _reference.

В: Можно ли получить информацию и установить субтитры и звуковые дорожки, которые встроены (не в манифест) в поток, в конце концов, какие потоки поддерживаются для этого? Можно ли загрузить одновременно один из других субтитров и один из других аудио (например, по умолчанию это английские аудио и чешские субтитры, и я хочу загрузить чешскую звуковую дорожку с немецкими субтитрами)?
О: К сожалению, в webOS TV отсутствуют API для выбора / переключения звуковой дорожки. И только внешние субтитры (WebVTT) поддерживаются. (См. Поддерживаемые форматы медиа и DRM.)

В: Есть ли способ предотвратить активацию скринсейвера Smart TV LG webOS через определенное время?
Или же можно ли программно деактивировать скринсейвер или имитировать виртуальный элемент управления, который не позволяет отображать его?
О: К сожалению, API для скринсейвера не предоставляются, Вы не можете изменить его из своего приложения. Для пользователей есть опция «Заставка» в меню «Настройки»> «Основные»> «Вкл.

В: Я заинтересован в создании медиа-браузера. Я просматривал API, чтобы узнать, есть ли API, чтобы открыть встроенное приложение Фото и Видео с параметрами для начала воспроизведения видео. Я нашел API запуска в диспетчере приложений: это можно использовать для этой цели? Если нет, то каков рекомендуемый способ начать воспроизведение видео из SMB или UPnP / DLNA в приложении с поддержкой субтитров и т.д.?
О: A1) В настоящее время вы можете запустить другое приложение на телевизоре только при ограниченных условиях.
Для API диспетчера приложений необходим идентификатор приложения целевого приложения. Поскольку идентификатор приложения, как правило, не является общедоступным, вы можете использовать его только для своих приложений или приложений сотрудничества.
A2) UPnP, DLNA не предоставляются с SDK LG. В настоящее время только Connect SDK поддерживает подключение к внешнему устройству.
Копипаста

 
Сообщения: 540
Зарегистрирован: 08 янв 2017, 21:44
Благодарил (а): 11 раз.
Поблагодарили: 52 раз.
Телевизор: LG


Вернуться в Разработка и создание программ для LG webOS



 


  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 0