LoginSignup
13
6

More than 1 year has passed since last update.

[SwiftUI] iOS13では、SwiftUIは使わないべきだと思った理由7選

Last updated at Posted at 2021-12-08

iOS13の場合、ピュアSwiftUIだとなかなか厄介なことが多い

iOS13の場合、ピュアSwiftUIでアプリを作成しようと思うと、厄介なことが多い。
絶対に使うであろうコンポーネントがない...
Property Wrappersが少ない...

@StateObjectがない。

これが1番のデメリット。
複数のViewで変数を共有したり、変数が更新されるとViewを再描画できるProperty WrappersでiOS13では、@StateObjectがないので、@ObservedObjectを使う。
@ObservedObjectは、Viewが再描画されると、インスタンスは破棄され、再生成される。
@StateObjectは、Viewが再描画されると、インスタンスは破棄されても、再描画された後も維持され、再利用される。

What’s the difference between @StateObject and @ObservedObject?

@ObservedObjectだと、viewが再描画された時に、クラスが再作成され続け、すごく厄介。

・toolbarが使えない。

navigationBarTitleには画像を選択できないので、navigation barに画像を載せるのに一苦労する。
SwiftUIXや自作navigation barを使って対策は練るなどで一応対応はできる。

・フルスクリーンモーダルがない

iOS14からフルスクリーンモーダル(fullScreenCover)が用意されている。
https://developer.apple.com/documentation/swiftui/view/fullscreencover(ispresented:ondismiss:content:)

・LazyVStack系がない

LazyVStack系だと、大量のデータを表示する際に、遅延読み込みして、表示させることでパフォーマンスが向上する。
しかし、iOS13にはない。

・グリッドが作れない

iOS14からのLazyVGridでグリッドを実現できる。
iOS13では、collection viewのようなグリッドが実現できない。自作viewかライブラリでグリッドを実現するしか選択肢がない。

有名どころにQGridがある
https://github.com/Q-Mobile/QGrid

しかし、 ScrollViewの中にグリッドを置きたい時にグリッドの高さを指定しなければいけなかったりなど、厄介なところがある。

縦スクロールする画面(scrollview)の中に、LazyVStack と QGridがある場合、
LazyVGridは、Grid全体かcellの高さを決めなくても、高さは自動的に決めてくれるので便利。それは、子要素(cell)が表示されたときにのみシステムがジオメトリを計算するから自動的にやってくれる。

しかしながら、QGridでは、Grid全体の高さを決めないと、表示されない。
cellの高さと数を下に、Gridの高さを計算して、gridの高さを決めないといけないから大変。

ex) このような場合

// QGrid

// QGridの高さを計算
init() {
    let rowCount = ceil(Double(stubDatas.count) / 2) // 列の数
    gridHeight = CGFloat(rowCount * 170) // 列の数 × cellの高さ でgrid全体の高さを求める。
}

ScrollView(showsIndicators: false) {
    VStack{
        VStack{
            QGrid(self.datas,
                columns: 2,
                isScrollable: false
            ) { homeInfomation in
                HomeInfomationCell(homeInfomation: homeInfomation)
            }
        }
    }
    .frame(height: 200)  // ---- 固定version ここで高さを決めないといけない。 -------------
//    .frame(height: gridHeight) // --- 可変version gridの高さをcellの数で固定にする場合 ------
    .padding(.horizontal, 16)
}


// LazyVGrid
ScrollView(showsIndicators: false) {
    LazyVGrid(columns: columns, spacing: 20) {
        ForEach(datas) { homeInfomation in
            HomeInfomationCell(homeInfomation: homeInfomation)
        }
    }
}

・ProgressViewがない

iOS13でも自作で作っている記事などネット上に存在するが、他のバージョンだとレイアウト崩れが起きるなどの問題が発生し、厄介。

・ヒーローアニメーションがやりにくい

このようなアニメーション
ezgif.com-gif-maker.gif

iOS14からだと、matchedGeometryEffectを使うことで、ビュー階層の2つの異なる部分に同じビューが表示されていて、それらの間でアニメーション化することができる。
https://developer.apple.com/documentation/swiftui/view/matchedgeometryeffect(id:flag_in:properties:anchor:issource:)

13
6
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
13
6