Другой способ использования превью XCode

То, что я придумал, я уверен, не является чем-то революционным или новым. Я знал, что этот метод раньше использовался в других инструментах, особенно при работе с HTML. Чтобы перейти к сути, в основном вы можете использовать предварительный просмотр для компоновки различных стилей созданных вами представлений.

Лучшим примером этого являются цвета для ярлыков в «Решительной жене». Когда я изначально создавал цвета для меток для iOS 12, мне приходилось создавать метки для каждого цвета и просматривать коллекцию в представлении «Спросите Шери». Это позволило мне определить лучшие цвета для текста и границы, чтобы все было видно. С перемещением SwiftUI я добавил новые цвета, такие как розовый и голубой. Вместо того, чтобы создавать метки в приложении и перезапускать каждый раз, когда я вношу изменения, я создал следующий предварительный просмотр, используя новое представление коллекции.

Переход на iOS 14 дал мне доступ к цветным активам вместо стандартных, предоставленных мне ОС. Поэтому я пошел и создал более приглушенные цвета, чтобы они не были такими яркими. Используя новую систему предварительного просмотра, я смог быстро проверить, хорошо ли совпадают выбранные цвета границ и текста.

struct LabelColor_Previews: PreviewProvider {
  static var previews: some View {
    let columns: [GridItem] = Array(repeating: .init(.flexible()), count: 2)
    return LazyVGrid(columns: columns) {
      ForEach(LabelColor.allCases) { labelColor in
        Text(labelColor.rawValue)
              .padding(8)
              .frame(width: 100)
              .foregroundColor(labelColor.textColorSU)
              .background(labelColor.backgroundColorSU)
              .border(labelColor.borderColorSU, width: 4)
              .cornerRadius(5)         
       }
       .padding(2)
    }
    .background(Color.lightShades)
  }
}

Другим примером этого является мой предварительный просмотр стилей кнопок. У меня пока только два, но простой VStack может разместить их, так что я могу быстро просмотреть их, не переходя к экрану, который их использует.

struct ButtonStyles_Previews: PreviewProvider {
    static var previews: some View {
        VStack {
            Button("ClassicRctBtnStyle") {
                print("classic btn touched")
            }
            .buttonStyle(ClassicRctBtnStyle())
            Button("NavBarBtnStyle") {
                print("nav btn touched")
            }
            .buttonStyle(NavBarBtnStyle())
        }
        .background(Color.lightShades)
    }
}