将flex页面嵌入到jsp页面中

简介:

      在eclipse下新建一个web工程,将刚才下载的工程解压缩,然后将webtier文件夹下的内容覆盖服务器根目录下,如本人的:

 

 

 

      注意要将lib文件夹和jars文件夹下的jar包添加到到类路径下,这样就算是整合完成了吧。

 

     接着新建一个flex的mxml文件PlayVideo.mxml,将其放在WebContent下,代码如下所示:

 

 

[html]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  layout="absolute"  
  3. creationComplete="init()">  
  4. <mx:Script>  
  5. <![CDATA[ 
  6.     import mx.controls.Alert; 
  7.     private var rtmpURL:String="rtmp://localhost/oflaDemo"; 
  8.     private var nc:NetConnection=new NetConnection(); 
  9.     private var playerVideo:Video=new Video(); 
  10.     [Bindable] 
  11.     private var stream:NetStream; 
  12.     private function init():void{ 
  13.        playerVideo.width = 500; 
  14.        playerVideo.height = 400; 
  15.        connect(); 
  16.     } 
  17.     private function connect():void{ 
  18.        nc.addEventListener(NetStatusEvent.NET_STATUS,netStatus); 
  19.        nc.connect(rtmpURL); 
  20.     } 
  21.     private function netStatus(e:NetStatusEvent):void{ 
  22.        trace(e.info.code); 
  23.        if(e.info.code=="NetConnection.Connect.Success"){ 
  24.            stream=new NetStream(nc); 
  25.            playerVideo.attachNetStream(stream); 
  26.            stream.play("chirisyu_ytywn.flv"); 
  27.            container.addChild(playerVideo); 
  28.        } 
  29.     } 
  30. ]]>  
  31. </mx:Script>  
  32.     <mx:UIComponent id="container"></mx:UIComponent>  
  33. </mx:Application>  



 

      这个文件实现的是之前用Red5播放视频的减缩版。

 

      接着新建一个jsp文件,如下所示:

 

 

[html]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
 
  1. <%@page language="java" contentType="text/html; charset=UTF-8"  
  2.     pageEncoding="UTF-8"%>  
  3. <%@taglib uri="FlexTagLib" prefix="mm" %>  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  5. <html>  
  6. <head>  
  7. <meta http-equiv="Content-Type"content="text/html; charset=UTF-8">  
  8. <title>测试</title>  
  9. <style type="text/css">  
  10.     #mess{  
  11.        position: absolute;  
  12.        left: 250px;  
  13.        top: 25px;  
  14.        font-size: 22px;  
  15.     }  
  16.     #video{  
  17.        position: absolute;  
  18.        left: 250px;  
  19.        top: 70px;  
  20.     }  
  21. </style>  
  22. </head>  
  23. <body>  
  24.     <div id="mess">  
  25.     这是测试视频:  
  26.     </div>  
  27.     <div id="video">  
  28.        <mm:mxml source="PlayVideo.mxml" width="500" height="400">  
  29.        </mm:mxml>  
  30.     </div>  
  31.      
  32. </body>  
  33. </html>  



 

    可以看出将mxml文件引入jsp需要做的事是:

 

    1.声明引入标签,如<%@taglib uri="FlexTagLib" prefix="mm"%>。如果web.xml文件中没有添加

 

[html]  view plain copy print ? 在CODE上查看代码片 派生到我的代码片
 
  1. <taglib>  
  2.         <taglib-uri>FlexTagLib</taglib-uri>  
  3.         <taglib-location>/WEB-INF/lib/flex-bootstrap-jsp.jar</taglib-location>  
  4. </taglib>  


,则会报错。

 

 

     2.在<mm:mxml/>标签中引入mxml文件,里面有一些属性,可以查看API,本人就不在此赘述了。

 

     好了,这样就可以测试了,运行jsp文件,如果成功运行则证明成功了:

 

 

    

       当然,这个mxml用的是flex 3文件,如果换成flex4的话会报错,因为目前使用的jar包不支持Flex4标签,不知道作者会不会更新。



