---
# System prepended metadata

title: SearchView
tags: [View]

---

# SearchView

[SwiftUI 開発記録](https://hackmd.io/29GdyEJPQ2yDAmajfRq0Gw?both#SwiftUI-%E9%96%8B%E7%99%BA%E8%A8%98%E9%8C%B2)

![test1](https://hackmd.io/_uploads/rkBxVBlbA.gif)


[TOC]

#### 機能追加情報
> [time=Sat, Apr 20, 2024 3:33 AM]

* 検索テキストフィールドの追加
* リスト(プレーンスタイル)の追加

---

#### now code
```swift=
//
//  SearchView.swift
//  Financial_iPhoneApp
//
//  Created by 有田健一郎 on 2024/02/29.
//

import SwiftUI

struct SearchView: View {
    @State private var searchText = "" // 検索テキストを保持する変数
    @State private var searchResult: [String] = [] // 検索結果を保持する配列
    
    var body: some View {
        VStack {
            // スペースを追加して、ナビゲーションバーとテキストフィールドの間に余白を作成
            Spacer().frame(height: 30)
            // 検索テキストボックスと検索ボタンを横並びに配置
            HStack {
                TextField("検索", text: $searchText) // 検索テキストボックス
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .padding(.horizontal)
                
                Button(action: {
                    // 検索ボタンがタップされたときの処理
                    // ここでは検索テキストが空でない場合に検索を実行すると仮定しています
                    performSearch()
                }) {
                    Image(systemName: "magnifyingglass") // 虫眼鏡アイコン
                        .font(.system(size: 20))
                        .padding(.horizontal)
                }
            }
            
            Spacer().frame(height: 40)
            // 検索結果をリスト形式で表示
            List(searchResult, id: \.self) { result in
                Text(result) +
                Text("　　¥1,000-")
//                    .frame(maxWidth: .infinity, alignment: .trailing)
            }
            .listStyle(.plain)
        }
    }
    
    // 検索を実行する関数
    private func performSearch() {
        // ここで実際の検索処理を行うと仮定
        // 今回は単純に検索テキストを使ってダミーの検索結果を生成しています
        searchResult = generateDummySearchResult(for: searchText)
    }
    
    // ダミーの検索結果を生成する関数
    private func generateDummySearchResult(for searchText: String) -> [String] {
        // ダミーの検索結果を生成して返す
        // ここでは検索テキストと同じ文字列に"Result"を追加したものを5つ生成しています
        return (1...5).map { 
//            searchText +
            " 2024年04月0\($0)日" }
    }
}

#Preview {
    SearchView()
}
```

> [time=Sat, Apr 20, 2024 3:29 AM][name=ariken][color=#31b4ed]

---
#### old
```swift=
//
//  SearchView.swift
//  Financial_iPhoneApp
//
//  Created by 有田健一郎 on 2024/02/29.
//

import SwiftUI

struct SearchView: View {
    var body: some View {
        ZStack {
            Color.gray    // 背景色
            Text("SearchPage")
        } // ZStack
    }
}

#Preview {
    SearchView()
}

```

> [time=Sat, Apr 20, 2024 3:29 AM][name=ariken][color=#31b4ed]

