中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

如何通過拖動滑桿上的按鈕，調整數值？

這種部件常見于調節音量大小、色彩值等數值類型的設置。我們來分解一下部件構成，看看如何實現。

點擊這里查看在線演示

1、部件分解

這樣的部件主要由三個部分組成，一個滑桿軌道，一個用來調節的按鈕，還有一個是什么呢？對了就是拖動的進度，因為axure里的部件不支持設置部分填充，所以這里會用另一個大小相同的軌道，通過設置不同的填充顏色來表示當前拖動的進度。

2、動態面板的應用

這里使用動態面板是為了應用它的“Fit to Content”（適應內容）屬性，這個屬性在應用之后，動態面板中的內容只會在指定大小范圍內顯示，其它區域不可見。

考慮到拖動的進度最大是軌道長度，最小為0，而為了隱藏在進度小100時的部分，需要將動態面板的“Fit to Content”（適應內容）勾選去掉，這樣在超出屏幕之外的內容將不可見。

最終兩個動態面板初始的樣子如下：

3、設置動態面板的onDrag事件

動態面板的事件很豐富，拖動事件是其中最重要的事件之一。我們利用拖動事件，來動態顯示當前改變值的大小，直觀顯示。

將滑桿和小按鈕轉成一個動態面板，移動到內容的最左邊，只顯示出小按鈕，表示當前位置在0。再將該動態面板和滑桿軌道再轉成一個外層的動態面板，注意給動態面板起個名字，便于后面選擇。

為第一個動態面板添加onDrag事件，選擇move操作，在右邊選擇該動態面板，設置為只沿x軸移動（with drag x），并且在x軸上的移動范圍：left>=-300 并且 left<=0。

4、計算進度

因為我們畫的軌道寬度并不是剛好100，可能大于或小于100，例如這個例子里，軌道寬度為300，因此我們要根據當前被拖動的動態面板的x位置，來計算在軌道上移動的百分比。公式如下：

[[(100-Math.abs(LVAR1.x)/3).toFixed(0)]]

使用局部變量LVAR1表示動態面板，這樣好取它的x位置。計算方法為根據當前x位置除以3（因為全長300，除以3剛好等于100），注意要用100減掉這個值，而且因為當前位置是負值，所以這里使用了取絕對值（Math.abs(值)）的方法去掉負號，最后結果取整(toFixed(0)表示小數位為0，即沒有小數)。

5、完成

到這里滑桿調值基本完成了。

知道大致思路后，就可拓展做成你想要的原型效果了，這就要看你的需要啦！

本文由 @Axure原型設計工場?原創發布于人人都是產品經理?，未經許可，禁止轉載。