Vkontakte приложение во всю высоту браузера

Vkontakte приложение во всю высоту браузера

Сообщение Nicloay 14 авг 2013, 08:48

Вобщем столкнулся с такой проблемой, приложение поддерживает любой размер, поэтому было бы логично его расположить во все доступное место. Вконтакт, в отличии от фейсбука, не шлет на прямую размер iframe -а в котором открывается приложение, поэтому приходится использовать костыль, но и получился заодно небольшой бонус в виде промотки к приложению.
Вот код который я использую
Код: Выделить всё
<head>
  ...
  <script src="http://vk.com/js/api/xd_connection.js?2"  type="text/javascript">
  </script>
  ...
  <script type="text/javascript">
        VK.init(function() {
            console.log("on vk init");
            VK.addCallback("onWindowResized", onWindowResized);

            function onWindowResized(width,height) {
                console.log("width hgeight = "+width+"x"+height);
                $("#unityPlayer").width( width);
                $("#unityPlayer").height(height);
            }
            VK.addCallback("onScrollTop",onScrollTop);
            function onScrollTop(width, height, winHeight){
                console.log("whwh="+width+"x"+height+"   "+winHeight);
                $("#unityPlayer").height(height);
                VK.callMethod("resizeWindow", 900, height);
                VK.callMethod("scrollWindow",winHeight,200);
            }

            VK.callMethod("scrollTop");
        });
  </script>
  ...
</head>


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

смысл всего этого, добавляем слушателя, который слушает не скролим ли мы окошко (потому как в этом методе передается важная для нас инфа - высота видимой области и высота шапки), после этого зовем скроллинг к самому верху. И уже там в методе получив нужные значения, ресайзим наш unityplayer, меняем высоту окошка и мотаем немножечко вниз, чтоб скрыть шапку.


далее. В юнити мы можем получить событие когда теряем и ловим фокус. в этот момент можно опять же позвать метод вконтакта (промотку в верх) на всякий случай, вдруг ктонибудь случайно мотнул страничку вниз, и приложение внось отцентрируется по вертикали (работает все это не сказать что сильно хорошо(из за проблемы неясности когда где фокус), но зато просто :) )
в юнити используем класс что то типа этого
Синтаксис:
Используется csharp
using UnityEngine;
using System.Collections;

public class FocusMonitorController : MonoBehaviour {

        void OnApplicationFocus(bool status){
#if UNITY_WEBPLAYER
                Application.ExternalCall("onApplictaionFocus");
#endif         
        }
       
        void OnApplicationPause(bool status){
#if UNITY_WEBPLAYER
                Application.ExternalCall("onApplictaionFocus");
#endif         
        }
}
 


а на страничку с плеером добавляем вот такой код
Код: Выделить всё
<head>
...
        function onApplictaionFocus(){
            VK.callMethod("scrollTop");
        }
...
</head>


посмотреть боевой вариант можно тут http://vk.com/appcolorus
If you wish to make an apple pie from scratch, you must first invent the universe.(Carl Sagan, Cosmos)
| My Asset Store | coloring book | github | _wiki.unity3d.com | twitter | linkedin |
Аватара пользователя
Nicloay
Адепт
 
Сообщения: 1288
Зарегистрирован: 31 май 2012, 09:27
Откуда: Альпс
  • Сайт

Вернуться в Tips & Tricks

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

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