前節で, ストレージにJSONファイルを書き込みました. 今回はファイルが正しく書き込みされているか確認する意味も込めてストレージのファイルの読み込み処理を追加します.

  • 前回のコードに続けて書く
  • PhotoDataの中に load( path: )関数 を作成する
  • ファイルが存在するかを FileManager.default.fileExists( atPath: ) で確認
    • ファイルがない場合は空の配列を返すようにする
  • URL( fileURLWithPath:path ) で読込パスをURLに変換する
    • try! Data( contentOf:url ) でファイルを読み込む
  • 3-02で作成済みの PhotoData.parse( json: ) で[PhotoData]に変換して返す

コード1

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

import Foundation

struct PhotoData : Identifiable, Codable, Equatable {
    var id:String = UUID().uuidString
    var type:String
    var imageName:String
    var title:String
    var message:String
    
    static func parse( json:Data ) -> [PhotoData] {
        do {
            let photos = try JSONDecoder().decode( [PhotoData].self, from:json )
            return photos
        }
        catch {
            print( "JSONをPhotoData配列に変換できませんでした." )
            print( error.localizedDescription )
            return []
        }
    }
   
    static func load( path:String ) -> [PhotoData] {
        if FileManager.default.fileExists( atPath:path ) == false {
            return []
        }
        
        let url = URL( fileURLWithPath: path )
        let user_json = try! Data( contentsOf:url )
        return PhotoData.parse( json:user_json )
    }
    
    static func save( path:String, data:[PhotoData] ) {
        let user_json = try! JSONEncoder().encode( data )
        let url = URL( fileURLWithPath:path )
        try! user_json.write( to:url, options:[.atomic] )
    }
}

これでストレージに保存したJSONを読み込むことができるようになりました. ContentViewで使ってみます.

  • ContentViewで書き出したJSONを読み込んでリストを復帰させる
  • .onAppear { … } を追加する
    • .onAppearは 画面が現れたときに呼ばれる
    • PhotoData.load でファイルを読み込み, 結果をphotosに代入する

コード2

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

import SwiftUI

struct ContentView: View {
    let user_json_path = LocalPath.docFile( name:"user_photos", ext:"json" )
    @State var photos:[PhotoData] = []
    
    var body: some View {
        List {
            Section {
                ForEach( $photos ) { bind_photo in
                    NavigationLink( destination:{
                        SceneryDetail( data:bind_photo )
                    },
                    label: {
                        SceneryRow( data:bind_photo.wrappedValue )
                    })
                }
                .onDelete { index_set in
                    photos.remove( atOffsets:index_set )
                }
            }
            header: {
                HStack {
                    Text( "景色写真" )
                    
                    Spacer()
                    
                    Button {
                        let new_data = PhotoData( type:"景色", imageName:"CC0_06", title:"新規", message:"追加したデータです" )
                        photos.append( new_data )
                    }
                    label: {
                        Image( systemName:"plus" )
                        .font( .title2 )
                        .foregroundStyle( Color.accentColor )
                    }
                }
            }
        }
        .listStyle( .grouped )
        .navigationTitle( "写真集" )
        .onAppear {
            photos = PhotoData.load( path:user_json_path )
        }
        .onChange( of:photos ) { oldData, newData in
            PhotoData.save( path:user_json_path, data:newData )
        }
    }
}

結果

swiftui_3_3_2_1.png

+ボタンから項目を追加したり編集したりした後, 一度プログラムを終了し再度立ち上げてみてください. 起動時に追加・編集したデータが正しく書き込まれていればリストが維持されているはずです. 再表示がうまくいっていたら, JSONファイルの読み込み/書き込みの成功です. このようにDocumentフォルダのファイルはAppを削除したりしない限りデータが残るため, 再起動時に前に書き込んだJSONからデータを復帰してくれます.

バンドルはあらかじめ用意している静的なファイルを扱うしくみで大変便利ですが,動的な変更に対応できません. 今回のようにユーザ操作によって変更がありうるデータを保持したい場合Documentフォルダなどのストレージは好適となります.