博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
解决flex4 分辨率自适应问题
阅读量:5295 次
发布时间:2019-06-14

本文共 2196 字,大约阅读时间需要 7 分钟。

首先是按照常规思维在app中设置

这样确实可以全屏,但是当屏幕缩放到小于1280*720时,浏览器并不会自动添加滚动条,所以网页超出屏幕大小的内容就看不到了。

为了解决不出现滚动条,在网上找到了答案,并成功解决

 

http://stackoverflow.com/questions/4259434/flex-4-sscroll
设置Application的height和width属性,不设置minHeight和minWidth,当
屏幕小于height和width时出现滚动条。
但是,这种方法可以实现滚动条,但是必须是设定height和width的固定
大小,也就是说当我的
屏幕大于这个设定的固定
大小时,浏览器重显示的
网页也只有width*height大,会出现空白区域,所以还是不能满足自
适应的要求。
 
最终的解决方案是:
 <http://wbgen.com/blog/flex4%E8%AE%A9%E6%B5%8F%E8%A7%88%E5%99%A8%E7%AA%97%E5%8F%A3%E5%B0%8F%E4%BA%8Eapplication%E5%A4%A7%E5%B0%8F%E6%97%B6%E5%87%BA%E7%8E%B0%E6%BB%9A%E5%8A%A8%E6%9D%A1>
在index.template.html文件(位于Flex项目文件中的html-template文件夹下)中添加js脚本,实现读取当前
屏幕
大小,判断获取的
屏幕width小于1280px时width取1280px,当大于时,width去获取的
屏幕width,height的设置方法也是这样。
 
var winWidth = 0;   var winHeight = 0;   function findDimensions()   {    //获取窗口宽度    if (window.innerWidth)    {     winWidth = window.innerWidth;    }    else if ((document.body) && (document.body.clientWidth))    {     winWidth = document.body.clientWidth; //获取窗口高度    }    if (window.innerHeight)    {     winHeight = window.innerHeight;    }    else if ((document.body) && (document.body.clientHeight))    {     winHeight = document.body.clientHeight;    }    //通过深入Document内部对body进行检测,获取窗口大小    if (document.documentElement  && document.documentElement.clientHeight && document.documentElement.clientWidth)    {    winHeight = document.documentElement.clientHeight;    winWidth = document.documentElement.clientWidth;    }         var cssSize = document.styleSheets[0].rules||document.styleSheets[0].cssRules;    if(winWidth < 1280)    {    cssSize[0].style.width = "1280px";    }    else    {    cssSize[0].style.width = "100%";    }       if(winHeight < 720)    {    cssSize[0].style.height = "720px";    }    else    {    cssSize[0].style.height = "100%";    }   }      window.onresize=findDimensions;        function pageInit() {      //调用函数,获取数值     findDimensions();   }

 

 
然后在Flex中App中设置
width="100%" height="100%"
这样即可实现自
适应的同时设定
网页的最小width和height。
在ie8中,“开发人员工具”中“脚本”中就可以看到这个index.template.html文件了,所以flex
网页最终也是以html形式存在,flex生成的swf
网页只是html中的一个object
为了确保万无一失,我将index.template.html中object的width和height都设成100%。

转载于:https://www.cnblogs.com/lost-1987/articles/3502321.html

你可能感兴趣的文章
C#更新程序设计
查看>>
解决升级系统导致的 curl: (48) An unknown option was passed in to libcurl
查看>>
Shell命令-内置命令及其它之watch、date
查看>>
Java Session 介绍;
查看>>
spoj TBATTLE 质因数分解+二分
查看>>
Django 模型层
查看>>
dedecms讲解-arc.listview.class.php分析,列表页展示
查看>>
Microsoft SQL Server Transact-SQL
查看>>
Extjs6 经典版 combo下拉框数据的使用及动态传参
查看>>
Java四种引用包括强引用,软引用,弱引用,虚引用
查看>>
【NodeJS】http-server.cmd
查看>>
研磨JavaScript系列(五):奇妙的对象
查看>>
面试题2
查看>>
selenium+java iframe定位
查看>>
P2P综述
查看>>
第五章 如何使用Burp Target
查看>>
Sprint阶段测试评分总结
查看>>
sqlite3经常使用命令&amp;语法
查看>>
[leetcode] 309. Best Time to Buy and Sell Stock with Cooldown(medium)
查看>>
linux下编译openjdk8
查看>>