Блог

Я создаю функцию, аналогичную функции «избранное» в примере приложения Apple Fruta SwiftUI. Пользователи этого приложения могут просматривать список смузи и отмечать любой смузи как «любимый». Список избранного сохраняется и отображается на отдельном экране.

Приведенный ниже пример представления выполняет две важные функции:

1. Он проверяет, есть ли смузи уже в списке избранных isFavorite , чтобы это могло быть отражено изображением кнопки.
2. Он добавляет / удаляет этот коктейль в / из списка избранного с toggleFavorite помощью .

Модель:

 struct Smoothie: Identifiable, Codable {
    var id: String
    var title: String
    var description: String
    var hasFreeRecipe = false
}

class FrutaModel: ObservableObject {
    @Published private(set) var favoriteSmoothieIDs = Set<Smoothie.ID>()

    func toggleFavorite(smoothie: Smoothie) {
        if favoriteSmoothieIDs.contains(smoothie.id) {
            favoriteSmoothieIDs.remove(smoothie.id)
        } else {
            favoriteSmoothieIDs.insert(smoothie.id)
        }
    }
    
    func isFavorite(smoothie: Smoothie) -> Bool {
        favoriteSmoothieIDs.contains(smoothie.id)
    }
}
 

Вид кнопки, который используется для (отмены) добавления смузи в избранное:

 struct SmoothieFavoriteButton: View {
    @EnvironmentObject private var model: FrutaModel
    
    var smoothie: Smoothie?
    
    var isFavorite: Bool {
        guard let smoothie = smoothie else { return false }
        return model.favoriteSmoothieIDs.contains(smoothie.id)
    }
    
    var body: some View {
        Button(action: toggleFavorite) {
            Label("Favorite", systemImage: isFavorite ? "heart.fill" : "heart")
        }
    }
    
    func toggleFavorite() {
        guard let smoothie = smoothie else { return }
        model.toggleFavorite(smoothie: smoothie)
    }
}
 

Моя проблема: как я могу добиться аналогичного результата при использовании переключателя вместо кнопки? Для переключения требуется привязка в качестве свойства, но поскольку isFavorite значение для конкретного смузи берется из Set ( favoriteSmoothieIDs ), который содержит полный список избранного, я не могу просто предоставить привязку для переключателя.

Это необходимый код:

 @State var isToggleFavorite = false

Toggle("", isOn: $isToggleFavorite)
            .onChange(of: isToggleFavorite) { value in
                guard let smoothie = smoothie else { return }
                model.toggleFavorite(smoothie: smoothie)
            }
 

Здесь я добавил код, который отвечает на ваш запрос, и оставил оригинал нетронутым.

 struct SmoothieFavoriteButton: View {
    @EnvironmentObject private var model: FrutaModel
    
    var smoothie: Smoothie?

    @State var isToggleFavorite = false // <== Newly Added

    var isFavorite: Bool {
        guard let smoothie = smoothie else { return false }
        return model.favoriteSmoothieIDs.contains(smoothie.id)
    }
    var body: some View {
        Toggle("", isOn: $isToggleFavorite)
            .onChange(of: isToggleFavorite) { value in
                guard let smoothie = smoothie else { return }
                model.toggleFavorite(smoothie: smoothie)
            } // <== Newly Added

        Button(action: toggleFavorite) {
            Label("Favorite", systemImage: isFavorite ? "heart.fill" : "heart")
        }
        .foregroundColor(isFavorite ? .accentColor : nil)
        .accessibility(label: Text("(isFavorite ? "Remove from" : "Add to") Favorites"))
        } // <== Newly Added
    } 
    
    func toggleFavorite() {
        guard let smoothie = smoothie else { return }
        model.toggleFavorite(smoothie: smoothie)
    }
}
 

[]

Вы можете заменить кнопку текстовым объектом:

  Text(isToggleFavorite ? Image(systemName: "heart.fill"): Image(systemName: "heart"))
 

Но тогда вам нужно будет сохранить значение isFavorite.

Если наличие сердечка в левой части переключателя приемлемо, вы можете полностью удалить кнопку и поместить изображение сердечка в метку переключателя:

 Toggle(isOn: $isToggleFavorite) {
                isToggleFavorite ?
                    Image(systemName: "heart.fill") : Image(systemName: "heart")
            }
            .onChange(of: isToggleFavorite) { value in
                guard let smoothie = smoothie else { return }
                model.toggleFavorite(smoothie: smoothie)
            }
 

Вам доступно несколько опций.