Home > Back-end >  Swift Fortune Wheel changing color issue
Swift Fortune Wheel changing color issue

Time:09-16

Im making an app where i have to add fortune wheel, for this i search the pod and find this library very useful https://github.com/sh-khashimov/SwiftFortuneWheel. Almost every thing is customisable but now i'm facing one issue with the library. i have a requirement that each slice color will be change once wheel stop, means winning color will be different and losing color will be different after wheel stop. i try to update it color is changing but now wheel is not stoping at correct index. which was stoping before i update color. can any one let me know what i'm doing wrong here. im pasting my code implentation here too. also i raised detail issue in github too https://github.com/sh-khashimov/SwiftFortuneWheel/issues/20.

import UIKit
import SwiftFortuneWheel

class VariousWheelPodiumViewController: UIViewController {

var selectedIndex = -1


@IBOutlet weak var wheelControl: SwiftFortuneWheel!

var prizes = [(id:0,name: "MONEYMONEY", color: #colorLiteral(red: 0.9607843137, green: 0.768627451, blue: 0.568627451, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1),losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1), textColor: #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)),
              (id:1,name: "GRAPHIC", color: #colorLiteral(red: 0.9843137255, green: 0.9098039216, blue: 0.8274509804, alpha: 1),winningColor: #colorLiteral(red: 0.9607843137, green: 0.768627451, blue: 0.568627451, alpha: 1), losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)),
              (id:2,name: "HOME", color: #colorLiteral(red: 0.9607843137, green: 0.768627451, blue: 0.568627451, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1),losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1), textColor: #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)),
              (id:3,name: "IDEA", color: #colorLiteral(red: 0.9843137255, green: 0.9098039216, blue: 0.8274509804, alpha: 1), winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1), losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)),
              (id:4,name: "MANAGMENT", color: #colorLiteral(red: 0.9607843137, green: 0.768627451, blue: 0.568627451, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1), losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)),
              (id:5,name: "SEARCH", color: #colorLiteral(red: 0.9843137255, green: 0.9098039216, blue: 0.8274509804, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1),  losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)),
              (id:6,name: "TARGET", color: #colorLiteral(red: 0.9607843137, green: 0.768627451, blue: 0.568627451, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1),  losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)),
              (id:7,name: "TIME", color: #colorLiteral(red: 0.9843137255, green: 0.9098039216, blue: 0.8274509804, alpha: 1),winningColor: #colorLiteral(red: 0.9333333333, green: 0.6078431373, blue: 0.2705882353, alpha: 1), losingColor: #colorLiteral(red: 0.737254902, green: 0.2901960784, blue: 0.6156862745, alpha: 1),textColor: #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1))]



var slices = [Slice] ()

var finishIndex: Int {
    return Int.random(in: 0..<wheelControl.slices.count)
}



override func viewDidLoad() {
    super.viewDidLoad()

    wheelControl.configuration = .variousWheelPodiumConfiguration
    wheelControl.spinImage = "center"
    wheelControl.isSpinEnabled = false
    updateSlice()
    wheelControl.slices = slices
    
    
}

@IBAction func rotateTap(_ sender: Any) {
    let finishingIndex = self.finishIndex
    print(finishingIndex)
    wheelControl.startRotationAnimation(finishIndex: finishingIndex, continuousRotationTime: 1) { (isFinished) in
        guard isFinished else { return }
        print(self.prizes[finishingIndex])
        self.selectedIndex = finishingIndex
        self.updateSlice()
        self.wheelControl.slices = self.slices
        self.wheelControl.rotate(toIndex: finishingIndex)
    }
}

func updateSlice(){
    slices = []
    for (index,prize) in prizes.enumerated() {
        print(index,prize.name)
        
        var titleTextPreferences = TextPreferences(textColorType: .customPatternColors(colors: nil, defaultColor: .black), font: .systemFont(ofSize: 10, weight: .bold), verticalOffset: 20)
            titleTextPreferences.horizontalOffset = 10
            titleTextPreferences.orientation = .vertical
            titleTextPreferences.spacing = 0
            titleTextPreferences.alignment = .left
            
        var descriptionTextPreferences = TextPreferences(textColorType: .customPatternColors(colors: nil, defaultColor: .red), font: .systemFont(ofSize: 10), verticalOffset:-75)

        descriptionTextPreferences.horizontalOffset = 0
        descriptionTextPreferences.orientation = .vertical
        descriptionTextPreferences.spacing = 0
        descriptionTextPreferences.alignment = .left

        let content: [Slice.ContentType] = [.text(text: prize.name, preferences: titleTextPreferences),.text(text: prize.name, preferences: descriptionTextPreferences)]

        var slice = Slice(contents: content)
        if selectedIndex == -1{
            slice.backgroundColor = prize.color
        }else{
            slice.backgroundColor = index == selectedIndex ? prize.winningColor : prize.losingColor
        }
        slices.append(slice)
    }
   
}
}

CodePudding user response:

It would be nice if you could loop through the current slices and set their background colors directly. Quick testing of that code, though, and it doesn't work. Apparently, anytime you touch a "slice" object, the wheel resets its rotation.

You can try replacing your rotateTap(...) function with this:

@IBAction func rotateTap(_ sender: Any) {
    let finishingIndex = self.finishIndex
    print(finishingIndex)
    wheelControl.startRotationAnimation(finishIndex: finishingIndex, continuousRotationTime: 1) { (isFinished) in
        guard isFinished else { return }
        print(self.prizes[finishingIndex])
        self.selectedIndex = finishingIndex
        self.updateSlice()
        self.wheelControl.slices = self.slices
        
        // set rotation async on main queue 
        DispatchQueue.main.async {
            self.wheelControl.rotate(toIndex: finishingIndex)
        }
    }
}

See if that gives you acceptable results. If not, there is a more complex work-around, but ideally modify the SwiftFortuneWheel code to provide for a "modify slice property" solution.

  • Related