編輯導(dǎo)語(yǔ)：選擇數(shù)值時(shí)，可以通過(guò)鼠標(biāo)滑動(dòng)左右來(lái)選擇。本文作者分享了用Axure制作滑動(dòng)選擇數(shù)值的方法，感興趣的小伙伴們一起來(lái)看一下吧。

本次分享的是滑動(dòng)選擇數(shù)值案例：

預(yù)覽及下載地址：https://ef8qxl.axshare.com

一、制作原型

制作12個(gè)矩形，分別命名為：1、2、3、4、5、6、7、8、9、10、11、12。

制作一條橫線，命名為：水平線

制作輸一個(gè)輸入框，命名為：數(shù)值

制作一個(gè)動(dòng)態(tài)面板，命名為：移動(dòng)

在面板里制作一個(gè)指針，拖動(dòng)一個(gè)矩形，命名為：移動(dòng)光標(biāo)，設(shè)置成自己喜歡的形狀，如圖：

制作一個(gè)矩形，命名為：顯示，可以設(shè)置成自己喜歡的形狀和顏色，并設(shè)置為隱藏狀態(tài)，如圖：

最后制作成如圖：

所有的制作完成，接下來(lái)進(jìn)行交互設(shè)置。

二、交互設(shè)置

對(duì)動(dòng)態(tài)面板“移動(dòng)”進(jìn)行“移動(dòng)時(shí)”事件和“拖動(dòng)時(shí)”事件進(jìn)行設(shè)置：

對(duì)矩形“移動(dòng)光標(biāo)”進(jìn)行“鼠標(biāo)按下時(shí)”事件和“鼠標(biāo)松開(kāi)時(shí)”事件進(jìn)行設(shè)置：

所有的設(shè)置完畢。

本文由@qianqianlu 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自 unsplash，基于 CC0 協(xié)議