【SwiftUI】HStackを下寄せにした時の要素の下辺を揃える

はじめに

タイトルでは意味がわからないと思うので説明します。

今回何をしたいのか

要素を横並びにしてalignmentで.bottomを指定しています

import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack(alignment: .bottom, spacing: 10) {
            Text("タイトル")
                .font(.system(size: 50, weight: .bold))
                .foregroundColor(.primary)
            Text("サブタイトル")
                .font(.system(size: 15, weight: .regular))
                .foregroundColor(.secondary)
        }
        .background(Color.cyan)
    }
}

上記のコードだとこのようになります。

下を揃えたいのに揃っていません。

これを揃えていきたいと思います。

実装

import SwiftUI

struct ContentView: View {
    var body: some View {
        HStack(alignment: .bottom, spacing: 10) {
            Text("タイトル")
                .font(.system(size: 50, weight: .bold))
                .foregroundColor(.primary)
            Text("サブタイトル")
                .font(.system(size: 15, weight: .regular))
                .foregroundColor(.secondary)
+               .baselineOffset(7)
        }
        .background(Color.cyan)
    }
}

ちゃんと揃いました。

ドキュメント

おわり

たまたま見つけましたー