Java与Flex学习笔记(20)---将flex页面嵌入到jsp页面中-阿里云开发者社区

开发者社区> 范大脚脚> 正文

Java与Flex学习笔记(20)---将flex页面嵌入到jsp页面中

简介:
+关注继续查看

 如果我们只需要用到Flex的一部分功能,例如播放器功能,我们可以单独把Flex页面嵌入到Jsp页面中。要想实现此功能,需要下载一个工程,将其覆盖在服务器根目录下即可。你可以在次下载:FlexModule_j2ee.zip

 

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

 

 

 

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

 

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

 

 

  1. <?xmlversionxmlversion="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文件,如下所示:

 

 

  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.声明引入标签,如<%@tagliburi="FlexTagLib"prefix="mm"%>。如果web.xml文件中没有添加

 

  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/4172645.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
5个超炫的页面滚动 JavaScript 插件
对于很多单页面网站来说,页面滚动(Page Scrolling)技术是十分常用的。页面滚动基本上可以分为两种,一种是通过浏览器的滚动条,另外一种是根据用户的操作自动滚动。在这篇文章中,我们将介绍5个javascript插件,可以帮你轻松的创建页面滚动效果,你也就不必在重复发明轮子了,专注你的网站设计就好。
487 0
《Servlet和JSP学习指南》一导读
自从Servlet面世以来,也开发出了许多基于Java的Web框架,以帮助程序员更迅速地编写Web应用程序。
1134 0
Netbeans配置Java SE嵌入式平台(树莓派)
  1.配置平台    来源:http://www.cnblogs.com/xiaobo-Linux/p/7955769.html 2. 选择远程     3. 填写信息 JRE 路径是树莓派上的路径:how? sudo update-alternatives --displ...
1189 0
Spring Security笔记:使用数据库进行用户认证(form login using database)
在前一节,学习了如何自定义登录页,但是用户名、密码仍然是配置在xml中的,这样显然太非主流,本节将学习如何把用户名/密码/角色存储在db中,通过db来实现用户认证 一、项目结构 与前面的示例相比,因为要连接db,所以多出了一个spring-database.
870 0
Spring Security笔记:使用BCrypt算法加密存储登录密码
在前一节使用数据库进行用户认证(form login using database)里,我们学习了如何把“登录帐号、密码”存储在db中,但是密码都是明文存储的,显然不太讲究。这一节将学习如何使用spring security3新加入的bcrypt算法,将登录加密存储到db中,并正常通过验证。
1614 0
从零开始学习jQuery (七) jQuery动画-让页面动起来!
原文:从零开始学习jQuery (七) jQuery动画-让页面动起来! 本系列文章导航 从零开始学习jQuery (一) 开天辟地入门篇 从零开始学习jQuery (二) 万能的选择器 从零开始学习jQuery (三) 管理jQuery包装集 从零开始学习jQuery (四) 使用...
917 0
+关注
3656
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《Nacos架构&原理》
立即下载
《看见新力量:二》电子书
立即下载
云上自动化运维(CloudOps)白皮书
立即下载