Jason/swift-study
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

自定义形状，

Browse Source
This commit is contained in:
Jason.Chen
2024-01-30 18:06:53 +08:00
parent 5109b242a6
commit 073ff4aa68
11 changed files with 194 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
demo.xcodeproj/project.pbxproj
View File

@@ -7,6 +7,8 @@
objects = {
/* Begin PBXBuildFile section */
96151D962B68BE7100DBB72C /* ViewExtensions.swift in Sources */ = {isa = PBXBuildFile; fileRef = 96151D952B68BE7100DBB72C /* ViewExtensions.swift */; };
96151D992B68FC9800DBB72C /* TopRoundedRectangle.swift in Sources */ = {isa = PBXBuildFile; fileRef = 96151D982B68FC9800DBB72C /* TopRoundedRectangle.swift */; };
968A6F642B5F4C99008609EE /* demoApp.swift in Sources */ = {isa = PBXBuildFile; fileRef = 968A6F632B5F4C99008609EE /* demoApp.swift */; };
968A6F6A2B5F4C9B008609EE /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 968A6F692B5F4C9B008609EE /* Assets.xcassets */; };
968A6F6D2B5F4C9B008609EE /* Preview Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 968A6F6C2B5F4C9B008609EE /* Preview Assets.xcassets */; };
@@ -47,6 +49,8 @@
/* End PBXBuildFile section */
/* Begin PBXFileReference section */
96151D952B68BE7100DBB72C /* ViewExtensions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ViewExtensions.swift; sourceTree = "<group>"; };
96151D982B68FC9800DBB72C /* TopRoundedRectangle.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TopRoundedRectangle.swift; sourceTree = "<group>"; };
968A6F602B5F4C99008609EE /* demo.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = demo.app; sourceTree = BUILT_PRODUCTS_DIR; };
968A6F632B5F4C99008609EE /* demoApp.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = demoApp.swift; sourceTree = "<group>"; };
968A6F692B5F4C9B008609EE /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
@@ -98,6 +102,14 @@
/* End PBXFrameworksBuildPhase section */
/* Begin PBXGroup section */
96151D972B68FC5600DBB72C /* Extensions */ = {
isa = PBXGroup;
children = (
96151D982B68FC9800DBB72C /* TopRoundedRectangle.swift */,
);
path = Extensions;
sourceTree = "<group>";
};
968A6F572B5F4C99008609EE = {
isa = PBXGroup;
children = (
@@ -117,11 +129,13 @@
968A6F622B5F4C99008609EE /* demo */ = {
isa = PBXGroup;
children = (
96151D972B68FC5600DBB72C /* Extensions */,
968A6F762B5F4E0D008609EE /* Components */,
968A6F732B5F4DF3008609EE /* Controllers */,
968A6F742B5F4DF9008609EE /* Models */,
968A6F752B5F4DFD008609EE /* Views */,
968A6F632B5F4C99008609EE /* demoApp.swift */,
96151D952B68BE7100DBB72C /* ViewExtensions.swift */,
968A6F692B5F4C9B008609EE /* Assets.xcassets */,
968A6F6B2B5F4C9B008609EE /* Preview Content */,
);
@@ -344,6 +358,7 @@
968A6F852B5F4EB2008609EE /* MessageView.swift in Sources */,
968A6FA02B5F6893008609EE /* RegisterView.swift in Sources */,
968A6FB22B5FC3A2008609EE /* ShowMore.swift in Sources */,
96151D992B68FC9800DBB72C /* TopRoundedRectangle.swift in Sources */,
968A6F822B5F4EA1008609EE /* MallView.swift in Sources */,
968A6F972B5F683E008609EE /* CouponView.swift in Sources */,
96E93E9B2B622931004AB649 /* UserAvatarView.swift in Sources */,
@@ -362,6 +377,7 @@
968A6F7F2B5F4E91008609EE /* HomeView.swift in Sources */,
968A6FA22B5F68AA008609EE /* ForgotView.swift in Sources */,
968A6F792B5F4E28008609EE /* TabBarView.swift in Sources */,
96151D962B68BE7100DBB72C /* ViewExtensions.swift in Sources */,
96E93EA32B63B164004AB649 /* RadioButton.swift in Sources */,
96E93E9F2B62305F004AB649 /* UserNicknameView.swift in Sources */,
968A6FA82B5F6AF3008609EE /* CartView.swift in Sources */,
@@ -519,7 +535,7 @@
INFOPLIST_KEY_UIRequiresFullScreen = YES;
INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
IPHONEOS_DEPLOYMENT_TARGET = 15.0;
IPHONEOS_DEPLOYMENT_TARGET = 14.0;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",
@@ -556,7 +572,7 @@
INFOPLIST_KEY_UIRequiresFullScreen = YES;
INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
IPHONEOS_DEPLOYMENT_TARGET = 15.0;
IPHONEOS_DEPLOYMENT_TARGET = 14.0;
LD_RUNPATH_SEARCH_PATHS = (
"$(inherited)",
"@executable_path/Frameworks",

BIN
demo.xcodeproj/project.xcworkspace/xcuserdata/jason.xcuserdatad/UserInterfaceState.xcuserstate generated
View File

Binary file not shown.

43
demo/Extensions/TopRoundedRectangle.swift Normal file
View File

@@ -0,0 +1,43 @@
//
// TopRound.swift
// demo
//
// Created by Jason on 2024/1/30.
//
import SwiftUI
// 顶部圆角图形，兼容ios16以下版本用的
struct TopRoundedRectangle: Shape {
let cornerRadius: Double
init(cornerRadius: Double = 0) {
self.cornerRadius = cornerRadius
}
func path(in rect: CGRect) -> Path {
Path { path in
path.move(to: CGPoint(x: rect.minX + cornerRadius, y: rect.minY))
path.addLine(to: CGPoint(x: rect.maxX - cornerRadius, y: rect.minY))
path.addArc(
center: CGPoint(x: rect.width - cornerRadius, y: cornerRadius),
radius: cornerRadius,
startAngle: Angle(degrees: -90),
endAngle: Angle(degrees: 0),
clockwise: false
)
path.addLine(to: CGPoint(x: rect.maxX, y: rect.maxY))
path.addLine(to: CGPoint(x: rect.minX, y: rect.maxY))
path.addLine(to: CGPoint(x: rect.minX, y: cornerRadius))
path.addArc(
center: CGPoint(x: cornerRadius, y: cornerRadius),
radius: cornerRadius,
startAngle: Angle(degrees: 180),
endAngle: Angle(degrees: 270),
clockwise: false
)
}
}
}

24
demo/ViewExtensions.swift Normal file
View File

@@ -0,0 +1,24 @@
//
// ViewExtensions.swift
// demo
//
// Created by Jason on 2024/1/30.
//
import SwiftUI
// 自定义的修改器
struct MiniFontSize: ViewModifier {
func body(content: Content) -> some View {
content.font(.system(size: 12))
}
}
// 视图扩展 ，可以使用 . 语法
extension View {
func navBarText() -> some View {
font(.system(size: 12))
.multilineTextAlignment(.center)
.lineLimit(1)
}
}

13
demo/Views/Home/HomeView.swift
View File

@@ -26,7 +26,6 @@ struct HomeView: View {
}
.frame(maxWidth: .infinity)
.padding(.horizontal, 12)
.background(Color.gray.opacity(0.2))
}
var Search: some View {
@@ -48,17 +47,17 @@ struct HomeView: View {
Image(systemName: "bell")
.resizable()
.frame(width: 24, height: 24)
.overlay(alignment: .topTrailing) {
.overlay(
Circle()
.fill(Color.red.opacity(0.8))
.frame(width: 20, height: 20)
.overlay {
.overlay(
Text("20")
.foregroundColor(Color.white)
.font(.system(size: 12))
}
)
.offset(x: 8, y: -10)
}
)
Spacer()
}
@@ -243,14 +242,14 @@ struct HomeView: View {
Image("Images/LaunchScreen")
.resizable(resizingMode: /*@START_MENU_TOKEN@*/ .stretch/*@END_MENU_TOKEN@*/)
.frame(maxWidth: 120, maxHeight: 150)
.overlay(alignment: .bottom) {
.overlay(
Text("剩余100")
.font(.system(size: 14))
.foregroundColor(Color.white)
.frame(maxWidth: .infinity)
.padding(.vertical, 4)
.background(Color.red.opacity(0.5))
}
)
.cornerRadius(8)
VStack {
Text("石床垫：阿特伍德黑暗就故事（有的人说啥就是啥呢有的人说啥就是啥呢有的人说啥就是啥呢）")

10
demo/Views/Layouts/NavigationPageView.swift
View File

@@ -7,14 +7,14 @@
import SwiftUI
struct NavigationPageView: View {
@Environment(\.dismiss) private var dismiss
struct NavigationPageView<T: View>: View {
@Environment(\.presentationMode) private var presentationMode
var title: String = ""
var content: any View
var content: T?
var body: some View {
ScrollView {
AnyView(content)
content
}
.navigationBarTitleDisplayMode(.inline)
.navigationTitle(title)
@@ -22,7 +22,7 @@ struct NavigationPageView: View {
.toolbar {
ToolbarItem(placement: .navigationBarLeading) {
Button {
dismiss()
presentationMode.wrappedValue.dismiss()
} label: {
HStack {
Image(systemName: "chevron.backward")

11
demo/Views/Layouts/TabBarView.swift
View File

@@ -13,6 +13,9 @@ struct TabBarView: View {
var body: some View {
NavigationView {
ZStack {
Rectangle()
.fill(Color.gray.opacity(0.2))
.ignoresSafeArea()
Group {
switch selectedTab {
case .home:
@@ -34,10 +37,7 @@ struct TabBarView: View {
VStack(spacing: 6) {
Image(systemName: item.icon).resizable().frame(width: 18, height: 18)
Text(item.text)
.font(.caption)
.fontWeight(.regular)
.multilineTextAlignment(.center)
.lineLimit(1)
.navBarText()
}
.frame(maxWidth: .infinity)
})
@@ -46,12 +46,11 @@ struct TabBarView: View {
}
}
.padding(.vertical, 12.0)
.background(Color("TabBarColor"))
.background(Color("TabBarColor").ignoresSafeArea())
.frame(maxHeight: .infinity, alignment: .bottom)
.shadow(color: Color.gray.opacity(0.5), radius: 6, x: 0, y: 6)
}
}
.navigationViewStyle(.columns)
}
}

1
demo/Views/Mall/CartView.swift
View File

@@ -68,7 +68,6 @@ struct CartView: View {
}
.animation(.linear(duration: 10), value: isCheckAll)
.padding(.bottom, 62)
.background(Color.gray.opacity(0.2))
}
}

63
demo/Views/Mall/GoodsDetailView.swift
View File

@@ -8,18 +8,28 @@
import SwiftUI
struct GoodsDetailView: View {
@Environment(\.dismiss) private var dismiss
@Environment(\.presentationMode) private var presentationMode
var title: String
var body: some View {
ZStack {
HStack {
Button {
presentationMode.wrappedValue.dismiss()
} label: {
Image(systemName: "chevron.backward")
}
.accentColor(Color.black)
Text(title)
.frame(maxWidth: /*@START_MENU_TOKEN@*/ .infinity/*@END_MENU_TOKEN@*/)
Image(systemName: "ellipsis")
}
.padding(.horizontal, 12.0)
ScrollView {
VStack {
ForEach(/*@START_MENU_TOKEN@*/0 ..< 5/*@END_MENU_TOKEN@*/) { _ in
Image("Images/banner1")
.resizable()
.scaledToFit()
}
HStack {
Text(title)
@@ -30,21 +40,15 @@ struct GoodsDetailView: View {
}
}
}
.background(Color.gray.opacity(0.2))
.ignoresSafeArea()
.padding(.bottom, 100)
.ignoresSafeArea(.all)
// .background(Color.white)
HStack {
Image(systemName: "chevron.backward")
Spacer()
Image(systemName: "ellipsis")
}
.padding(12.0)
.background(LinearGradient(colors: [Color.white, Color.white.opacity(0)], startPoint: .top, endPoint: .bottom))
.frame(maxHeight: .infinity, alignment: .top)
// .background(LinearGradient(colors: [Color.white, Color.white.opacity(0)], startPoint: .top, endPoint: .bottom))
HStack(spacing: 0) {
HStack(spacing: 8) {
HStack(spacing: 12) {
Image(systemName: "house")
.resizable()
.foregroundColor(Color.gray)
@@ -66,46 +70,29 @@ struct GoodsDetailView: View {
HStack(spacing: 12) {
Button {} label: {
Text("加入购物车")
.font(.system(size: 15))
.font(.system(size: 14))
.foregroundColor(Color.white)
}
Rectangle()
.fill(Color.white)
.frame(width: 1, height: 14)
.frame(width: 0.4, height: 14)
Button {} label: {
Text("立即购买")
.font(.system(size: 15))
.font(.system(size: 14))
.foregroundColor(Color.white)
}
}
.padding(.vertical, 12)
.padding(.vertical, 10)
.padding(.horizontal, 24)
.background(LinearGradient(colors: [Color.orange, Color.red], startPoint: .leading, endPoint: .trailing))
.clipShape(
RoundedRectangle(cornerRadius: 24)
)
}
.padding(12.0)
.padding(.horizontal, 12.0)
.frame(maxWidth: /*@START_MENU_TOKEN@*/ .infinity/*@END_MENU_TOKEN@*/)
.background(Color("TabBarColor"))
.frame(maxHeight: .infinity, alignment: .bottom)
}
.background(Color.gray.opacity(0.2))
// .navigationBarTitleDisplayMode(.inline)
// .navigationTitle(title)
// .navigationBarBackButtonHidden(true)
// .toolbar {
// ToolbarItem(placement: .navigationBarLeading) {
// Button {
// dismiss()
// } label: {
// HStack {
// Image(systemName: "chevron.backward")
// }
// }
// }
// }
.navigationBarBackButtonHidden(true)
}
}

4
demo/Views/User/Info/UserAvatarView.swift
View File

@@ -8,7 +8,7 @@
import SwiftUI
struct UserAvatarView: View {
@Environment(\.dismiss) private var dismiss
@Environment(\.presentationMode) private var presentationMode
@State private var showSheet = false
@@ -22,7 +22,7 @@ struct UserAvatarView: View {
.toolbar {
ToolbarItem(placement: .navigationBarLeading) {
Button {
dismiss()
presentationMode.wrappedValue.dismiss()
} label: {
Image(systemName: "chevron.backward")
}

50
demo/Views/User/UserView.swift
View File

@@ -11,12 +11,6 @@ struct UserView: View {
@State private var showDetail = false
@State private var showUserInfo = false
var grayBackground = Color.gray.opacity(0.2)
init() {
print(UIScreen.main.bounds.width)
}
var body: some View {
ScrollView(.vertical, showsIndicators: false) {
VStack(spacing: 0) {
@@ -64,6 +58,7 @@ struct UserView: View {
}
}
.padding(.horizontal, 24)
.padding(.bottom, 12)
}
var ToVip: some View {
@@ -88,8 +83,7 @@ struct UserView: View {
.frame(height: showDetail ? 64 : 150, alignment: .topLeading)
.background(Color.red.opacity(0.3))
.clipShape(
RoundedRectangle(cornerRadius: 12)
.offset(y: 12)
TopRoundedRectangle(cornerRadius: 8)
)
.padding(.horizontal, 12)
}
@@ -109,25 +103,10 @@ struct UserView: View {
}
.padding(.top, 12)
.background(
Color.white
.overlay(alignment: .top) {
RoundedRectangle(cornerRadius: 12)
.fill(LinearGradient(colors: [Color.orange.opacity(0.3), grayBackground], startPoint: .top, endPoint: .bottom))
.frame(height: 92)
}
TopRoundedRectangle(cornerRadius: 12)
.fill(LinearGradient(colors: [Color.orange, Color.clear], startPoint: .top, endPoint: UnitPoint(x: 0.5, y: 0.2)))
)
.clipped()
// Rectangle()
// .fill(Color.white)
// .frame(height: 12)
// .overlay {
// RoundedRectangle(cornerRadius: 12)
// .fill(grayBackground)
// .frame(height: 24)
// .offset(y: 6)
// }
// .clipped()
}
var Notice: some View {
@@ -167,7 +146,6 @@ struct UserView: View {
.cornerRadius(8)
.padding(.horizontal, 12)
.padding(.vertical, 12)
.background(grayBackground)
}
var OrderShow: some View {
@@ -195,17 +173,16 @@ struct UserView: View {
.resizable()
.frame(width: 24, height: 24)
.foregroundColor(Color.gray)
.overlay(alignment: .topTrailing) {
.overlay(
Circle()
.fill(Color.red.opacity(0.9))
.frame(width: 20, height: 20)
.overlay {
Text("5")
.overlay(Text("5")
.foregroundColor(Color.white)
.font(.system(size: 12))
}
)
.offset(x: 12, y: -10)
}
)
Text("待付款")
.font(.system(size: 12))
@@ -221,7 +198,6 @@ struct UserView: View {
.cornerRadius(6)
.padding(.horizontal, 12)
.padding(.bottom, 12)
.background(grayBackground)
}
var Coupons: some View {
@@ -237,17 +213,17 @@ struct UserView: View {
.resizable()
.frame(width: 24, height: 24)
.foregroundColor(Color.gray)
.overlay(alignment: .topTrailing) {
.overlay(
Circle()
.fill(Color.red.opacity(0.9))
.frame(width: 20, height: 20)
.overlay {
.overlay(
Text("5")
.foregroundColor(Color.white)
.font(.system(size: 12))
}
)
.offset(x: 12, y: -10)
}
)
Text("待付款")
.font(.system(size: 12))
.foregroundColor(Color.gray)
@@ -263,7 +239,6 @@ struct UserView: View {
.cornerRadius(6)
.padding(.horizontal, 12)
.padding(.bottom, 12)
.background(grayBackground)
}
let columns = [GridItem(.flexible(), spacing: 12), GridItem(.flexible(), spacing: 12)]
@@ -290,7 +265,6 @@ struct UserView: View {
}
.padding(.horizontal, 12)
.padding(.bottom, 12)
.background(grayBackground)
}
}