簡體   English   中英

具有圖像和顏色的圓形UI滑塊

[英]Circular UI Slider with Image and Color

我正在使用UISlider開發一個應用程序,需要使其循環。 是否可以通過某些本機代碼實現,還是必須集成第三方庫?

我想填充顏色,因為用戶將滑過滑塊。

我在具有多個鏈接的單獨線程中遇到了這個問題,並且不喜歡所提供的任何答案,所以我想我會在似乎最相關的線程中添加自己的答案,以免其他人在這里找到自己的方式並喜歡我提供的選項。

它不是優雅或簡單,但很容易,我認為這對於其他人開發自己的書來說是一個不錯的起點。

在此示例中,圓形uiScroller放置在顯示在SKView頂部的視圖(或HUD)上。 然后,我使用hitTest將任何觸摸從gameScene傳輸到UIView,並使用_touchesBegan和_touchesMoved更新一系列隱藏的按鈕,如下所示:

箭頭全部隱藏,但是我們使用每個框的框來記錄觸摸的位置

我制作了箭頭UIButton,因此使用情節提要更加容易,但是我認為imageView可以正常工作,因為我們僅檢查_touchesBegan中的箭頭框架,然后將其發送到函數,而不是從箭頭本身收集觸摸事件。

if upBtn.frame.contains(touch) {
            upBtnPress() //if you made this a touch func like me a call to (self) as the sender may be required
        }

黑色圓圈本身仍然可見,因此看起來就是水龍頭要去的地方。

然后最終您將創建多個圖像,如下所示:

每個位置的任何圓形圖案都是合適的

(我總共得到16分)

然后在任何按下功能下,您只需更改黑圈的圖像即可根據觸摸位置所在的位置來顯示正確的圖像!

circleDpad.image = UIImage(named: "up")

計算角度:

非常簡單,我的表盤上有16個點,因此我需要將其轉換為1 ... 360的可能方向

func angleChanged(angle: CGFloat) {
    let valueReached = (angle / 16) * 360 // this gives you the angle in degrees, converting any point that's x/16 into x/360
    let turret = checkBaseSelect() //this is my personal code
    turret?.tAngle = CGFloat(valueReached) * (CGFloat.pi / 180) //this converts degrees to radians and applies it where I want it.
}

盡管只有16點,但我發現即使不應用動畫,它看起來也相當流暢。 謝謝閱讀。

這是我的圓形滑塊的gif效果

這是我的第一本指南,如果需要更多信息(或應該在其他地方),請告訴我。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM