Swift UI チートシート

Text("Swift")
    .frame(maxWidth: .infinity, alignment: .leading) // 最大に広げる*右寄せ
    .font(.system(size: 12, weight: .bold, design: .default)) // サイズ指定
    .lineLimit(2) // 行制限
    .foregroundColor(Color(UIColor.systemGray)) // テキスト色

Image("image", bundle: nil)
    .resizable()
    .frame(width: 40.0, height: 40.0)

Button(action: {
    print("Edit button was tapped")
}) {
		HStack {
		  	Text("a")
    		Text("b")
		}
}

Divider()
// 又は
Rectangle().frame(height: 1)

View().foregroundColor(Color(.label))

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

List {
    ForEach(Flavor.allCases, id: \.self) { flavour in
        Text(flavour.rawValue)
            .listRowInsets(.init())
            .border(Color.red, width: 1)
    }
}

Image("image", bundle: nil)
    .resizable()
    .frame(width: 40.0, height: 40.0)
    .overlay(
        RoundedRectangle(cornerRadius: 20)
            .stroke(Color(UIColor.systemBackground), lineWidth: 01)
    )

struct ContentView: View {
    var body: some View {
        Image("capibara-400")                       // 画像指定
            .frame(width:300, height: 300)          // フレームサイズ
            .clipShape(Circle())                    // 円形に切り取り
            
            // 周りの枠を重ねる
            .overlay(Circle()                       // 円形部品
                .stroke(Color.white, lineWidth: 4)  // 白い輪郭
                .shadow(radius: 3))                 // 影を付ける
            
            // タイトルを重ねる
            .overlay(Text("カピ通信")               // タイトル文字列
                .font(.largeTitle)                  // 文字サイズ
                .fontWeight(.black)                 // 文字の太さ
                .foregroundColor(.white)            // 文字の色
                .offset(y: -30),                    // 上にずらす
                     alignment: .bottom)            // 配置方法
    }
}

ZStack(alignment: .bottomTrailing) {
    Image("image", bundle: nil)
        .frame(width: 40, height: 40)
        .padding(12)
    Image("icon", bundle: nil)
        .frame(width: 24, height: 24)
}

ScrollView(.horizontal) {
    HStack(spacing: 20) {
        ForEach(0..<10) {
            Text("Item \($0)")
                .foregroundColor(.white)
                .font(.largeTitle)
                .frame(width: 200, height: 200)
                .background(Color.red)
        }
    }
}

Text("たろう\n▼\n太郎")
    .lineLimit(nil)
    .fixedSize(horizontal: false, vertical: true)

Button {} label: {
    Text("ボタン")
}
.padding(EdgeInsets(top: 6, leading: 24, bottom: 6, trailing: 24))
.cornerRadius(4)
.foregroundColor(.black)
.overlay(
    RoundedRectangle(cornerRadius: 4)
        .stroke(.black, lineWidth: 1)
)
// 又は borderなしの場合
.background(RoundedRectangle(cornerRadius: 4).fill(Color.white))

NavigationView {
		ZStack {
		    NavigationLink {
		        // View
		    } label: {
		        EmptyView()
		    }
		    VStack {
						Button {
								// 表示処理
						} label: {
								Text("ボタン")
						}
            .cornerRadius(20)
            .buttonStyle(PlainButtonStyle())
				}
		}
}

Button {
} label: {
    HStack {
        Spacer()
            .frame(width: 68)
        Text("テキスト")
            .underline()
            .font(.system(size: 14, weight: .medium, design: .default))
            .frame(maxWidth: .infinity, alignment: .leading)
        Image(systemName: "chevron.right")
            .resizable()
            .frame(width: 4, height: 8)
    }
    .padding(EdgeInsets(top: 12, leading: 0, bottom: 12, trailing: 16))
		// NOTE:↓がないテキストや画像部しか選択領域にならない
    .contentShape(Rectangle())
}

// x
struct ContentView<Model>: View where Model: ContentViewModel {
    @ObservedObject var viewModel: Model
    var body: some View {
    }
}

// ○
struct ContentView: View {
    @ObservedObject(initialValue: ContentViewModel()) var viewModel: ContentViewModel
    var body: some View {
    }
}