Изменение цвета кнопки в SwiftUI на tvOS

Question

Я пытаюсь изменить цвет SwiftUI Button в tvOS.

Изменение background почти работает, за исключением того, что вы можете видеть, что базовый UIButton на самом деле использует округленное,полупрозрачное изображение поверх фона.Это приводит к другому цвету в углах, где прямоугольный фон лежит за пределами округленного изображения.

Добавление .padding подчеркивает эту проблему:

struct ContentView: View {

    @State
    var selected = false

    var body: some View {

        Button(action: {
            self.selected.toggle()
        }) {
               Text($selected.wrappedValue ? "On":"Off")
                .foregroundColor(.white)
            }.padding(.all)
             .background(self.selected ? Color.green : Color.blue)
        }
    }
}

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

Типичная техника в tvOS с UIButton состоит в изменении изображения кнопки, но, похоже, нет никакого способа получить доступ к изображению лежащего в основе UIButton.

Answer 1

Опять же, я проверил это только на iOS, но это должно помочь:

struct ContentView: View {

    @State var selected = false

    var body: some View {

        Button(action: { self.selected.toggle() }) {
            Text($selected.wrappedValue ? "On":"Off")
                .foregroundColor(.white)
        }   .padding(.all)
            .background(RoundedRectangle(cornerRadius: 5.0)
                            .fill(self.selected ? Color.green : Color.blue))

    }
}

Вы можете передать любое представление в модификатор .background (), так что вы также можете попробовать разместить Image () там.

Answer 2

Этот код работает нормально на iOS, но, как вы показали, в tvOS видна нижележащая кнопка UIB.Я не уверен, как добраться до соответствующей кнопки или ее изображения, но, похоже, вы можете взломать ее сейчас (пока Apple не решит проблему или не предоставит способ добраться до этой кнопки).

Сначалапереместите отступ вверх, чтобы изменить текст так, чтобы он правильно воздействовал на нижележащую кнопку.

Во-вторых, (и это хак) обрежьте вид после модификатора фона с помощью cornerRadius.Пока радиус равен или больше, чем у базовой кнопки, он отсекает лишний фон.(Конечно, вы видите не зеленый цвет, а цвет, возникающий из-за зеленого цвета, наложенного на серый полупрозрачного изображения кнопки. По крайней мере, так показано в Xcode.)

struct ContentView: View {

    @State var selected = false

    var body: some View {

        Button(action: {
            self.selected.toggle()
        }) {
            Text($selected.wrappedValue ? "On":"Off")
                .foregroundColor(.white)
                .padding(.all)
        }
        .background(self.selected ? Color.green : Color.blue)
        .cornerRadius(5)
    }
}