web-dev-qa-db-ja.com

Swiftuiリストセクションの角の丸み

以下は、iOS 13 Healthアプリのユーザープロフィールのスクリーンショットです。私は最近 swiftui から始めて、以下のような画面を開発する方法を考えました。私はプレーンなスタイルとグループ化されたスタイルを試してみました。でも下のレイアウトは見れませんでした。

このようなUIは、純粋に swiftui-list を使用して開発できますか？

丸みを帯びたセクションを特に探しており、リスト内に画像を含めています。 iOS 13 Health Application - User profile

swiftuiios13swiftui-list
7
uiroshan

私の調査結果によると、Xcode 11 GMシード2（11A420a））では、このUIを作成することは、swiftuiリストだけでは不可能です。

insetGrouped という名前のストーリーボードで使用できる新しいリストスタイルがあります。見た目はまったく同じです。 https://developer.Apple.com/documentation/uikit/uitableview/style

1
uiroshan

私は同じ問題に遭遇し、リストまたはセクションではこれを達成できないようです。

CornerRadiusモディファイヤをセクションまたはリストに配置すると、セクション自体は変更されずに内部がセルを丸めているものに適用されます。

私の解決策は、リストとセクションを完全に避け、カスタムのものを作成することでした。

何かのようなもの

_SectionView: View {

    body: some View = {
        VStack {
            ForEach {
                CellView()
            }
        }
        .background(Color.white)
        .cornerRadius(10)
        .padding()
    }
}
_

そして、これらのセクションをいくつかのColorのZStackビューの上に置いて、背景を灰色にします。

大きな欠点は、ForEachがすべてのセルをすぐにレンダリングすることです。たとえば、1,000個のセルがある場合、各セルに対してonAppear()が呼び出され、奇妙なことに逆順に呼び出されます。

それが役に立てば幸い。

1
Ivan