zoukankan      html  css  js  c++  java
  • flex 简单跑马灯效果(竖着显示)

    <mx:Move id="move_area" target="{VBox_AreaWarning}"/>   //move效果,模拟跑马灯
    
    <s:BorderContainer   borderVisible="false" height="80" >
          <s:BorderContainer id="border_area" top="15" height="100%"
                 borderVisible="false">
           <s:layout>       //flex4的layout还是很好用的,没那么麻烦
            <s:VerticalLayout paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0" gap="0" clipAndEnableScrolling="true"   >      //clipAndEnableScrolling必须为true否则内容会跑出范围
            </s:VerticalLayout>
           </s:layout>
            <mx:VBox id="VBox_AreaWarning" x="0" mouseOver="VBox_AreaWarning_mouseOverHandler(event)" mouseOut="VBox_AreaWarning_mouseOutHandler(event)">    //把跑马灯的内容放进vbox里,尤其适合多条记录同时滚动的效果 
            
            </mx:VBox>
          </s:BorderContainer>
          <s:Label x="10" y="0" fontFamily="宋体" fontWeight="bold" text="【区域告警】"/>
         </s:BorderContainer>

    这里画出一个bordercontainer,在里面做跑马灯效果

    move_area.yFrom = border_area.height;    
         move_area.yTo =  -x.length*15;   //如果动态载入内容,推荐根据记录条数去算y移动到的位置,vbox的高度是算不出来的,静态的直接用高度吧
         move_area.repeatCount = 0; //loop 
         move_area.repeatDelay = 0; //loop time 
         move_area.duration = 6000; //the time of scroll once 
         move_area.play();
    
    必须为move_area添加以上属性用以循环
    
    //mouseover时停止滚动
    
    protected function VBox_AreaWarning_mouseOverHandler(event:MouseEvent):void
       {
        move_area.pause();
       } 
    
    //mouseout时从停止的地方继续
       protected function VBox_AreaWarning_mouseOutHandler(event:MouseEvent):void
       {
        move_area.resume();
       }
  • 相关阅读:
    元素的定位问题
    报纸排版(分列示例)
    background的属性和背景图片定位的实例
    CSS选择器小结
    URL与图像格式
    MIME(Multipurpose Internet Mail Extensions)的简介
    介绍两种风格的URL
    门店销售讲究多
    软件项目中需求管理工作的重要性
    谈谈需求变更跟踪
  • 原文地址:https://www.cnblogs.com/exmyth/p/3413781.html
Copyright © 2011-2022 走看看