面板由5部分组成一个顶部工具栏(tbar)、一个底部工具栏(bbar)、面板头部(header)、面板尾部(button)和主区域(body)
<HTML>
<HEAD>
<TITLE>使用EXT输出HelloWorld</TITLE>
<!-- 导入extjs配置 … ... -->
<link rel="stylesheet" type="text/css" href="./../ext/resources/css/ext-all.css"/>
<script type="text/javascript" src="./../ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./../ext/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL='./../ext/resources/images/default/s.gif';
var _panel = new Ext.Panel({
width: 500,
height: 400,
collapsible:true,//折叠
tools:[{id:'save',handler:function(){alert("save");}},{id:'print',handler:function(){window.print();}},{id:'refresh'}],
tbar:[{text: '保存'},"-",{text: '关闭'}],
bbar:[{text: '添加内容',handler:function(){
//_panel.add({id:'panel2', title: '面板二'});
//_panel.doLayout();
var p = _panel.getComponent(2);
alert(p.title);
}},{text: '删除内容',handler:function(){
_panel.remove("panel2");
}}],
title: '我的面板',
buttons:[{text:'确定'},{text: '取消'}],
buttonAlign: 'center',
//html: "<h1>这是面板的body区域</h1>",
//autoLoad: 'new.html'
items:[
new Ext.Button({text: '按钮一'}),{xtype: "button",text: '按钮二'},
{id:'panel3', title: '面板三',height: 200,bodyBody:false,border:true}
]
});
_panel.render("form");
});
</script>
</HEAD>
<body id="form">
</body>
</HTML>
分享到：
相关推荐
C# 高清打印，GC内部绘制，区域面板Panel打印，打印不失真
两个方法鼠标拖动改变面板panel大小，可限定面板的最小值和最大值
本主题聚焦于“panel面板的隐藏与收缩”技术，我们将探讨如何在Windows和QQ风格的界面中实现这一功能。 首先，让我们从基本的`Panel`组件开始。在.NET框架的Windows Forms或WPF中，`Panel`是一个容器控件，可以容纳...
LobiPanel是一款基于jQuery UI的Bootstrap Panel面板功能增强插件。通过该插件可以为Bootstrap的原生Panel面板增加编辑标题，最大化，最小化，面板拖动关闭面板等功能
1Panel 是一个现代化、开源的 Linux 服务器运维管理面板。1Panel 的功能和优势包括：快速建站：深度集成 Wordpress 和 Halo，域名绑定、SSL 证书配置等一键搞定。高效管理：通过 Web 端轻松管理 Linux 服务器，包括...
LobiPanel是一款基于jQuery UI的Bootstrap Panel面板功能增强插件。通过该插件可以为Bootstrap的原生Panel面板增加编辑标题，最大化，最小化，面板拖动关闭面板等功能。
"admin panel"，即后台管理面板，是网站或应用程序的核心组成部分，主要负责处理系统的管理和维护工作。它通常只对授权用户开放，用于监控、配置、更新以及管理网站内容和服务。以下是一些关于后台管理面板的重要...
在本讲中，我们将深入探讨jQuery Mobile中的一个重要组件——面板（Panel）。jQuery Mobile是一个轻量级、触控优化的框架，用于构建响应式移动Web应用。面板是jQuery Mobile提供的一种可滑动或折叠的区域，通常用作...
EXT dojochina 面板示例Ext.Panel.rar EXT dojochina 面板示例Ext.Panel.rar
Grafana_Status_panel, 一次，Grafana的面板插件可以监控多个参数 Grafana状态面板这是一个插件，用来作为组件状态的集中视图。 它非常类似于单状态面板，但是它可以保存来自同一数据源的多个值。 每个值都可以用于...
本文将深入讲解如何在Java程序中卸载JPanel面板，以及相关的重要知识点。 首先，理解JPanel的基本概念。JPanel是JComponent的子类，提供了容器的功能，可以容纳其他的Swing组件，如按钮、文本框等。在Java Swing中...
下面将详细介绍Panel组件的加载方式、属性列表、事件列表和方法列表。 一、加载方式 Panel组件可以通过两种方式加载：class加载方式和JS加载方式。 1. Class加载方式：在HTML标签中添加easyui-panel类，并设置...
操作系统 面板
通过以上介绍，我们了解了jQuery Easy UI面板布局的基本使用和特性。在实际开发中，结合具体的业务需求，我们可以灵活运用这些知识点，构建出高效、美观的Web界面。在提供的"panel代码"中，你可以找到更多关于如何在...
NVIDIA Control Panel是一款由NVIDIA...总的来说，NVIDIA Control Panel离线包是一个解决驱动安装后缺失控制面板问题的重要工具，它使得用户无需通过网络即可获得完整的显卡管理功能，从而充分利用NVIDIA显卡的潜力。
新建亮度通道蒙版，并且支持对通道查看 删除高亮通道蒙版、新建高光区域通道蒙版 删除高光区域通道蒙版、新建暗部区域通道蒙版 删除暗部区域通道蒙版、新建中间调区域通道蒙版 删除之间调区域通道蒙版、加深、减淡50...
动态Panel组件是软件开发中的一种常见控件，主要用于在用户界面上创建可变或交互式的内容区域。在本文中，我们将深入探讨动态Panel组件的概念、功能、应用场景以及如何在不同的编程环境中实现它。 1. 动态Panel组件...
在Panel上添加button，可以通过面板设计工具箱中的“Button”控件拖放到设计区域。你可以调整button的大小、位置、文字内容和图标。CANAPE支持自定义图标，使得UI更具视觉吸引力。此外，每个button还可以通过属性...