SwiftUI のビュー内における代入

Question

前提・実現したいこと

SwiftUI のビュー内での再代入がうまくできません。

self.foo += 1

という記述はコンパイルではエラーがでませんが、別の行でエラーがでてしまいます。
この行をコメントアウトすると、別の行で出ていたエラーもなくなるので、根本的な原因は代入を行っている行ではないかと疑っているところですが、解決方法が見当たりません。

具体的にやりたいことはカレンダーの作成なのですが、ループ内で条件判定を行なった上、フラグを立てたり、変数の値を変えたりしたいと考えています。

アルゴリズム自身は問題がないことを確認済みで、Playgroundで動くことを確認の上、コードを少しづつ移植しているところでした。

代入ではありませんが、ビュー内部で条件分岐や for 文も使えないようなので、SwiftUIの制限なのかとも思っています。

ちなみに、条件分岐は　Group {} で囲むことで回避できること、for は　ForEach で回避できることを知り、解決できました。

Cでの記述についてはそこそこ理解可能です。C++もコードをざっと眺める程度であれば理解できますが、Swiftは最近学習し始めました。

発生している問題・エラーメッセージ

\'Int\' is not convertible to \'CGFloat\'

----------------------------------------

SchemeBuildError: Failed to build the scheme "PrintMonth"

'Int' is not convertible to 'CGFloat'

Compile /Users/.../Documents/Xcode/iOS/PrintMonth/PrintMonth/ContentView.swift:
/Users/.../Documents/Xcode/iOS/PrintMonth/PrintMonth/ContentView.swift:132:80: error: 'Int' is not convertible to 'CGFloat'
                                    .background(RoundedRectangle(cornerRadius: 5)

該当のソースコード

ソースコードはかなり長いので、該当部分と直接関係ありそうな部分だけ抜粋します。

struct printMonth: View {
    @State var year: Int
    @State var month: Int

    var firstDayFlag: Bool = true
    var d: Int = 1
    
    var body: some View {
        HStack{
            ForEach( 0 ..< 7){ week in
                // 日付を表示するループ
                VStack{
                    Group{
                        if self.firstDayFlag && week < dayOfWeek(year: self.year, month: self.month, day: 1) {
                        Text("")
                        Text("")
                    } else if self.d > getLastDay(year: self.year, month: self.month) {
                        Text("")
                        Text("")
                    } else {
                        // 以下の二行をコメントアウトするとコンパイルが通る
                        self.firstDayFlag = false
                        self.d += 1
                            
                        // 日付の表示
                        Text("(row * 7 + week + 1)")
                            .font(.subheadline)
                            .padding(-15)
                                                     
                        // 本文
                        Text("")
                    }
                }
            }
            .foregroundColor(.black)
            .multilineTextAlignment(.trailing)
            .frame(width: self.w, height: 50)
            .background(RoundedRectangle(cornerRadius: 5) // エラーが出る行
                .frame(width: self.w)
                .foregroundColor(Color(red: 0.95, green: 0.95, blue: 0.95)))
        }
    }
}

試したこと

前述の通り、代入している行を消すとビルドエラーもなくなり、プレビューも正常に表示されます。

補足情報（FW/ツールのバージョンなど）

Xcode 11.3

Answer 1

SwiftUIは、エラー原因となる箇所と全然関係なさそうなところにエラーメッセージが表示されるので、原因を調べるのが難しいですが、

// 以下の二行をコメントアウトするとコンパイルが通る
self.firstDayFlag = false
self.d += 1

推察通り、これがエラーの原因だと思います。
この行にはいくつかの問題があります。

まず、HStack/VStack/Groupの{ 〜 }の中にはSwiftの文を自由に書くことができません。基本的にこの中に書けるのは最大10個までのViewを並べるか、表示するViewをif文の条件で切り分けることだけです。詳しくは@ViewBuilderや関数ビルダの説明を読んでください。

Buttonのaction引数やonAppearのようなクロージャの中であれば、自由にSwiftの構文を書くことができます。ただし、クロージャの中で(正確には離脱するクロージャの中で)構造体プロパティの値を更新することはできません。そのため、更新する予定のある変数は@StateをつけてPropertyWrapperで定義する必要があります。

しかし、今回使用しているfirstDayFlagとdは、カレンダーを表示するためのループ制御用の変数で、ループ処理を終えたら不要になるものだと思いますので、状態変数として保存すべきものではありません。

また、ForEach(0..<7)は、
https://developer.apple.com/documentation/swiftui/foreach
で

A structure that computes views on demand from an underlying collection of of identified data.

と説明されている通り、必要に応じて(on demand)Viewを算出する構造体です。
カレンダー表示で1画面に収まるデータを表示するなら、0から6まで順番に実行されるかもしれませんが、画面からはみ出て結局表示する必要がないと判断された範囲の行はもしかしたら実行されないかもしれません。また、再描画が必要になった時に、一部の範囲だけもう一度実行されるかもしれません。そのため、 ForEachを通常のfor文のように最初から最後まで順番に全てループする前提で使ってはいません。

今回の場合、firstDayFlagやdを使わず、次のようにForEachから渡される週番号(row)と曜日番号(week)だけを使って処理できるはずです。

struct printMonth: View {
    
    @State var year: Int
    @State var month: Int
    
    var body: some View {
        HStack() {
            ForEach(0..<7) { week in
                VStack() {
                    ForEach (0..<6) { row in
                        if self.getDate(row, week) < 1 {
                            Text("")
                        } else if self.getDate(row, week) > self.getLastDay(year: self.year, month: self.month) {
                            Text("")
                        } else {
                            Text("(self.getDate(row, week))")
                        }
                        Text("")
                    }
                }
            }
        }
    }
    
    func getDate(_ row: Int, _ week: Int)->Int {
        return row*7 + week + 1 - dayOfWeek(year: year, month: month, day: 1)
    }
    
}

Comments

[TsukubaDepot]

お返事が遅くなりまして申し訳ございません。

ご指摘を参考にコードを修正したところ、カレンダーの表示ができるようになりました。

ソースコードを端折ったため定義を省いた関数の戻り値まで推測していただいてコード修正案をご提示いただいたことに、ただひたすら感謝する次第です。

UIKit と Storyboard の開発がどうもピンとこなくて何度も挫折していた折、SwitftUIを紹介した良書と巡り合い、（ある意味）余計なことを考えなくても見栄えのあるインタフェイスを開発できると喜びながら、習作としてカレンダーアプリを作ってみようとやっていた際にこのトラブルに見舞われました。

SwiftUIでの記述に制限はあるものの、そこは基本的なアルゴリズムの工夫で処理すればよいとわかったので、習作をいくつか作ってみたり、Githubなどで参考になりそうなコードを拝見させていただいて体得していきたいとおもいます。

ありがとうございました。

#SwiftUIは、GUI記述も含めてかなり見通しの利く記述だとおもえますので、他の方が書いたコードも割合理解しやすい言語だな、とは思っています。