title: IOS date: 2023-10-21
//
// ContentView.swift
// Aaronwei
//
// Created by ylkj on 2022/6/24.
//
import SwiftUI
struct ContentView: View {
@State private var username: String = ""
var body: some View {
VStack {
VStack(spacing: 0){
Form {
TextField(
"请输入用户名",
text: $username
)
.onAppear {
UITextField.appearance().clearButtonMode = .whileEditing
}
.padding(.bottom, -10.0)
.textFieldStyle(.automatic)
}.frame(minHeight: 0, maxHeight: 100)
ScrollView{
VStack{
ButtonView(icon:"applelogo",text:"苹果1")
ButtonView(icon:"applelogo",text:"苹果2")
ButtonView(icon:"applelogo",text:"苹果3")
ButtonView(icon:"applelogo",text:"苹果4")
ButtonView(icon:"applelogo",text:"苹果5")
ButtonView(icon:"applelogo",text:"苹果6")
ButtonView(icon:"applelogo",text:"苹果7")
ButtonView(icon:"applelogo",text:"苹果8")
ButtonView(icon:"applelogo",text:"苹果9")
VStack{
ButtonView(icon:"applelogo",text:"苹果10")
ButtonView(icon:"applelogo",text:"苹果11")
}
}
}
HStack(spacing: 0){
ButtonView(icon:"applelogo",text:"苹果")
ButtonView(icon:"car",text:"特斯拉")
}.zIndex(10)
.frame(alignment: .bottom)
.padding(.bottom,0)
.ignoresSafeArea()
.background(Color.white.opacity(0.3))
.frame(maxHeight: .zero)
}
//
// ButtonView(icon:"applelogo",text:"苹果").padding(.top, -100.0).zIndex(20)
// .frame(alignment: .bottom)
// .ignoresSafeArea()
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct ButtonView: View {
var icon :String
var text :String
struct CustomButtonStyle: ButtonStyle {
func makeBody(configuration: Configuration) -> some View {
configuration.label
.font(.system(size: 12))
.frame(minWidth: 0, maxWidth: .infinity)
.padding()
.foregroundColor(Color(.white))
.background(Color(red: 88 / 255, green: 224 / 255, blue: 133 / 255))
.cornerRadius(30)
.padding(.horizontal, 10)
.padding(.vertical, 2)
.shadow(radius: 4)
.scaleEffect(configuration.isPressed ? 1.2 : 1)
.animation(.easeInOut(duration: 0.2), value: configuration.isPressed)
}
}
var body: some View {
VStack{
Button(action: {
print("按钮被触发了~")
}){
HStack {
Image(systemName: icon)
.imageScale(.large)
Text(text)
.fontWeight(.semibold)
.font(.title)
}
}
.buttonStyle(CustomButtonStyle())
}
.font(.largeTitle)
}
}