В одном из моих приложений мне нужно было показать рейтинги фильма. Я решил реализовать контроль рейтингов в SwiftUI. Было удивительно видеть, насколько легко было реализовать рейтинговое представление в SwiftUI Framework по сравнению с UIKit. В этом посте я подробно расскажу о реализации просмотра рейтингов.
Выполнение
Мы начнем с создания нового представления SwiftUI под названием RatingView. RatingView позволит пользователю передать текущий рейтинг и максимальное количество отображаемых звезд. Это показано в следующей реализации.
Причина наличия свойства @Binding заключается в том, что вызывающий или родительский объект может передать рейтинг и обновить его на своей стороне.
Наша первая задача - отобразить пустые звезды в зависимости от максимального количества звезд. Это легко сделать, как показано в реализации ниже:
Это создаст пустые звезды, как показано на следующем снимке экрана.
Это хорошее начало, но мы хотим иметь возможность нажимать на каждую звезду в отдельности. Это можно сделать с помощью onTapGesture, как показано ниже:
Теперь, когда мы нажимаем на звезду, индекс звезды сохраняется в свойстве рейтинга. К сожалению, это не заполняет звезды автоматически. Чтобы заполнить звезды, нам нужно переключаться между заполненным звездочкой и изображением звезды в зависимости от количества выбранных звезд. Это можно сделать прямо в представлении Image, но чтобы прояснить ситуацию, мы создали отдельную функцию под названием starType, как показано ниже:
Функции starType принимают индекс, а затем возвращают либо star.fill, либо star в зависимости от значения индекса AKA rating.
Наконец, мы обновляем тело RatingView, чтобы использовать функцию starType, как показано ниже:
И это все. Теперь мы можем использовать RatingView в любом другом представлении, как показано ниже:
На анимации ниже показан окончательный результат.
Если вам понравилась эта статья и вы хотите поддержать мою работу, ознакомьтесь с моим курсом Udemy по SwiftUI.
