package zkl.controls
{
import com.greensock.TweenLite;
import com.greensock.easing.Back;
import flash.display.DisplayObject;
import flash.display.DisplayObjectContainer;
import flash.display.Sprite;
import flash.display.Stage;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.geom.Rectangle;
/**
* 滚动条
* 约定滚动的控制的焦点都在左上角
* 滑块:可以被拖动的
* 滑道:滑块所在的拖动范围
* 内容:拖动滑块要触动的对象
* 使用实例:
* import zkl.controls.ZScrollBar;
* import zkl.controls.ZScrollBarDirection;
* var bar:ZScrollBar = new ZScrollBar();
* bar._stage = this.stage;
* bar._target = _target;
* bar._slideBar = slideBarV;
* bar._scrollBar = scrollBar;
* bar._targetScrollLength = _target.height - mask.height;
* bar.init();
* @author zkl
*/
public class ZScrollBar extends Sprite
{
//所在舞台
public var _stage:Stage;
//被滚动的内容
public var _target:DisplayObject;
//内容滚动的距离
public var _targetScrollLength:Number;
//滚动条的滚动方向
public var _direction:String = ZScrollBarDirection.VERTICAL;
//滑块
public var _scrollBar:Sprite;
//滑道
public var _slideBar:Sprite;
//四个方向的滑块
public var _upBar:Sprite;
public var _downBar:Sprite;
public var _leftBar:Sprite;
public var _rightBar:Sprite;
//滑块滚动的速度(只有设置的方向按钮,此值才有作用)
public var _barSpeed:Number = 5;
//滑块可以滑动的长度(有效的滑道)
private var slideLength:Number;
//滑块的滚动范围
private var barDragRect:Rectangle;
//对象的初始化坐标
private var targetXY:Number = 0;
//对象滚动的方向
private var scrollDir:int;
private static const UP:int = 0;
private static const DOWN:int = 1;
private static const LEFT:int = 2;
private static const RIGHT:int = 3;
public function ZScrollBar() {
}
/**
* 初始化
*/
public function init():void {
if (_stage == null)_stage = _target.stage;
if (_direction == ZScrollBarDirection.VERTICAL) {//垂直
//滑块的初始位置
_scrollBar.x = _slideBar.x + (_slideBar.width - _scrollBar.width) / 2;
_scrollBar.y = _slideBar.y;
//有效的滑道长度
slideLength = _slideBar.height - _scrollBar.height;
//滑块的可拖动范围
barDragRect = new Rectangle(_slideBar.x + (_slideBar.width - _scrollBar.width) / 2, _slideBar.y, 0, slideLength);
//
targetXY = _target.y;
}else if (_direction == ZScrollBarDirection.HORIZONTAL) {//水平
//滑块的初始位置
_scrollBar.x = _slideBar.x;
_scrollBar.y = _slideBar.y + (_slideBar.height - _scrollBar.height) / 2;
//有效的滑道长度
slideLength = _slideBar.width - _scrollBar.width;
//滑块的可拖动范围
barDragRect = new Rectangle(_slideBar.x, _slideBar.y + (_slideBar.height - _scrollBar.height) / 2, slideLength, 0);
targetXY = _target.x;
}else {
throw new Error("direction的值设置有误,请参考ZScrollBarDirection.as");
return;
}
setListener();
}
//设置监听
private var tempBar:Sprite;
private function setListener():void {
//scrollBar
_scrollBar.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
//dir bar
if (_upBar != null) {
_upBar.addEventListener(MouseEvent.MOUSE_DOWN, dirDownHandler);
}
if (_downBar != null) {
_downBar.addEventListener(MouseEvent.MOUSE_DOWN, dirDownHandler);
}
if (_leftBar != null) {
_leftBar.addEventListener(MouseEvent.MOUSE_DOWN, dirDownHandler);
}
if (_rightBar != null) {
_rightBar.addEventListener(MouseEvent.MOUSE_DOWN, dirDownHandler);
}
}
//dir bar
private function dirDownHandler(e:MouseEvent):void {
tempBar = e.currentTarget as Sprite;
switch(tempBar) {
case _upBar:
scrollDir = UP;
break;
case _downBar:
scrollDir = DOWN;
break;
case _leftBar:
scrollDir = LEFT;
break;
case _rightBar:
scrollDir = RIGHT;
break;
}
tempBar.addEventListener(Event.ENTER_FRAME, dirEnterFrame);
tempBar.addEventListener(MouseEvent.MOUSE_UP, dirUpHandler);
tempBar.addEventListener(MouseEvent.MOUSE_OUT, dirUpHandler);
}
private function dirUpHandler(e:MouseEvent):void {
tempBar.removeEventListener(Event.ENTER_FRAME, dirEnterFrame);
tempBar.removeEventListener(MouseEvent.MOUSE_UP, dirUpHandler);
tempBar.removeEventListener(MouseEvent.MOUSE_OUT, dirUpHandler);
}
private function dirEnterFrame(e:Event):void {
switch(scrollDir) {
case UP:
_scrollBar.y = Math.max(_slideBar.y, _scrollBar.y - _barSpeed);
break;
case DOWN:
_scrollBar.y = Math.min(_slideBar.y + slideLength, _scrollBar.y + _barSpeed);
break;
case LEFT:
_scrollBar.x = Math.max(_slideBar.x, _scrollBar.x - _barSpeed);
break;
case RIGHT:
_scrollBar.x = Math.min(_slideBar.x + slideLength, _scrollBar.x + _barSpeed);
break;
}
updateTargetPos();
}
//dir bar end
//scrollBar
private function mouseDownHandler(e:MouseEvent):void {
_stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
_scrollBar.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
}
private function mouseMoveHandler(e:MouseEvent):void {
_scrollBar.startDrag(false, barDragRect);
_scrollBar.addEventListener(Event.ENTER_FRAME, scrollEnterFrameHandler);
}
private function mouseUpHandler(e:MouseEvent):void {
_scrollBar.stopDrag();
_scrollBar.removeEventListener(Event.ENTER_FRAME, scrollEnterFrameHandler);
_scrollBar.removeEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);
_stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
}
private function scrollEnterFrameHandler(e:Event):void {
updateTargetPos();
}
//scrollBar end
//update
private var percent:Number = 0;
private function updateTargetPos():void {
if (_direction == ZScrollBarDirection.VERTICAL) {
percent = (_scrollBar.y - _slideBar.y) / slideLength;
//_target.y = Math.round(targetXY - _targetScrollLength * percent);
TweenLite.to(_target, 0.5, { y:Math.round(targetXY - _targetScrollLength * percent), ease:Back.easeOut } );
}else if (_direction == ZScrollBarDirection.HORIZONTAL) {
percent = (_scrollBar.x - _slideBar.x) / slideLength;
//_target.x = Math.round(targetXY - _targetScrollLength * percent);
TweenLite.to(_target, 0.5, { x:Math.round(targetXY - _targetScrollLength * percent), ease:Back.easeOut } );
}
}
////////////////////////////////////////////////////////
///
}
}
分享到:
相关推荐
易语言源码易语言读写滚动条位置源码.rar 易语言源码易语言读写滚动条位置源码.rar 易语言源码易语言读写滚动条位置源码.rar 易语言源码易语言读写滚动条位置源码.rar 易语言源码易语言读写滚动条位置源码.rar ...
易语言发送消息滚动滚动条例程.rar 易语言发送消息滚动滚动条例程.rar 易语言发送消息滚动滚动条例程.rar 易语言发送消息滚动滚动条例程.rar 易语言发送消息滚动滚动条例程.rar 易语言发送消息滚动滚动条例程....
易语言源码易语言高级表格滚动条联动源码.rar 易语言源码易语言高级表格滚动条联动源码.rar 易语言源码易语言高级表格滚动条联动源码.rar 易语言源码易语言高级表格滚动条联动源码.rar 易语言源码易语言高级表格...
AS3滚动条主要由以下几个部分组成: 1. **轨道(Track)**:这是滚动条的背景部分,通常包含一个滑块(Scrollbar)在其内部滑动。轨道决定了滑块可移动的范围。 2. **滑块(Thumb)**:它是滚动条上的可移动部分,...
在本资源“AS3 横向-竖向 滚动条 带源码.rar”中,包含的是一个使用AS3实现的可自定义的横向和纵向滚动条组件。滚动条在用户界面设计中扮演着关键角色,特别是在显示大量内容或屏幕空间有限时,它允许用户查看超出...
jquery多款滚动条插件插件.rarjquery多款滚动条插件插件.rarjquery多款滚动条插件插件.rarjquery多款滚动条插件插件.rarjquery多款滚动条插件插件.rarjquery多款滚动条插件插件.rar
根据提供的标题、描述、标签及部分内容,我们可以提炼出与显示窗口中的水平和垂直滚动条相关的IT知识点。以下是对这些知识点的详细阐述: ### 显示窗口的水平和垂直滚动条实现 #### 一、概述 在开发图形用户界面...
1. **源码结构**:源码可能包含多个独立的Flash文档(.fla)和ActionScript文件(.as),每个都对应一个特定的滚动条样式或功能。开发者可以通过查看这些文件来学习不同滚动条设计的实现方式,包括动态响应、平滑...
精彩编程与编程技巧-在ListBox适当设定水平滚动条的宽度 ...
AS3滚动条制作是Flash开发中的一个重要组成部分,主要用于在内容超过可视区域时提供导航,确保用户可以方便地浏览和操作长或宽的内容。在Flash环境中,ActionScript 3(AS3)是编程语言,用于创建交互式的动画和应用...
在Delphi编程环境中,ListBox控件是...这个实例展示了如何通过自定义滚动条组件和调整控件属性来扩展标准Delphi组件的功能,以满足特定的需求。在实际开发中,这样的自定义可以为用户界面提供更好的可读性和易用性。
虽然这对于某些情况可能是必要的,但在其他一些情况下,开发者可能希望去除滚动条以获得一个更加整洁和一致的用户界面。 去除iframe滚动条的一种常见做法是通过JavaScript修改iframe的属性。在给定文件中,介绍了...
在实际项目中,`src`目录下的源代码将包含这个自定义滚动条类的实现,可能有如`CColorfulScrollBar.h`和`CColorfulScrollBar.cpp`两个文件。`vs6`和`vs2005`可能代表两个不同版本的Visual Studio工程文件,分别适用...
利用利用遮罩实现滚动条遮罩实现滚动条利用遮罩实现滚动条
《jQuery.nicescroll:打造优雅的iOS风格滚动条》 在网页设计中,滚动条作为用户与内容交互的重要元素,其美观性和用户体验至关重要。jQuery.nicescroll插件就是一款专门用于美化滚动条的工具,它能够帮助开发者...
JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责处理客户端的交互和动态效果。在网页设计中,滚动条是用户...通过学习这个资源,开发者可以提升自己在网页滚动条设计和用户体验优化方面的能力。
jQuery.mCustomScrollbar插件为开发者提供了强大的工具,让滚动条不再只是网页中的一个小配件,而是成为提升网站品质和用户体验的重要一环。无论是在响应式布局、移动设备,还是在各种复杂场景下,都能发挥出其强大...
滚动条是浏览器界面的一个基本元素,用于浏览那些内容超过屏幕可视区域的网页部分。JavaScript提供了一系列方法和属性,允许开发者对滚动条进行定制和控制,以实现各种特效。 1. **DOM(Document Object Model)...
在网页设计中,用户体验是至关重要的,而一个精致的滚动条设计可以提升网站的整体美观度,使得用户在浏览页面时有更愉快的体验。"jQuery滚动条美化插件"正是一款专注于改善滚动条外观的工具,它允许开发者通过简单的...
实现textBox 滚动条自动滚动到最底端,可以更加好地更加美观地使用 textbox 多行显示