本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/4172773.html,如需转载请自行联系原作者

相关文章
|
2月前
|
Java 应用服务中间件 开发工具
如何使用IDEA创建JSP页面
如何使用IDEA创建JSP页面
158 0
|
4月前
|
Java 数据安全/隐私保护
JavaBean组件<jsp:forward>动作<jsp:param>动作登录页面输入用户名和密码,然后进入检查页面判断是否符合要求,符合要求跳转到成功界面,不符合要求返回登录界面,显示错误信息。
该博客文章通过JavaBean组件和JSP动作元素`<jsp:forward>`与`<jsp:param>`的使用示例,演示了用户登录流程,包括登录信息的提交、验证以及根据验证结果进行的页面跳转。
JavaBean组件<jsp:forward>动作<jsp:param>动作登录页面输入用户名和密码,然后进入检查页面判断是否符合要求,符合要求跳转到成功界面,不符合要求返回登录界面,显示错误信息。
|
1月前
|
前端开发 UED 容器
在 CSS 中使用 Flex 布局实现页面自适应时需要注意什么?
【10月更文挑战第22天】在使用 Flex 布局实现页面自适应时,需要对其基本原理和特性有深入的理解,同时结合具体的布局需求和场景,进行细致的调整和优化。通过合理的设置和注意事项的把握,才能实现理想的自适应效果,提升用户体验。还可以根据实际情况进行更深入的探索和实践,以不断提升 Flex 布局的应用能力。
|
4月前
|
存储 Java
JSP中实现留言页面的编写并将留言信息展示出来
这篇文章介绍了如何在JSP中编写留言页面,并通过JavaBean类存储用户留言信息,同时展示了留言信息的展示方法。
JSP中实现留言页面的编写并将留言信息展示出来
|
4月前
|
缓存 Java 应用服务中间件
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
这篇文章详细介绍了在SpringMVC中创建JSP页面的全过程,包括项目的创建、配置、Tomcat的设置,以及如何实现页面跳转和配置模板解析器,最后还对比了JSP和HTML模板解析的差异。
SpringMVC入门到实战------七、SpringMVC创建JSP页面的详细过程+配置模板+实现页面跳转+配置Tomcat。JSP和HTML配置模板的差异对比(二)
|
4月前
|
Java
`<jsp:getProperty>`动作和`<jsp:setProperty>`动作的使用在一个静态页面填写图书的基本信息,页面信息提交给其他页面,并且在其页面显示。要去将表单元素的值赋值给Java
该博客文章讲解了JSP中`<jsp:getProperty>`和`<jsp:setProperty>`动作的使用方法,包括它们的语法格式和如何在页面中使用这些动作来获取和设置JavaBean对象的属性值,并通过图书信息的填写和展示示例进行了演示。
`<jsp:getProperty>`动作和`<jsp:setProperty>`动作的使用在一个静态页面填写图书的基本信息,页面信息提交给其他页面,并且在其页面显示。要去将表单元素的值赋值给Java
|
4月前
|
Java
编写一个jsp页面,利用Scriptlet编写一段计算代码,要求用零作为除数,并使用page指令将错误信息显示在另外一个jsp页面,产生的错误信息为“错误,不能用0做除数”
该文章展示了如何创建一个JSP页面,使用Scriptlet编写包含除零操作的计算代码,并配置page指令将错误信息重定向至另一个JSP页面进行显示。
编写一个jsp页面,利用Scriptlet编写一段计算代码,要求用零作为除数,并使用page指令将错误信息显示在另外一个jsp页面,产生的错误信息为“错误,不能用0做除数”
|
6月前
|
Java
杨校老师课堂之Html页面快速转为jsp页面之工具类【简直太简单好用】
杨校老师课堂之Html页面快速转为jsp页面之工具类【简直太简单好用】
32 0
|
3月前
|
开发者 容器
flex 布局属性在实际项目中的应用场景有哪些?
flex 布局属性在实际项目中的应用场景有哪些?
|
2月前
|
前端开发 UED 容器
使用 Flex 布局实现垂直居中效果
【10月更文挑战第7天】
163 57