Adobe的Flex在有些地方确实不尽如人意,比如前面提到的HTML嵌入式支持,而TitleWindow不支持“缩放和调整大小”也是很让人不爽,这种情况下只能外围扩展。
在很多实际应用中都需要Popup窗口,这个窗口一般都是TitleWindow,当然我们也希望其能够支持Resizable,min,max。
我之前一直是模拟Jove写的那个ResizeManager的自己写的一个ResizeTitleWindow,勉强可以使用。Jove那个ResizeManager可以从 http://www.adobe.com/cfusion/communityengine/index.cfm?event=showDetails&loc=en_US&postId=1685&productId=2这个地址获取,有源码和样例可供参考。一般来讲直接使用ResizeManager来操作就可以了,但我这边还需要对一些额外事件多监听和处理,所以不得不改写它。
前些日子,又看了看FlexLib(http://flexlib.googlecode.com)的MDI Window组件。MDI Window功能很cool,不过不支持模态。另外就是“侵入性”太强,其必须在一个MDI Canvas画布中,并被MDI Manager所管理。所以如果很简单使用(就像PopupManager简单弹出一个TitleWindow)那样使用,是不可能的了。
但MDI Window用于解决符合那种“在一个控件内存在很多Panel”的场景非常适合,也非常cool。
最近发现一个新的ResiableTitleWindow,比较好用,推荐一下。在http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=1207017&loc=en_us#可以下载到。基本上直接引入就可以使用了。不过你们很多事件处理方式采用了private方法,所以建议大家改成protect,以便于扩展。
如果你想实现不同的“最大”“最小”“关闭”按钮图标,也非常容易,只需要设置相应的css即可。在下载的样例中有详细的参考。
分享到:
相关推荐
在Flex编程环境中,可调整大小的组件(flex.resizable.comp)是用于创建用户界面时非常重要的元素,尤其在设计响应式或自适应布局时。这些组件允许用户通过拖动边框来改变组件的尺寸,从而提供更加灵活和交互式的...
今天我们将深入探讨一个名为"re-resizable"的开源库,它是一个专为响应式设计而生的可调整大小的组件。 首先,让我们了解一下**什么是re-resizable**。re-resizable是一款轻量级的JavaScript库,专门为前端开发者...
"jquery-resizable-columns"正是这样一个jQuery插件,它允许用户通过鼠标拖动来改变表格列宽,从而满足不同场景下的数据查看需求。 一、jQuery可拖动列宽插件介绍 "jquery-resizable-columns"是基于jQuery的一个轻...
TitleWindow是一种常见的窗口样式,通常具有标题栏,用于显示窗口的名称并提供基本的操作如最小化、最大化和关闭。在这个特定的项目"ResizableTitleWindow"中,我们关注的是一个具有增强功能的TitleWindow,它允许...
《jQuery-resizable:拖拽改变容器尺寸的艺术》 在网页设计和开发中,用户交互体验是至关重要的元素之一。为了提升用户体验,许多开发者选择引入动态调整元素大小的功能,让用户可以根据需求自由调整界面布局。其中...
使用CSS,我们可以通过`resize`属性来允许用户手动调整元素大小,如`resizable: both;`。若需动态改变大小,可以结合JavaScript监听窗口大小变化事件(`window.resize`),并根据新的尺寸调整Flex项目的大小。 2. *...
标题中的“前端项目-angular-resizable.zip”表明这是一个与前端开发相关的项目,具体是关于一个名为“angular-resizable”的组件或库。这个项目的核心功能是提供一个可以调整大小的容器,用户可以根据自己的需求来...
`react-resizable-and-movable`库正是为了解决这类需求而诞生的。这个库提供了一组React组件,使得在应用中实现元素的拖动和大小调整变得简单易行。让我们深入探讨一下这个库的功能、用法以及它如何融入React开发。 ...
可调整大小的 一个简单的小部件,可以通过一个或多个手柄调整...const Resizable = require ( 'react-resizable' ) . Resizable ; // or, const ResizableBox = require ( 'react-resizable' ) . ResizableBox ; // ES
JQueryUI--Resizable()---为拖动层添加右下角的拖动图标,对应博客地址:http://blog.csdn.net/harvic880925/article/details/8469248
jQuery UI Resizable 是一个非常实用的组件,允许用户通过拖动边框来改变元素的尺寸。然而,在某些情况下,可能会遇到一些意想不到的问题,比如元素尺寸调整时宽度自动增加10像素。这个问题并不算是Resizable组件...
在本章节中,我们将深入探讨jQuery EasyUI框架中的Resizable组件,这是一个强大的功能,允许用户对网页元素进行拖动调整大小的操作。jQuery EasyUI是基于jQuery的轻量级UI库,它提供了一系列易于使用的UI组件,极大...
"react-resizable" 是一个基于React的开源组件库,它提供了可调整大小的功能,使得开发者能够在React应用中轻松实现元素的拖动调整大小。这个组件是JavaScript库,但与"TypeScript"兼容,这意味着它提供了类型定义,...
在本章的学习中,我们将深入探讨EasyUI中的Resizable组件,这是一种允许用户通过拖动来调整元素尺寸的功能。让我们逐个了解其核心知识点。 首先,我们要掌握Resizable组件的**加载方式**。有两种主要的加载方法: ...
vuedraggable-resizable是一个基于Vue.js的组件库中的组件,它允许开发者在网页应用中创建可拖动(Draggable)和可调整大小(Resizable)的元素。在Vue项目中,开发者可以利用该组件轻松实现复杂的拖拽和缩放功能。 ...
可调整角度的元素 演示版 目录 关于 6.0+角度指令,允许拖动和调整元素的大小 安装 通过npm安装: npm install --save angular-resizable-element 然后像下面这样在您的应用... display: flex; align-items: center
arrowRight:增加宽度20px ctrl + arrowUp:将高度增加20像素ctrl + arrowDown:降低高度20像素目录安装要安装,您可以使用或 : $ npm install react-modal-resizable-draggable$ yarn add react-modal-resizable-...
基本用法:< ReSizable xss=removed xss=removed> Your Content</ ReSizable> 这将使<ReSizable>根据用户输入调整其大小。 如果要手动控制其大小,请绑定到onResize而不设置width和height 。 当然也可以手动设置...
"resizable_dlg_demo.zip"是一个压缩包,其中包含了关于可调整大小对话框(Resizable Dialog Box)的源代码示例。这个项目可能是一个用于教学或实践目的的实例,帮助开发者了解如何在C++环境下创建可以自适应大小...
本文将详细介绍如何使用JavaScript库`jquery.resizable.js`来实现这一功能,以及相关的技术要点。 `jquery.resizable.js`是基于jQuery的一个插件,它允许用户通过拖动元素的边框来改变其宽度和高度。这个库为开发者...