Управление макетом просмотра текста с помощью SwiftUI

#swift #swiftui

#быстрый #свифтуи

Вопрос:

У меня есть следующее Text представление SwiftUI:

 Text("Hello, world. foo bar foobar foo hello world")  .frame(maxWidth: .infinity, alignment: .leading)  .padding()  .background(Color.red)  

который отображается следующим образом (скриншоты из предварительного просмотра Xcode, iPhone 13 Pro):

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

Добавление одного символа в строку приводит к тому, что представление отображается следующим образом:

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

В первой строке явно есть место для «привет», но механизм компоновки разбивает строки, предположительно, там, где он чувствует себя лучше всего. Есть ли какой-либо способ контролировать это, чтобы текст тек как можно дальше в каждой строке в рамках ограничений представления?

Комментарии:

1. Я не вижу никаких проблем, когда пробую ваш код.

2. Я думаю, что на самом деле это не макет, а что-то вроде стиля , в данном случае, чтобы избежать единственного слова в следующей строке, т. Е. если вы добавите, например, слово » больше » в конце, то » привет » вернется к первой строке. Я не думаю, что это можно контролировать с помощью SwiftUI.

Ответ №1:

Возможно, вы могли бы использовать наложение с Text фиксированным размером по горизонтали. Это будет означать Text , что текст займет только 1 строку и не будет переноситься на следующую строку из-за слишком длинного текста.

Код:

 Text("")  .frame(maxWidth: .infinity)  .overlay(alignment: .leading) {  Text("Hello, world. foo bar foobar foo hello world more words etc etc")  .fixedSize(horizontal: true, vertical: false)  }  .padding()  .background(Color.red)  

Ответ №2:

введите описание изображения здесьЯ не обнаружил никаких проблем с вашим текущим кодом, однако он может занимать больше символов не только один, но вы также можете использовать это .lineLimit() для управления большей гибкостью:

 see my output image: `Text("Hello, world. foo bar foobar fooooooooo, hello world")  .frame(maxWidth: .infinity, alignment: .leading)  .lineLimit(1)  .padding()  .background(Color.red)`[![output][1]][1]