refirio.org

Memo

■SwiftUIその他
■引っ張って更新

ContentView.swift
import SwiftUI

struct ContentView: View {
    @State var articles: [String] = [
        "Article 1",
        "Article 2",
        "Article 3",
        "Article 4",
        "Article 5",
    ]
    var body: some View {
        NavigationView {
            List($articles, id: \.self) { $article in
                Text(article)
            }
            .refreshable {
                articles.append("New Article")
            }
            .navigationTitle("Article List")
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


【SwiftUI 3.0】refreshable で Pull To Refresh を実装 - .NET ゆる〜りワーク
https://www.yururiwork.net/archives/1864

SwiftUI3.0より前は、「引っ張って更新」には対応していなかった

【SwiftUI】Pull to refresh（UIRefreshControl）を実装する - .NET ゆる〜りワーク
https://www.yururiwork.net/archives/1534■リストを検索

ContentView.swift
import SwiftUI

struct ContentView: View {
    @State private var query = ""
    private let characters = [
        "Alice",
        "The White Rabbit",
        "The Queen of Heart",
        "The King of Heart",
        "The Cheshire Cat",
        "アリス",
        "ホワイトラビット",
        "ハートのクイーン",
        "ハートのキング",
        "チェシャー猫",
    ]
    var body: some View {
        NavigationView {
            VStack {
                List(filtered, id: \.self) {
                    Text($0)
                }
                .listStyle(.insetGrouped)
            }
            .searchable(text: $query)
            .navigationTitle("Characters")
        }
    }

    private var filtered: [String] {
        guard !query.isEmpty else {
            return characters
        }
        return characters.filter {
            $0.localizedCaseInsensitiveContains(query)
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}


How to add a search bar to filter your data - a free SwiftUI by Example tutorial
https://www.hackingwithswift.com/quick-start/swiftui/how-to-add-a-search-bar-to-filter-your-data■複数行入力欄にプレースホルダーを設定

ZStackを使って「入力が無ければ代わりのテキストを表示する」のように調整する
コードが長くなるので、使いまわせる部品にするといいかもしれない

            Form {
                TextField("Name", text: $name)
                ZStack {
                    if memo.isEmpty {
                        VStack {
                            HStack {
                                Text("Memo")
                                    .padding(EdgeInsets(
                                        top: 8,
                                        leading: 0,
                                        bottom: 0,
                                        trailing: 0
                                    ))
                                    .opacity(0.25)
                                Spacer()
                            }
                            Spacer()
                        }
                    }
                    TextEditor(text: $memo)
                        .padding(EdgeInsets(
                            top: 0,
                            leading: -4,
                            bottom: 0,
                            trailing: 0
                        ))
                        .frame(height: 100)
                }
            }


【SwiftUI】TextEditorにプレースホルダーを表示する - Qiita
https://qiita.com/cappie5551/items/dfbfcb69b99bb3400b89■NavigationView

NavigationViewを使用した際、iPadではデフォルトで左側に一覧が表示されるようになる
以下のように「.navigationViewStyle(StackNavigationViewStyle())」を指定することで、iPadでも全面表示にできる

struct ContentView: View {
    var body: some View {
        NavigationView {
        }
        .navigationViewStyle(StackNavigationViewStyle())
    }
}


SwiftUIのNavigationViewについて - Qiita
https://qiita.com/k-motoyan/items/6b5077d06efccb426344

SwiftUIのNavigationViewでiPhoneとiPadの動作を合わせる
https://zenn.dev/yorifuji/articles/swiftui-navigationviewstyle-stack

SwiftUI iPadタブレットで全面表示にする。左側に小さくならないようにする
https://ao-system.net/note/137■NavigationLinkのページからNavigationLinkのページへ遷移した際の余計な空白対策

ページ遷移先ではNavigationViewを削除すると解消される
ただし単にその対応だと、Form -> TextField に反映されるはずの入力初期値が反映されない現象が発生した
（タップすると、そのタイミングで何故か反映される）

正しい対応かどうかは不明だが、Form -> HStack -> TextField とHStackを挟むと正常に表示された

【SwiftUI】NavigationLinkの画面遷移時に発生する謎の空白問題について | プログラマーになった 「中卒」 男のブログ
https://chusotsu-program.com/swiftui-navigationlink-blank/■プロパティの変更を検知

onChangeメソッドを使うと、@State や @Published の変化を検知して処理を行うことができる

【SwiftUI】プロパティの変更を検知する方法【onChange】 - .NET ゆる〜りワーク
https://www.yururiwork.net/archives/1481■画面の向きを固定

Infoの画面で設定できる
Supported interface orientations(iPhone)
内の項目を
Portrait(bottom home button)
だけにすると、画面が縦向きだけで固定される

【SwiftUI】 アプリの画面を縦向きまたは横向きに固定して、画面の回転を防ぐ方法
https://www.motokis-brain.com/article/65■設定画面

【SwiftUI】入力フォームを簡単に作れるFormビュー | プログラマーになった 「中卒」 男のブログ
https://chusotsu-program.com/swiftui-form/

【SwiftUI】Form を使って設定アプリもどきの画面を作成する - .NET ゆる〜りワーク
https://www.yururiwork.net/archives/511■ハンバーガーメニューを作る

SwiftUIでサイドメニューを実装してみた | DevelopersIO
https://dev.classmethod.jp/articles/swiftui_overlay_sidemenu/■参考メモ

[Swift] SwiftUIのチートシート - Qiita
https://qiita.com/hcrane/items/eb847ca7fb7a0b9e8073

【SwiftUI】List の使い方【総まとめ】 - .NET ゆる〜りワーク
https://www.yururiwork.net/%E3%80%90swiftui%E3%80%91list-%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9%E3%80%...

【SwiftUI】Form を使って設定アプリもどきの画面を作成する - .NET ゆる〜りワーク
https://www.yururiwork.net/%e3%80%90swiftui%e3%80%91form-%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e8%a8%...

普通にURLSessionとCombineでURLSession - Qiita
https://qiita.com/Sho-heikun/items/4da148b4e1618c3eec82

APIのデータを利用する - SwiftUIへの道
https://d1v1b.com/swiftui/use_data_from_api

API - SwiftUIでWebAPIから結果を表示したい｜teratail
https://teratail.com/questions/222072

【SwiftUI】外部APIを叩いて取得した結果をListに表示する - Qiita
https://qiita.com/MilanistaDev/items/64dca8c9d5099a19529e

【Swift】SwiftUIのListでスクロール末尾で次のデータを読み込み表示する方法 - Qiita
https://qiita.com/shiz/items/f0f663f8fb926d914990

Swift 4.0 エラー処理入門 - Qiita
https://qiita.com/koishi/items/67cf4d0f51c4d79f1d22

[Swift] Swiftのエラー処理についてざっくりとまとめてみた | DevelopersIO
https://dev.classmethod.jp/articles/about-error-handling/
Memo

Advertisement
