SwiftUI Ярлык текста и изображения смещены по вертикали

Я использую новый Label вид SwiftUI, работающий под управлением Xcode 12 бета на Биг Сур.

В качестве изображения я использую символ SF и нашел изображение с именем "play". Но я заметил ту же проблему с пользовательскими изображениями без каких-либо пограничных пикселей (т.е. интервал не вызван изображением), например. Значки PDF, поэтому они, вероятно, не связаны с изображением.

В демо от Apple текст и изображение должны автоматически выравниваться должным образом, но я этого не вижу.

struct ContentView: View {
    var body: some View {
        Label("Play", systemImage: "play")
    }
}

Результатов в этом:

введите описание изображения здесь

Есть идеи, почему изображение (значок) и текст смещены по вертикали?

Если мы дадим кнопке цвет фона, мы более точно увидим смещение:

Label("Play", systemImage: "play")
    .background(Color.red)

Результатов в этом:

введите описание изображения здесь


person Sajjon    schedule 24.06.2020    source источник
comment
Я тоже это заметил. Это может быть проблема с символами SF, и нам, возможно, придется дождаться SF Symbols 2. Или это может быть проблема с бета-версией.   -  person Andrew    schedule 24.06.2020
comment
Та же проблема со значками не-SF Symbols, просто попробовал значок PDF, который я использовал в других проектах, добавит эту деталь к вопросу ...   -  person Sajjon    schedule 24.06.2020


Ответы (2)


Вероятно, это ошибка, поэтому стоит отправить отзыв в Apple. А пока вот рабочее решение, основанное на собственном стиле меток.

Протестировано с Xcode 12b

введите описание изображения здесь

struct CenteredLabelStyle: LabelStyle {
    func makeBody(configuration: Configuration) -> some View {
        HStack {
            configuration.icon
            configuration.title
        }
    }
}

struct TestLabelMisalignment: View {
    var body: some View {
        Label("Play", systemImage: "play")
           .labelStyle(CenteredLabelStyle())
    }
}
person Asperi    schedule 24.06.2020

@Sajjon Вы можете добавить собственный View в качестве обходного пути и использовать изображение с текстом внутри HStack

person user2731717    schedule 05.07.2020