SwiftUI: проблема с текстом во время анимации

Question

У меня проблема с анимацией, которая включает Text. В основном мне нужно изменить текст и анимировать его позицию. Посмотрите на этот простой пример ниже:

import SwiftUI

struct ContentView: View {
    @State private var isOn = false
    @State private var percentage = 100

    var body: some View {
        ZStack {
            Text("\(percentage)")
                .font(.title)
                .background(Color.red)
                .position(isOn ? .init(x: 150, y: 300) : .init(x: 150, y: 100))
                .animation(.easeOut(duration: 1), value: isOn)

            VStack {
                Spacer()
                Button(action: {
                    self.isOn.toggle()

                    //just to make the issue happen
                    if self.percentage == 100 {
                        self.percentage = 0
                    } else {
                        self.percentage = 100
                    }
                }, label: {
                    Text("SWITCH")
                })
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Результат:

Здесь есть некоторые проблемы. Вероятно, наиболее раздражающим является сбой с .... Я просто хочу анимировать положение Text, я не хочу анимировать сам текст и не хочу анимировать ширину текста. Любые идеи? Спасибо.

Answer 1

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

Единственные необходимые изменения, как указано ниже (коэффициент, изменяемый, конечно)

Text("\(percentage)")
    .minimumScaleFactor(0.5)

Answer 2

Попробуйте это действие на кнопке:

 Button(action: 
 {
   //just to make the issue happen
   if self.percentage == 100 
   {
     self.percentage = 0
   } 
   else 
   {
     self.percentage = 100
   }
   withAnimation(.easeInOut(duration: 1.0)) {
     self.isOn.toggle()
   }

 }, label: {
   Text("SWITCH")
 })

И удалите эту строку из ярлыка

 .animation(.easeOut(duration: 1), value: isOn)

Я еще не проверял.