`
japankn
  • 浏览: 215060 次
  • 性别: Icon_minigender_1
  • 来自: 广西
社区版块
存档分类
最新评论

state transition整合总结一 单组件改变

    博客分类:
  • flex
阅读更多

    今天看了看state 和 transition状态切换效果的内容,整了一天,终于弄明白了里面关系,今天开始将这些内容记录备案一份,方便自己和其他朋友的学习!!

    为了方便说明,我贴出一段代码,拷贝运行就可以看到效果,然后再说明它们之间的关系!

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute">
 <mx:transitions>
  <mx:Transition>
   <mx:Sequence target="{pan}">
    <mx:WipeLeft target="{but1}"/>
    <mx:RemoveChildAction target="{but1}"/>
   </mx:Sequence>
  </mx:Transition>
 </mx:transitions>
 <mx:states>
  <mx:State name="change">
   <mx:RemoveChild target="{but1}"/>
   <mx:SetProperty target="{but1}"
       name="visible"
       value="false"/>
  </mx:State>
 </mx:states>
 <mx:Panel id="pan" x="282"
     y="142"
     width="250"
     height="200"
     layout="absolute">
  <mx:Button x="82"
       y="70"
       label="but1"
       id="but1"/>
 </mx:Panel>
 <mx:Button x="374.5"
      y="366"
      label="change"
      click="currentState='change'"/>

</mx:Application>

    看着有些乱,但这是最简单的用法了,它们之间的关系由下图来说明

 

  • 大小: 9.3 KB
分享到:
评论

相关推荐

    Spring_Web_Flow_2[1].0_入门.pdf

    Transition 定义了从一个 State 到另一个 State 的转换条件。例如,当用户点击“确认订单”按钮时,会触发从 View State 到下一个 State 的转换。 #### 四、购物车示例分析 以下是一个简化的购物车流程示例,用于...

    尚硅谷VUE核心技术课件资料-笔记总结

    - 过渡效果:使用Vue内置的transition组件和CSS过渡/动画实现组件的进入离开效果。 - 动画库整合:如Animate.css、Velocity.js等,与Vue结合实现复杂动画。 10. **单文件组件(SFC)** - 单文件组件结构:理解SFC...

    spring mvc 教程

    3. **与JSF整合**:通过适配层,可以将JSF组件集成到Spring Web Flow中,从而充分利用JSF丰富的组件库。 4. **与Spring Security整合**:安全性的增强是Spring Web Flow 2.0的重要特点之一,通过简单的配置即可实现...

    An online avatar generator just for fun _ 一个纯前端实现的头像生成网站.zip

    首先,Vue.js是一个渐进式的JavaScript框架,它的核心库专注于视图层,易于上手且便于与其他库或现有项目整合。Vue.js的特点包括声明式渲染、组件化、虚拟DOM、指令系统以及生命周期钩子等。在头像生成器项目中,Vue...

    opencore开发文档2.pdf

    3.8. OpenMax组件从空闲状态到加载状态的转换以及去初始化(OMX Component Transition from Idle -&gt; Loaded State and De-initialization):阐述了组件状态转换的逆过程以及组件的去初始化流程。 3.9. OpenMax核心...

    spring web flow demo

    定义 transition 来实现到其他 state 的转换,转换的发生一般由事件( event )来触发。 什么情况下可以使用 Spring Web Flow? 前面讲了, Spring Web Flow 提供了描述业务流程的抽象能力,但对一种 Web 开发技术而...

    flex3的cookbook书籍完整版dpf(包含目录)

    对指定组件应用局部Transition 11.6节. 建立在基础State之上的State 11.7节. 用HistoryManagement整合States视图 11.8节. 使用States的延时实例工厂 11.9节. 对添加到State中的Object进行数据绑定 11.10节. 在State...

    Vue实现的拼图小游戏

    Vue.js 是一款流行的前端JavaScript框架,它以组件化开发、易用性和高性能著称。在这个“Vue实现的拼图小游戏”项目中,我们将探讨如何利用Vue.js、CSS和JavaScript技术来构建一个互动的拼图游戏。 首先,Vue.js 的...

    vue面试题30道.zip

    Vue.js 是一款轻量级的前端JavaScript框架,由尤雨溪开发,因其易学易用、性能优秀、组件化等特点,被广泛应用于现代Web开发。本文将基于“vue面试题30道”的主题,深入探讨Vue.js的核心概念、常用功能以及在实际...

    Osworkflow技术文档

    3. **丰富的功能组件**:Osworkflow提供了一系列用于构建复杂流程的元素,包括但不限于环节(step)、条件(conditions)、循环(loops)、分支(splits)、合并(joins)、角色(roles)等。 #### 三、Osworkflow的使用场景与...

    html5+React+Gsap鼠标悬停文字导航菜单背景变色滑动动画特效.zip

    CSS3的`transition`和`transform`属性可能被用来实现颜色改变和元素位置的平滑变化,以创造出吸引人的视觉效果。 总的来说,这个项目结合了HTML5、React和jQuery的优势,为用户提供了一种动态的、交互式的导航体验...

    Laravel开发-laravel-workflow

    `Laravel Workflow` 提供了一种优雅的方式来管理这些状态流程,它将 Symfony 的工作流组件整合到了 Laravel 框架中。通过使用 Workflow,我们可以定义复杂的业务流程,而无需在控制器和模型中编写大量条件逻辑。 **...

    Kalman 滤波器

    1. **状态转移矩阵(State Transition Matrix)**:描述了系统状态从t时刻到t+1时刻的变化规律。 2. **观测矩阵(Observation Matrix)**:描述了系统状态如何转化为可观测的输出。 3. **系统噪声协方差矩阵...

    Jetpack Compose入门到精通

    除了核心库,Compose还有一系列扩展库,如Material Design组件库,用于实现谷歌的设计规范;以及Compose Web,用于构建Web端的声明式UI。 ### 兼容性与性能 Compose与传统Android SDK良好兼容,可以与XML布局混用。...

    Qt QML高仿微信

    例如,我们可以使用Transition和State来实现消息发送后的反馈动画。 9. **用户界面设计**:参照微信的设计,我们需要考虑布局、颜色、图标等视觉元素,以及各种交互细节,如触摸手势、下拉刷新等。Qt Design Studio...

    heather-react:我的投资组合的源代码

    1. **虚拟DOM**:React通过在内存中维护一个虚拟DOM树,使得组件的状态改变时可以高效地计算出最小的DOM更新,从而提高性能。 2. **组件化**:React应用由可复用的组件构成,每个组件都有自己的状态和生命周期方法,...

    Spring Web Flow2入门(二)

    - **State**:每个Flow由一系列的状态组成,每个状态代表页面或者任务的特定阶段。 - **Transition**:定义了状态之间的流转,通常基于用户的行为或业务规则触发。 - **View State**:一种特殊的状态,用于展示...

    Jetpack-compose-sample

    例如,可以使用`AnimatedVisibility`来控制组件的显示和隐藏,`Transition`用于平滑地改变组件状态。此外,`State`和`LaunchedEffect`等工具使得实现响应式UI变得轻松,当数据发生变化时,UI会自动更新。 主题和...

    react-978-1-8005-6825-9:使用 React 介绍 D3.js [视频]

    1. **React 基础**:首先,你需要了解 React 的基本概念,如组件、props、state、事件处理以及虚拟 DOM。这将帮助你理解如何在 React 应用中创建和组织视图。 2. **D3.js 概念**:理解 D3.js 的核心概念,包括选择...

Global site tag (gtag.js) - Google Analytics