SwiftUI: переключение внутри списка не использует полную ширину в iOS 18

Я пытаюсь создать представление внутри списка, занимающее всю ширину экрана. Автономный вид делает это. Попав в список, он занимает ~60% доступного места.

Я уже пробовал использовать .frame(minWidth: .infinity) в списке или в представлении, но это ничего не меняет. Я также пробовал различные стили для списка, но безуспешно.

struct TodoRow: View {
    @Binding var todo: Todo

    var body: some View {
        Toggle(isOn: $todo.isDone) {
            Text(todo.content ?? "")
        }
        .border(.red)
        .toggleStyle(.switch)
    }
}

struct ContentView: View {
   @State var td1 = Todo(content: "Hello Todo World 20240706T15:23:42.256Z", isDone: false)

    var body: some View {
        
        List {
            TodoRow(todo: $td1)
            TodoRow(todo: $td1)
        }
        .border(.green)
        
        TodoRow(todo: $td1)
            .border(.blue)
    }
}

SwiftUI: переключение внутри списка не использует полную ширину в iOS 18

Я не могу воспроизвести такое поведение. На какой версии iOS и модели устройства вы используете это?

Sweeper 06.07.2024 16:47

Хороший улов. Я использую Xcode 16 beta 2 и iOS 18 beta. Скачаю симулятор iOS 17, чтобы попытаться воспроизвести его в выпущенной версии.

Sébastien Stormacq 06.07.2024 17:25
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
1
2
56
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это изменение стиля Toggle по умолчанию в iOS 18, при котором переключатель размещается под текстом там, где это необходимо.

Вы можете легко воссоздать старый стиль, например:

struct TodoRow: View {
    @Binding var todo: Todo

    var body: some View {
        HStack { // 👈 Make sure this will be stacked horizontally
            Text(todo.content ?? "") // 👈 Add the leading text in place
                .frame(maxWidth: .infinity, alignment: .leading) // 👈 Make it always fill the space
            Toggle(isOn: $todo.isDone) {
                Text(todo.content ?? "")
            }
            .labelsHidden() // 👈 Hides the default label keeping the accessibility stuff
        }
        .toggleStyle(.switch)
    }
}

Demo

Спасибо @mojtaba за ваш ответ, я видел, что вы уже ответили на тот же вопрос. Это критическое изменение в SwiftUI для iOS18, я отправил отзыв в Apple (ссылка FB14233030).

Sébastien Stormacq 08.07.2024 08:19

Другие вопросы по теме

Похожие вопросы

Почему полученные сообщения не отображаются в пользовательском интерфейсе?
Доступ к модели Qt Quick ListView из вложенных элементов в пользовательском делегате
Событие потери фокуса на клиентской стороне текстового поля asp.net в элементе управления ListView
Как использовать этот вид для изменения моих элементов, как на этой фотографии
Невозможно создать правильный макет во флаттере
Комбинирование чередующихся цветов строк с гладким прямоугольником выделения в QML ListView
Как создать многоразовый простой пользовательский стиль списка с моим собственным цветом и интервалом
Используя формы Windows PowerShell, создайте список с многострочными заголовками
CustomScrollView с центральной клавишей и несколькими полосами: разворачивайте виджеты в разных направлениях
Код Kotlin сообщает: «Ни одна из следующих функций не может быть вызвана с указанными аргументами»