Creating Custom Wheel
Empty Wheel
In the prefabs folder you can find a subfolder called WheelComponents
Drag following prefabs to your scene:
EmptyWheel
LUCKY_WHEEL_CONFIG
Wheel UI (optional if you want to reuse it, otherwise you can also create your own UI)
Your scene should look something like this
Separators
In the same prefab folder where you found the other wheel components there is a Separator (1) prefab. Depending on how much reward sections you want to create, add X of them to EmptyWheel→Wheel→SeparatorHolder. Then rotate each separator along the Z axis until you get your desired outcome.
Adding 10 separators, rotating the SeparatorHolderby 18 and rotating each separator by 36 degrees more than the previous one results in following wheel.
Basically what I do is I calculate the rotation by 360 divided by the amount of separators. In our case it equals 36. So I set up the separator rotation like 36, 72, 108 etc. To offset the separators so no separator is directly under the Pin, i divide the 36 by 2 and use this as the rotation for the SeparatorHolder (which in our case is 18)
Rewards
Now it’s time to add some rewards to it. In the same prefab folder you can find the WheelReward (1) prefab drag it to the RewardHolder. Click on the added object and in scene view there should appear some handlers for the 2d collider
With the green arrows you can move the collider position and with the blue and red cubes you can resize it. Make sure that the collider is between the 2 orange separator knobs and that it is going at least outside of the inner blue circle. So we can make sure that the pin collider detects the proper reward when the wheel stops.
Now duplicate your WheelReward X times. Duplicating in unity will ensure that the next reward number at the end of the name is automatically incremented, so you will have objects ranging from WheelReward (1) until WheelReward (X).
Please do not delete the number at the end of the reward name.
The wheel component initializer will automatically parse the name, detect this number and assign the proper reward amount and icon, configured in your LUCKY_WHEEL_CONFIG.
After setting up all rewards it should look something like that:
Connect Wheel to UI
Go to the startButton and drag the Wheel component from the empty wheel to the OnClick handler of the button, then select LuckyWheelSpinner.Spin
And that’s it. Congratulations, you have just created your own customized lucky wheel!
Last updated