2009-04-14 09:34:47| 分类： Flash /Flex /FMS | 标签： |举报 |字号大中小 订阅
最近需要用到这个，做了个，结果才一天，换界面，又做，我汗……
做的不是很完善，最起码，滚动条不会随着文字变多而变短！
主要实现的是：鼠标点、拉、拖、滚，聊天内容窗口的随动，发送消息后，实现类是QQ聊天窗口的样子！
介绍下下面的名字，代码片段，自己组织，如果是CS3上，可直接用，Flex需要导包：
btndown：向下的箭头按钮 | btnup：……
btnSend：发送按钮（MC）| txt：输入文本框
contentMain：聊天信息显示文本框 | contentMask：遮罩
dragger：可以移动的那个 | scrollbg：滚动条背景
注：下面的56为——滚动条背景高度-滚动条高度
17为一行文字高度
99为聊天记录文本框高度，27为起始位置
btndown.addEventListener(MouseEvent.MOUSE_DOWN,goDown);
btnup.addEventListener(MouseEvent.MOUSE_DOWN,goUp);
btnSend.addEventListener(MouseEvent.CLICK,sendMsg);
contentMain.mask = contentMask;
setTimeout(goIndex,500);
function goIndex(){
contentMain.y = 27;
contentMain.border = false;
}
function goDown(e:MouseEvent):void{
if(dragger.y < 99){
contentMain.y=(contentMain.y-17);
changeCoordinates(true);
}
}
function goUp(e:MouseEvent):void{
if(contentMain.y != 27){
contentMain.y=(contentMain.y+17);
changeCoordinates(false);
}
}
//200px;line = 20;
for(var i:int ; i<20;i++){
contentMain.htmlText += i+"aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>";
if(i<=12){
contentMain.height+=17;
}
}
contentMain.height+=17;
initScroll();
function initScroll():void{
if(contentMain.height == 154){
this.dragger.visible = false;
}else{
this.dragger.visible = true;
//this.dragger.y = 43;
}
}
function sendMsg(e:MouseEvent):void{
if(txt.text != ""){
initScroll();
if(contentMain.text == ""){
contentMain.htmlText += txt.text+"<br>";
}else{
if(contentMain.htmlText.split("<").length < 37){
contentMain.htmlText += txt.text+"<br>";
}else{
contentMain.htmlText += txt.text+"<br>";
contentMain.height += 17;
contentMain.y = 27-(contentMain.height - 127);
//contentMain.y = 27-(contentMain.height - 127)-17;
this.dragger.y = 99;
}
}
}
}
txt.addEventListener(KeyboardEvent.KEY_DOWN,callEnter);
function callEnter(evt:KeyboardEvent):void{
if (evt.keyCode == Keyboard.ENTER){
sendMsg(null);
}
}
//scroll bar height = 40
//------------------------------------------------------------------------------
//中间滚轮监测。
addEventListener(MouseEvent.MOUSE_WHEEL,mouseWheel);
//中滚轮。
function mouseWheel(e:MouseEvent) {
var _delta:int=e.delta;
if (_delta>0) {
//滚轮正在往前滚动。
goUp(null);
} else {
//滚轮正在往后滚动。
goDown(null);
}
}
//更改坐标
function changeCoordinates(bl:Boolean):void{
//可滚动距离 trace(scrollbg.height-dragger.height);
//可移动距离 contentMain.height-contentMask.height;
//每次移动17，移动百分比为
if(bl){
dragger.y += 56*(17/(contentMain.height-contentMask.height));
}else{
dragger.y -= 56*(17/(contentMain.height-contentMask.height));
}
}
//-------------------------------------------------------------------
dragger.addEventListener(MouseEvent.MOUSE_DOWN,draggerDown);
function draggerDown(e:MouseEvent):void{
dragger.addEventListener(MouseEvent.MOUSE_MOVE,updateContent);
}
function updateContent(e:MouseEvent):void{
//------------------------------↓x, -------↓y, ------↓width, ↓height
var rect:Rectangle=new Rectangle(scrollbg.x,scrollbg.y,0,scrollbg.height - dragger.height-1);
dragger.startDrag(false,rect);
//42-98 56
//trace(dragger.y);
//trace(Math.round(dragger.y-42)+"--------------移动距离");
contentMove(Math.round(dragger.y-42));
}
dragger.addEventListener(MouseEvent.MOUSE_UP,draggerOut);
addEventListener(MouseEvent.MOUSE_UP,draggerOut);
function draggerOut(e:MouseEvent):void{
dragger.stopDrag();
dragger.removeEventListener(MouseEvent.MOUSE_MOVE,updateContent);
contentMove(Math.round(dragger.y-42));
}
//文本框的文字移动
function contentMove(num:Number):void{
//算出移动百分比距离
//--------------↓原始坐标
//------------------------↓可移动区域------------------------------------↓移动百分比
contentMain.y = 27-(contentMain.height-contentMask.height)*num/(scrollbg.height - dragger.height-1);
}
评论