CODEWITHSUNDEEP
swiftuiswiftui-navigationlink
mitchellOcavoos
mitchellOcavoos

Reputation: 83

SwiftUI: replacing custom map button with a MapPin as a button?

I was using a custom button on a map but I realized now I want to use a normal pin, such as MapPin. How can I change my code to adjust for the use of MapPin so that when I click on it, the same actions take place .

   Map(coordinateRegion: $region, annotationItems: getAnnotated()) { item in
            MapAnnotation(coordinate: item.coordinate) {
                Button(action: {
                    selected.item = item  // <--- here
                    showSheet.toggle()
                }){
                    Image("icon")
                        .resizable()
                        .frame(width: 70, height: 70)
                        .foregroundColor(.white)
                        .cornerRadius(9.0)
                }
                .background(Circle())
                .foregroundColor(Color.green)
            }
        }

I tried swapping out Image() for MapPin() as a last ditch effort but that didn't work.

Upvotes: 0

Views: 213

Answers (1)

workingdog support Ukraine
workingdog support Ukraine

Reputation: 36304

you could try this:

Map(coordinateRegion: $region, annotationItems: getAnnotated()) { item in
    MapAnnotation(coordinate: item.coordinate) {
        Button(action: {
            selected.item = item
            showSheet.toggle()
        }){
            Image(systemName: "mappin.and.ellipse")  // <---
                .scaleEffect(2.0)
                .foregroundColor(.red)
                .padding()
        }
        .background(Circle())
        .foregroundColor(Color.clear)  // <---
    }
}

or "mappin.circle", "mappin"

and adjust the colors as you see fit.

Upvotes: 1

Related Questions