As per image, Arrow based works but now how to add one more white circle over gauge View and move same as white aarow.
Below is the code
type here
struct Home : View {
var body: some View{
VStack{
Meter
.padding(.top, 10)
}
}
}
struct Meter : View {
//speedometerBgColor
let colors = [Color("speedoColor5"),Color("speedoColor25"),Color("speedoColor50"),Color("speedoColor100")]
@State var progress : CGFloat = 0.0
var body: some View{
ZStack{
ZStack{
Circle()
.trim(from: 0.0, to: 0.5)
.stroke(Color("speedometerBgColor"), lineWidth: 10)
.frame(width: 280, height: 280)
Circle()
.trim(from: 0, to: self.setProgress())
.stroke(AngularGradient(gradient: .init(colors: self.colors), center: .center, angle: .init(degrees: 180)), lineWidth: 10)
.frame(width: 280, height: 280)
}
.rotationEffect(.init(degrees: 180))
if isFromHomeScreen{
ProgressBarTriangle().rotationEffect(.degrees(self.setArrow()), anchor: .bottomTrailing)
.rotationEffect(.init(degrees: -40)).padding(EdgeInsets(top: 0, leading: -85, bottom: 40, trailing: 0))
ZStack(alignment: .bottom) {
Circle()
.fill(self.colors[3])
.frame(width: 25, height: 25).padding(.init(top: 0, leading: 0, bottom: 40, trailing: 0))
}
}
}.padding(.bottom, -140)
}
.onAppear {
withAnimation(Animation.default.speed(0.1)){
progress = CGFloat(Int(newValue)) self.progress = 100
}
}
func setProgress()->CGFloat{
let temp = self.progress / 2
return temp * 0.01
}
func setArrow()->Double{
let temp = self.progress / 100
return Double(temp * 180)
}
}
struct ProgressBarTriangle: View {
// @Binding var progress: Float
var body: some View {
ZStack{
Image("arrow")
}
}
}
I trying to replace image
struct ProgressBarTriangle: View {
// @Binding var progress: Float
var body: some View {
ZStack{
Image("arrowWithCirclePointer")
}
}
}





