Остановить анимацию SwiftUI от горизонтального движения - PullRequest
0 голосов
/ 26 октября 2019

У меня есть анимация, которая создает шаблон сердцебиения. Проблема в том, что как только текст (в том же HStack) изменяется с разумным краем, анимация колеблется горизонтально, потому что текст толкается. Как я могу предотвратить это? Есть ли способ закрепить изображение, чтобы этого драматического горизонтального движения не произошло?

        HStack(alignment: .bottom){
            Text("\(self.hr)") +  Text("BPM")
            Image(systemName: "heart.fill")
                .padding(.init(top: 5, leading: 5, bottom: 10, trailing: 5))
                .foregroundColor(self.outdatedHR ? Color.gray : Color.red)
                .scaleEffect(self.heart ? 1.05: 0.95, anchor: .center)
                .opacity(self.heart ? 1.0: 0.75)
                .animation(Animation.easeInOut.repeatForever())
                .onAppear{
                    self.heart.toggle()
            }

        }

enter image description here

Ответы [ 2 ]

1 голос
/ 27 октября 2019

Дайте вам идеальный ответ

 .animation( Animation.easeInOut.repeatForever(), value: self.heart)

Это будет гарантировать перезапуск анимации после self.heart изменения

1 голос
/ 27 октября 2019

Я вижу несколько возможностей:

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

HStack(alignment: .bottom) {
    VStack(alignment: .leading, spacing: -20) {
        Text("888 BPM").hidden()
        Text("\(self.hr) BPM")
    }
    Image(systemName: "heart.fill")
    //etc.
}

Другой вариант - указать Text явную ширину кадра. Тем не менее, он не идеален для динамического текста:

Text("\(self.hr) BPM").frame(width: 100)

Вы также можете поместить Spacer() между двумя элементами и толкнуть сердце вправо.

...