`
yiminghe
  • 浏览: 1460469 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Ext 一个聊天窗口的设计

阅读更多

1.关键是要  弹性设计,自动适应浏览器

 

部件要:


height:auto  = autoHeight:true

width:auto   = autoWidth:true


父容器要:


overflow:auto  = autoScroll : true

 

 

2. HtmlEditor 对于 ctr-enter 感应 特殊处理 ,因为他是套在一个  iframe 里的

 

 

//event for source editing mode
   new Ext.KeyMap(Ext.getCmp("htmleditor").getEl(), [
   {
        key: 13,
        ctrl:true,
        stopEvent :true,
        fn: send
    }
]);
    
    
     //event for normal mode
Ext.getCmp("htmleditor").onEditorEvent = function(e){
   this.updateToolbar();
   var keyCode = (document.layers) ? keyStroke.which : e.keyCode;
   if (keyCode == 13 && e.ctrlKey) send(); //it'a my handler
}

 

 

示例代码:

放在 example/layout/chat.html

 

  • 大小: 38.4 KB
分享到:
评论
1 楼 zqb666kkk 2012-01-05  
能否把界面代码完整的给我 最近做项目正好做到 聊天这块

相关推荐

    Ext Jsp 聊天室 jschat

    - **Ext Panel**:作为聊天室的基础容器,用于承载聊天窗口和控制面板。 - **Ext Grid**:可能用于显示聊天记录,每一行代表一条消息,包含发送者、时间戳和消息内容。 - **Ext Form**:用于用户输入消息,包括...

    JSP+EXT超强仿QQ聊天系统 WEBQQ

    在“JSP+EXT超强仿QQ聊天系统”中,EXT的组件如表格、窗口、按钮、表单等被用于构建聊天界面,提供好友列表、聊天窗口、消息发送等功能。EXT的AJAX技术则负责在后台与服务器进行异步通信,实现实时的消息传递。 ...

    使用Ext中的Ajax做的聊天室

    8. **界面设计**:虽然未使用Ext的UI工具,但基础的HTML和CSS仍然是必要的,用于创建聊天窗口、输入框和发送按钮等基本界面元素。 9. **实时刷新**:为了实现实时通信,可能需要使用定时器(如JavaScript的...

    这是一个用Extjs写的前端在线聊天模块,基于DWR实现!

    在给定的项目中,“这是一个用Extjs写的前端在线聊天模块”,我们可以推测这个聊天工具利用了ExtJS的组件化特性,创建了用户界面,如输入框、聊天窗口、联系人列表等。ExtJS的可扩展性和灵活性使得开发者能够创建...

    JSP+EXT超强仿QQ聊天系统 WebQQ

    【JSP+EXT超强仿QQ聊天系统 WebQQ】是一个基于Java技术栈的Web应用程序,旨在模仿QQ聊天系统的功能。这个项目结合了JSP(JavaServer Pages)和EXT库,为用户提供了一个直观、富交互性的界面。JSP是Java平台上的动态...

    Jabber Messenger(Ext Jame)聊天插件.zip

    接着,你可以利用Ext JS的组件模型,将聊天窗口和其他UI元素无缝地整合到你的网页布局中。 在实际应用中,可能还需要考虑用户体验优化,如实时推送通知、历史消息存储、离线消息同步、表情支持和文件传输等高级功能...

    基于Tomcat7、Java、Ext、WebSocket的聊天室

    在聊天室场景中,Ext可能被用来设计用户界面,包括输入框、聊天窗口、用户列表等组件。它提供了丰富的UI组件和数据绑定机制,使得开发者可以便捷地创建交互式和响应式的界面。此外,Ext可能还利用AJAX技术来与后端...

    EXT 聊天程序

    EXT聊天程序可能利用EXT的组件模型,如Grid、Panel、Form等,来实现聊天窗口、联系人列表、消息发送等功能。 EXT库的核心特点包括: 1. **组件化设计**:EXT采用组件化开发模式,每个UI元素都是一个独立的组件,...

    Ext Demo, Ext学习入门

    Ext Demo 是一个专门为初学者设计的 ExtJs 学习资源,它涵盖了 ExtJs 的基本概念、组件使用以及与其他技术如 Spring 和 Struts2 的集成。这个压缩包中的 ChatRoom 文件很可能是实现了一个简单的聊天室应用,以此来...

    ExtjS实现聊天功能

    我们可以利用这些组件设计出类似QQ的聊天界面,包括好友列表、聊天窗口和表情选择器。 2. **数据存储与显示**:使用`Ext.data.Store`来存储聊天记录,它可以与服务器进行数据同步,实现消息的历史记录加载。`Ext....

    Ext简介及应用案例 ppt

    Ext是一个强大的JavaScript库,特别设计用于构建富互联网应用程序(RIA)。它基于Ajax技术,提供丰富的用户界面组件和高度可定制的界面元素。Ext的核心特点包括遵循W3C标准,拥有庞大的组件模型,允许开发者创建复杂...

    基于TCP的网络聊天室的设计(一步一步教你CSocket网络编程)

    故我思考:客户端一定要知道服务器的一个端口,我假设它知道服务器UDP服务的端口,通过发广播给服务器的UDP服务套接字,然后等待该套接字发回服务器TCP聊天室服务的端口号,IP地址用...

    ext js 培训资料

    EXT JS是一个强大的JavaScript框架,专为构建富客户端Web应用程序设计,其核心在于提供丰富的组件库和优秀的用户体验。 **RIA技术与EXT JS** 1. **RIA(Rich Internet Applications)**是互联网应用的未来趋势,它...

    extjs网页聊天 仿qq

    设计一个聊天记录表,包含发送者、接收者、消息内容、发送时间等字段,方便查询和展示。 5. **群组聊天**:除了私聊,还可以扩展到群组聊天。这需要在数据库中增加群组表和群成员关系表,并在前端实现群组选择和...

    基于html5的简单聊天室

    - 设计UI界面:使用EXT4的组件和布局创建聊天窗口、用户列表和输入框。 - 实现WebSocket连接:建立服务器与客户端的实时通信通道。 - 处理用户交互:监听用户输入、发送消息、接收并显示新消息等事件。 - 数据...

    ext web qq

    2. JavaScript文件:用于实现动态交互功能,如键盘快捷键、聊天窗口的自动滚动、表情输入等。 3. CSS文件:定义了应用的样式,包括颜色、布局、字体等,使得界面看起来“相当漂亮”。 4. 图片资源:包括用户头像、...

    推技术实现的网页聊天

    3. **EXT**:EXT JS(现在称为Sencha EXTJS)是一个JavaScript库,提供了大量的UI组件,如表格、树形视图、面板、窗口等,用于创建复杂的、响应式的Web应用程序。在本项目中,EXT可能被用来创建聊天室的用户界面,...

    msn界面布局-EXTJS实现实例教程

    在这个MSN界面布局的EXTJS实现实例教程中,我们将学习如何使用EXTJS来设计一个类似MSN的即时通讯器界面。教程的核心在于利用EXTJS组件和布局来创建一个功能丰富的用户界面。 首先,我们要创建一个EXTJS的`Ext....

Global site tag (gtag.js) - Google Analytics