Как предотвратить выталкивание представления другим представлением, расширяющимся в SwiftUI

Question

Если у вас есть что-то подобное. Вы увидите, что нижние виды и выровнены друг с другом.

              HStack(spacing: 0) {
            Rectangle()
                .fill(Color.smashFrameStartup)
                .overlay(
                    VStack {
                        Text("Data").font(.system(size: 100.0))
                        Text("rectangle 1")
                    }
                )

            Rectangle()
                .fill(Color.smashOnShield)
                .overlay(
                    VStack {
                        Text("Data").font(.system(size: 100.0))
                        Text("rectangle 2")
                    }
                )
        }

Однако, как только вы сделаете верхний текст длиннее из "Data" к "Data 2"или что-то еще, вы можете видеть, что вид сверху сдвигает вид снизу еще ниже. Как предотвратить смещение нижнего представления вниз независимо от длины текста на верхнем экране?

Вот обновленный код и что происходит.

              HStack(spacing: 0) {
            Rectangle()
                .fill(Color.smashFrameStartup)
                .overlay(
                    VStack {
                        Text("Data").font(.system(size: 100.0))
                        Text("rectangle 1")
                    }
                )

            Rectangle()
                .fill(Color.smashOnShield)
                .overlay(
                    VStack {
                        Text("Data 2").font(.system(size: 100.0))
                        Text("rectangle 2")
                    }
                )
        }

Можно ли расположить текстовое представление так, чтобы оно не двигалось? Я бы хотел rectangle 2 быть согласованным с rectangle 1 независимо от длины текстового представления на любом из прямоугольников.

Я также должен отметить, что если приведенная выше строка текстового представления длинная, как показано ниже, она будет усечена, что мне не нужно.

              HStack(spacing: 0) {
            Rectangle()
                .fill(Color.green)
                .overlay(
                    VStack {
                        Text("Data").font(.system(size: 100.0))
                        Text("rectangle 1")
                    }
                )

            Rectangle()
                .fill(Color.red)
                .overlay(
                    VStack {
                        Text("Data 2 with even more information here").font(.system(size: 100.0))
                        Text("rectangle 2")
                    }
                )
        }

Я также пробовал добавить с помощью 0.4 и он показывает весь текст без его усечения, но у него та же проблема, когда он толкает нижний текстовый вид дальше вниз.

              HStack(spacing: 0) {
            Rectangle()
                .fill(Color.green)
                .overlay(
                    VStack {
                        Text("Data").font(.system(size: 100.0))
                        Text("rectangle 1")
                    }
                )

            Rectangle()
                .fill(Color.red)
                .overlay(
                    VStack {
                        Text("Data 2 with even more information here").font(.system(size: 100.0))
                            .minimumScaleFactor(0.4)
                        Text("rectangle 2")
                    }
                )
        }

РЕДАКТИРОВАТЬ: критерии

1. Выровняйте положение двух нижних текстовых представлений в каждом прямоугольнике друг с другом, как на первом рисунке, и в этом месте на экране.
2. Верхнее текстовое представление может иметь переменную длину, будь то 2 или до 40 символов, это не должно вызывать смещение нижнего текстового представления вниз. Следует отметить, что длина строки в верхнем текстовом представлении может отличаться от длины верхнего текстового представления в другом прямоугольнике. Несмотря на это, нижние виды не должны опускаться вниз и должны быть выровнены друг с другом.
3. Если текстовая строка вида сверху начинает становиться слишком длинной, можно изменить размер шрифта до тех пор, пока мы не смещаем нижний текстовый вид. Чтобы показать весь текст.
4. Очень длинная строка на виде сверху не должна быть обрезана, как на третьем рисунке. Я попытался исправить это с помощью minimumScaleFactor и усеченная проблема исправлена, как на четвертом рисунке, но, как вы можете видеть, нижнее текстовое представление все еще смещено.