Disabled按鈕的製作方法

來源:互聯網
上載者:User
按鈕

  效果瀏覽:

http://www.flash8.net/bbs/UploadFile/2005-7/2005725151829471.swf

點擊這裡下載源檔案

  在一些特定應用中,我們需要用到按鈕的Disabled狀態.下面我們就來製作一個這樣的效果.

  1.首先,在情境中建立一個MC(影片剪輯MovieClip),在此MC中繪製一個圖形,把線條和填充顏色分別轉換為MC,如圖1:

(圖1);

  2.完成後拖到情境中,複製一個,並調整方向,分別取執行個體名為”arrowPrev””arrowNext”,如圖2:

(圖2)

  3.在情境中繪製一個動態文本,命名變數名為”currentPage”,用於顯示當前頁數;

  4.介面工作完畢,下面建立一圖層,命名為AS,按F9開啟動作面板,輸入/複製下面的代碼:

//初始化頁面總數
pageNum = 5;
//初始化按鈕
arrowPrev.enabled = false;
arrowNext.enabled = true;
borderColor = new Color(arrowPrev.border);
borderColor.setRGB("0x999999");
fillColor = new Color(arrowPrev.fill);
fillColor.setRGB("0xcccccc");
//上一頁按鈕
arrowPrev.onRollOver = function() {
borderColor = new Color(this.border);
borderColor.setRGB("0xff6600");
fillColor = new Color(this.fill);
fillColor.setRGB("0xFFEBD7");
};
arrowPrev.onRollOut = function() {
borderColor = new Color(this.border);
borderColor.setRGB("0x339966");
fillColor = new Color(this.fill);
fillColor.setRGB("0xD2F0E1");
};
arrowPrev.onRelease = function() {
arrowNext.enabled = true;
borderColor = new Color(arrowNext.border);
borderColor.setRGB("0x339966");
fillColor = new Color(arrowNext.fill);
fillColor.setRGB("0xD2F0E1");
if (currentPage>1) {
currentPage = parseInt(currentPage)-1;
} else {
this.enabled = false;
borderColor = new Color(this.border);
borderColor.setRGB("0x999999");
fillColor = new Color(this.fill);
fillColor.setRGB("0xcccccc");
}
};
//下一頁按鈕
arrowNext.onRollOver = function() {
borderColor = new Color(this.border);
borderColor.setRGB("0xff6600");
fillColor = new Color(this.fill);
fillColor.setRGB("0xFFEBD7");
};
arrowNext.onRollOut = function() {
borderColor = new Color(this.border);
borderColor.setRGB("0x339966");
fillColor = new Color(this.fill);
fillColor.setRGB("0xD2F0E1");
};
arrowNext.onRelease = function() {
arrowPrev.enabled = true;
borderColor = new Color(arrowPrev.border);
borderColor.setRGB("0x339966");
fillColor = new Color(arrowPrev.fill);
fillColor.setRGB("0xD2F0E1");
if (currentPage<pageNum) {
currentPage = parseInt(currentPage)+1;
} else {
this.enabled = false;
borderColor = new Color(this.border);
borderColor.setRGB("0x999999");
fillColor = new Color(this.fill);
fillColor.setRGB("0xcccccc");
}
};
//拖動情境
drag.onMouseDown=function(){
if(this.hitTest(_xmouse,_ymouse,true)) startDrag(_root,false);
}
drag.onMouseUp=function(){
stopDrag();;
}

  為什麼每次都要建一個顏色對象.事先建好.不是省去很多冗餘.而且那個按鈕到了第一頁和第五頁後必須再按一下才會無效..這也算個BUG吧..一同修改過.效果如下: 我覺的這樣的效果用時間軸動畫實現更為簡單.

http://www.flash8.net/bbs/UploadFile/2005-7/2005725171359792.swf

//初始化頁面總數
pageNum = 5;
//初始化按鈕
arrowPrev.enabled = false;
arrowNext.enabled = true;
borderColor = new Color(arrowPrev.border);
fillColor = new Color(arrowPrev.fill);
rgbset(borderColor, 0x999999, fillColor, 0xcccccc);
borderColornext = new Color(arrowNext.border);
fillColornext = new Color(arrowNext.fill);
//上一頁按鈕
arrowPrev.onRollOver = function() {
rgbset(borderColor, 0xff6600, fillColor, 0xFFEBD7);
};
arrowPrev.onRollOut = function() {
rgbset(borderColor, 0x339966, fillColor, 0xD2F0E1);
};
arrowPrev.onRelease = function() {
arrowNext.enabled = true;
rgbset(borderColornext, 0x339966, fillColornext, 0xD2F0E1);
if (currentPage>2) {
currentPage = parseInt(currentPage)-1;
} else {
currentPage = parseInt(currentPage)-1;
this.enabled = false;
rgbset(borderColor, 0x999999, fillColor, 0xcccccc);
}
};
//下一頁按鈕
arrowNext.onRollOver = function() {
rgbset(borderColornext, 0xff6600, fillColornext, 0xFFEBD7);
};
arrowNext.onRollOut = function() {
rgbset(borderColornext, 0x339966, fillColornext, 0xD2F0E1);
};
arrowNext.onRelease = function() {
arrowPrev.enabled = true;
rgbset(borderColor, 0x339966, fillColor, 0xD2F0E1);
if (currentPage<pageNum-1) {
currentPage = parseInt(currentPage)+1;
} else {
currentPage = parseInt(currentPage)+1;
this.enabled = false;
rgbset(borderColornext, 0x999999, fillColornext, 0xcccccc);
}
};
//拖動情境
drag.onMouseDown = function() {
if (this.hitTest(_xmouse, _ymouse, true)) {
startDrag(_root);
}
};
drag.onMouseUp = function() {
stopDrag();
};
function rgbset(rgbobj1, rgb1, rgbobj2, rgb2) {
rgbobj1.setRGB(rgb1);
rgbobj2.setRGB(rgb2);
}

相關文章

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。