Atualmente, estou usando vários Text
s em uma stackview horizontal para obter animação de substring.
Como você pode ver na animação acima, o texto
- conversation
- meeting
- lecture
são animados.
Entretanto, há deficiências nessa abordagem.
O tamanho do texto não é consistente entre diferentes blocos de texto. Os Text
blocos a seguir têm tamanhos de texto diferentes.
- Transform
- conversation/ meeting/ lecture
- to Quick Note
Alguma ideia de como podemos fazer com que todos os blocos de texto tenham o mesmo tamanho de texto para que pareçam uma frase?
Ou como podemos fazer com que os blocos de texto tenham tamanho de texto constante, mas sejam capazes de realizar quebra de linha para a próxima linha , para que pareçam uma frase?
Atualmente, este é o trecho de código que estou usando.
import SwiftUI
struct ContentView: View {
var array = ["lecture", "conversation", "meeting"]
@State var currentIndex : Int = 0
@State var firstString : String = ""
var body: some View {
VStack {
HStack {
Text("Transform")
.lineLimit(1)
.minimumScaleFactor(0.5)
.font(.title)
Text(firstString)
.lineLimit(1)
.minimumScaleFactor(0.5)
.font(.title)
.transition(AnyTransition.opacity.animation(.easeInOut(duration:1.0)))
.background(.yellow)
Text("to Quick Note")
.lineLimit(1)
.minimumScaleFactor(0.5)
.font(.title)
}.padding()
}
.animation(.default)
.onAppear {
firstString = array[0]
let timer = Timer.scheduledTimer(withTimeInterval: 2.0, repeats: true) { _ in
if currentIndex == array.count - 1 {
self.firstString = array[0]
currentIndex = 0
}
else {
self.firstString = array[currentIndex+1]
currentIndex += 1
}
}
}
}
}
#Preview {
ContentView()
}
Para manter tudo em uma linha com um tamanho de fonte consistente, tente estas alterações:
.minimumScaleFactor
paraHStack
..scaledToFit
tambémHStack
.Outras sugestões:
.font
aoHStack
, em vez de a cadaText
item individual..transition
modificador é redundante, porque é o conteúdo doText
que está mudando, nenhuma visualização está sendo inserida ou removida. No entanto, você pode considerar usar.contentTransition
se não quiser que a.opacity
transição padrão seja vista quando o conteúdo mudar..animation
modificador está obsoleta. Adicione umvalue
parâmetro para corrigir isso.Aqui está uma versão atualizada do exemplo. Isso também ilustra como usar
task(id:priority:_:)
para a animação cronometrada.