`

Flex中button可自动换行的label

    博客分类:
  • flex
 
阅读更多
package
{
    import flash.text.TextFieldAutoSize;
    import mx.controls.Button;

    public class WrappingButton extends Button
    {


        public function WrappingButton()
        {
                super();
        }

        override protected function createChildren():void
        {
                super.createChildren();

                textField.multiline = true;
                textField.wordWrap = true;
                textField.autoSize = TextFieldAutoSize.CENTER;
        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
        {
                super.updateDisplayList(unscaledWidth, unscaledHeight);
                textField.y = (this.height - textField.height) >> 1;

                height = textField.height + getStyle("paddingTop") + getStyle("paddingBottom");
        }
    }
}

引用时:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*">

    <local:WrappingButton label="The quick brown fox jumped over the lazy dog." width="100" paddingTop="10" paddingBottom="10" />

</mx:Application>


参考文档:
http://stackoverflow.com/questions/1654403/adobe-flex-word-wrap-in-button-label
分享到:
评论

相关推荐

    flex重载Button 文本自动换行

    在Flex布局中,Button组件是一个基本的交互元素,通常包含一行文本和可选的图标。默认情况下,Button的文本是单行显示的,并且超出的部分会被截断。如果想要改变这一行为,我们需要对Button进行自定义。 3. 重载...

    Flex中如何根据每行内容设置不同底色

    一个`itemRenderer`就是一个小的MXML或ActionScript组件,它可以是自定义的类,也可以是Flex内置组件的子类,如Label、Button等。 2. **创建自定义itemRenderer** 首先,我们需要创建一个自定义的`itemRenderer`...

    flex文件中使用html渲染文字等.txt

    在本篇内容中,我们将深入探讨如何在Flex文件中利用HTML来渲染文本,并结合实例代码进行解析。通过本文,读者可以全面了解Flex框架下HTML文本渲染的方法与应用场景,以及如何结合Flex组件完成多媒体控制功能。 ### ...

    flex quick starts

    ### 使用工具提示(Tooltips)在Flex中的实践与技巧 #### 一、引言 在用户界面设计中,工具提示是一种非常实用的功能,它能够为用户提供即时的帮助信息,提高用户体验。Adobe Flex作为一种广泛使用的RIA(Rich ...

    宽度自适应的按钮。button,方便实用

    在网页设计和开发中,按钮(Button)是用户界面中不可或缺的元素,它通常用于触发某种操作或导航至其他页面。"宽度自适应的按钮"是现代网页设计的一个重要特性,这种按钮能够根据其内容或者容器的宽度自动调整大小,...

    flex + java 初学者 笔记 学习资料

    5. Label:单行文本显示,不支持换行。 三、使用Flash设计Flex组件样式 Flex中可以使用Flash元件的9切片缩放属性来设计组件样式。样式表中可以设置图片为组件样式,通常使用PNG格式。SWF文件可以存储所有样式,然后...

    Flex Air 学习资料\06.文本设计.rar

    1. **TextComponent类**:这是Flex中所有文本组件的基础类,包括Label、Button、TextArea和TextInput等。了解这个类的基本属性和方法对于文本设计至关重要。 2. **样式和格式**:Flex支持通过CSS来控制文本的样式,...

    键盘使用CSSFlex

    确保使用适当的`tabindex`和`aria-label`属性以提高可访问性。 10. **CSS预处理器**:为了代码组织和复用,可以考虑使用Sass或Less等CSS预处理器。这样可以创建模块化的样式,比如键的样式可以封装在单独的混合或...

    css中文对照手册.docx

    - `&lt;button&gt;`: 创建可点击的按钮。 9. **其他标签**: - `&lt;command&gt;`: 定义命令按钮。 - `&lt;details&gt;`: 显示或隐藏详细信息。 - `&lt;dialog&gt;`: 创建对话框。 - `&lt;abbr&gt;`: 用于定义缩写。 - `&lt;address&gt;`: 显示...

    多个按钮单选/多选,高度自适应

    使用 `display: flex` 和 `flex-wrap: wrap` 属性,可以确保按钮在一行内显示不下时自动换行。 对于“属性可自行修改”,这意味着开发者应提供足够的灵活性,允许根据项目需求定制按钮的样式、行为和响应式特性。...

    google-page:使用HTML和CSS构建Google的登录页面

    4. 响应式设计:针对不同屏幕尺寸,可以通过媒体查询(media queries)来改变样式,例如将登录按钮在小屏幕上换行显示: ```css @media (max-width: 600px) { form { flex-direction: column; } button { ...

    CSS基础标签.md

    - **自动换行**:使用 `word-wrap: break-word;`。 这些属性可以帮助优化文本显示,使其更加美观。 #### 常见行内元素 - `a`:链接标签。 - `span`:用于包裹行内元素,不影响其他元素。 - `i`:斜体标签。 - `...

    Two-Column-Landing-Page:用Bootstrap和Flexbox制成

    在登录表单的设计中,Bootstrap的预定义类可以用于创建表单元素,如`&lt;form&gt;`, `&lt;input&gt;`, `&lt;label&gt;`和`&lt;button&gt;`。这些元素可以与Flexbox结合,通过设置`display: flex`和`align-items: center`等属性,实现表单元素...

    login-form

    - `display: flex`和`flex-wrap`属性使容器中的元素在空间不足时换行,实现响应式布局。 - `@media screen and (max-width: some-value)`检查屏幕宽度,应用特定的CSS规则。 5. **链接与资源**: - 在示例中,...

    html 语法详细资料

    - `&lt;form&gt;`定义表单,`&lt;input&gt;`、`&lt;textarea&gt;`和`&lt;select&gt;`用于输入数据,`&lt;button&gt;`创建按钮,`&lt;label&gt;`关联输入元素。 - `type`属性指定`&lt;input&gt;`的类型,如文本(text)、密码(password)、复选框(checkbox)...

    Survey_Form_Jams:这是一份有关果酱的调查表。 这是FreeCodeCamp课程的一部分

    - `&lt;label&gt;`标签:为输入字段提供描述性文本,与`&lt;input&gt;`标签配合使用,提高可访问性。 - `&lt;textarea&gt;`:用于多行文本输入。 - `&lt;button&gt;`:创建可点击的按钮,可以是提交或重置表单。 - `&lt;fieldset&gt;`和`...

    Netfix-clone:Bootcamp HTML Web开发人员的布局布局

    9. **表单元素**:如`&lt;form&gt;`, `&lt;input&gt;`, `&lt;label&gt;`, `&lt;button&gt;`,用于构建交互式表单。 10. **CSS内联样式**:`style`属性可以在HTML元素中直接应用CSS样式。 【项目可能涉及的HTML布局技术】 1. **Flexbox布局**...

    HTML5+CSS3开发商业站点Chapter10.pptx

    - **换行标签** ` `:用于插入换行。 - **水平线标签** `&lt;hr/&gt;`:用于定义一个简单的水平线,通常用于分割内容或视觉上的分割。 - **斜体标签** `&lt;em&gt;` 和 **粗体标签** `&lt;strong&gt;`:分别用来表示强调和重要...

    兵马俑餐饮项目主管

    2. **文本格式化**:`&lt;h1&gt;`到`&lt;h6&gt;`定义标题,`&lt;p&gt;`用于段落,`&lt;b&gt;`和`&lt;i&gt;`分别用于粗体和斜体文本,` `用于换行,`&lt;strong&gt;`和`&lt;em&gt;`用于强调文本。 3. **链接与导航**:`&lt;a&gt;`标签创建超链接,链接到其他网页或...

    faceapps:FaceApps静态页面

    - `&lt;form&gt;`用于创建表单,`&lt;input&gt;`定义输入字段,`&lt;label&gt;`关联输入与描述,`&lt;button&gt;`创建按钮。 - `type`属性(如`text`, `email`, `password`, `submit`等)定义输入类型。 9. **交互性**: - JavaScript常...

Global site tag (gtag.js) - Google Analytics