Браузер, отображающий приложение как слишком большое, Flex Flash - PullRequest
7 голосов
/ 18 марта 2012

Я создаю сайт с помощью Flash Builder.Я построил галерею с миниатюрами, которые прокручиваются по горизонтали вдоль дна, а при выборе показывают заголовок и полноразмерное изображение.

Проблема, с которой я сталкиваюсь, заключается в том, что она работает и отлично смотрится на моем компьютере, во всех разрешениях и FF, IE и Chrome - однако на компьютере моего друга все приложение слишком велико для его браузера, поэтомувсе, что он видит, это заголовок, изображение и самый верх горизонтальной полосы прокрутки.

Как уменьшить размер дисплея на своем компьютере и как определить, что вызывает несоответствие?Ширина и высота приложения установлены на 100%, поэтому я действительно не знаю, почему это происходит.

Спасибо за любую помощь и совет!

РЕДАКТИРОВАТЬ

Можно ли как-то проверить размер экрана, на котором он будет отображаться, и соответствующим образом отрегулировать высоту / ширину приложения?Я больше привык к Flex для мобильных устройств, а не к браузерам ...

Интересно, что когда я установил высоту приложения = "80%", это еще больше усугубило проблему на его компьютерах ... что нелогично, потому чтодолжно было сделать приложение меньше и больше соответствовать его экрану - поможет ли снимок экрана?

NEWEST EDIT

Хорошо - на его компьютерах оно выглядит как приложениеего размер изменяется до размера его монитора, а не до области, доступной в его браузере (пространство монитора за вычетом панелей инструментов), но с помощью MY Computers он настраивается автоматически, если я изменяю размер браузера ---> Как я могу исправить это?

HTML EMBED CODE:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

This application was built using Adobe Flex, an open source framework
for building rich Internet applications that get delivered via the
Flash Player or to desktops via Adobe AIR. 

Learn more about Flex at http://flex.org 
// -->
<head>
    <title></title>
    <meta name="google" value="notranslate" />         
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- Include CSS to eliminate any default margins/padding and set the height of the html element and 
         the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as 
         the percentage of the height of its parent container, which has to be set explicitly.  Fix for
         Firefox 3.6 focus border issues.  Initially, don't display flashContent div so it won't show 
         if JavaScript disabled.
    -->
    <style type="text/css" media="screen"> 
        html, body  { height:100%; }
        body { margin:0; padding:0; overflow:auto; text-align:center; 
               background-color: #000000; }   
        object:focus { outline:none; }
        #flashContent { display:none; }
    </style>

    <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
    <!-- BEGIN Browser History required section -->
    <link rel="stylesheet" type="text/css" href="history/history.css" />
    <script type="text/javascript" src="history/history.js"></script>
    <!-- END Browser History required section -->  

    <script type="text/javascript" src="swfobject.js"></script>
    <script type="text/javascript">
        // For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. 
        var swfVersionStr = "11.1.0";
        // To use express install, set to playerProductInstall.swf, otherwise the empty string. 
        var xiSwfUrlStr = "playerProductInstall.swf";
        var flashvars = {};
        var params = {};
        params.quality = "high";
        params.bgcolor = "#000000";
        params.allowscriptaccess = "sameDomain";
        params.allowfullscreen = "true";
        var attributes = {};
        attributes.id = "PhotoGallery";
        attributes.name = "PhotoGallery";
        attributes.align = "middle";
        swfobject.embedSWF(
            "PhotoGallery.swf", "flashContent", 
            "100%", "100%", 
            swfVersionStr, xiSwfUrlStr, 
            flashvars, params, attributes);
        // JavaScript enabled so display the flashContent div in case it is not replaced with a swf object.
        swfobject.createCSS("#flashContent", "display:block;text-align:left;");
    </script>
</head>
<body>
    <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough 
         JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show
         when JavaScript is disabled.
    -->
    <div id="flashContent">
        <p>
            To view this page ensure that Adobe Flash Player version 
            11.1.0 or greater is installed. 
        </p>
        <script type="text/javascript"> 
            var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); 
            document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" 
                            + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); 
        </script> 
    </div>

    <noscript>
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="PhotoGallery">
            <param name="movie" value="PhotoGallery.swf" />
            <param name="quality" value="high" />
            <param name="bgcolor" value="#000000" />
            <param name="allowScriptAccess" value="sameDomain" />
            <param name="allowFullScreen" value="true" />
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="PhotoGallery.swf" width="100%" height="100%">
                <param name="quality" value="high" />
                <param name="bgcolor" value="#000000" />
                <param name="allowScriptAccess" value="sameDomain" />
                <param name="allowFullScreen" value="true" />
            <!--<![endif]-->
            <!--[if gte IE 6]>-->
                <p> 
                    Either scripts and active content are not permitted to run or Adobe Flash Player version
                    11.1.0 or greater is not installed.
                </p>
            <!--<![endif]-->
                <a href="http://www.adobe.com/go/getflashplayer">
                    <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
                </a>
            <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
        </object>
    </noscript>     

* Последнее редактирование - март 27 *

Я еще не нашел причину этой проблемы, и если / когда я это сделаю, я обновлю этот пост.Между тем, похоже, что лучшим решением является использование кода для автоматической настройки пространства монитора / экрана - davidethell предоставил хороший пример такого кода.

Спасибо всем за помощь!

Ответы [ 2 ]

1 голос
/ 27 марта 2012

В подобных ситуациях нам приходилось уменьшать масштаб всего приложения, если доступная ширина или высота браузера ниже определенного порога.Приложение не всегда хорошо выглядит в уменьшенном виде, но если необходимо избегать полос прокрутки, у вас нет особого выбора.Вот код, который мы используем в настоящее время:

if ( stage.stageWidth < this.minWidth || stage.stageHeight < this.minHeight ) {
    var widthDiff : Number = stage.stageWidth / this.minWidth;
    var heightDiff : Number = stage.stageHeight / this.minHeight;
    var rescalePercent : Number = ( heightDiff < widthDiff ) ? heightDiff : widthDiff;
    this.scaleX = rescalePercent * 0.8;
    this.scaleY = rescalePercent * 0.8;
}

Этот код находится в функции в основном файле mxml приложения и вызывается в обработчике завершения приложения.Мы просто устанавливаем приложение minWidth и minHeight в соответствии с нашими минимальными требованиями и проверяем размеры сцены.Затем мы изменяем масштаб в зависимости от того, какое соотношение было более подходящим (высота или ширина).

Надеюсь, это поможет.

1 голос
/ 22 марта 2012

Вы можете прослушать JavaScript событие изменения размера , а затем вызвать функцию гибкого изменения размера, используя ExternalInterface . Если вы хотите узнать, какой у вас размер монитора, вы можете просто найти его в классе Capabilities . Также подумайте о прочтении этой статьи об атрибутах flash в пространственно необязательном атрибуте scale.

Надеюсь, это помогло. Удачи.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...