admin/Reflect
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP - custom widget icon

Browse Source
This commit is contained in:
Trey t
2022-02-13 22:15:53 -06:00
parent 56d7e40c27
commit 649180dbb5
7 changed files with 372 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

151
Shared/views/IconView.swift
View File

@@ -10,70 +10,125 @@ import SwiftUI
struct IconView: View {
@State public var customIcon: CustomIcon
private let facePercSize = 0.6
public let isPreview: Bool
private var gridXOffset: CGFloat {
if isPreview {
return CGFloat(0)
}
return CGFloat(6)
}
private var gridYOffset: CGFloat {
if isPreview {
return CGFloat(0)
}
return CGFloat(-8)
}
let columns = [
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0),
GridItem(.fixed(20), spacing: 0)
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1),
GridItem(.flexible(minimum: 1, maximum: 100), spacing: 1)
]
var body: some View {
ZStack {
LazyVGrid(columns: columns, spacing: 0) {
ForEach(customIcon.background, id: \.self.1) {
$0.0
GeometryReader { geo in
ZStack {
Rectangle()
.fill(
customIcon.bgColor
)
.frame(width: geo.size.width, height: geo.size.height, alignment: .center)
.position(x: geo.size.width/2, y: geo.size.height/2)
LazyVGrid(columns: columns, alignment: .leading, spacing: 0) {
ForEach(customIcon.background, id: \.self.1) { (image, uuid) in
image
.resizable()
.aspectRatio(1, contentMode: .fill)
.foregroundColor(customIcon.bgOverlayColor)
}
}
}
.frame(width: 200, height: 200)
.position(x: 100, y: 110)
Circle()
.strokeBorder(Color.black, lineWidth: 12)
.background(Circle().fill(customIcon.innerColor))
.frame(width: 120, height: 120, alignment: .center)
VStack {
Spacer()
.frame(height: 70)
HStack {
Spacer()
.frame(width: 72)
customIcon.leftEye
Spacer()
.frame(width: 20)
customIcon.rightEye
Spacer()
}
Spacer()
.frame(height: 28)
.frame(width: geo.size.width,
height: geo.size.height,
alignment: .center)
.position(x: geo.size.width/2 + gridXOffset,
y: geo.size.height/2 + gridYOffset)
.background(
.clear
)
Circle()
.strokeBorder(Color.black, lineWidth: geo.size.width * 0.045)
.background(Circle().fill(customIcon.innerColor))
.frame(width: geo.size.width*facePercSize,
height: geo.size.height*facePercSize,
alignment: .center)
.position(x: geo.size.width/2, y: geo.size.height/2)
customIcon.leftEye
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: geo.size.width*0.12,
height: geo.size.height*0.12,
alignment: .center)
.position(x: geo.size.width*0.4,
y: geo.size.height*0.4)
customIcon.rightEye
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: geo.size.width*0.12,
height: geo.size.height*0.12,
alignment: .center)
.position(x: geo.size.width*0.6,
y: geo.size.height*0.4)
customIcon.mouth
Spacer()
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: geo.size.width*0.12,
height: geo.size.height*0.12,
alignment: .center)
.position(x: geo.size.width*0.5,
y: geo.size.height*0.59)
}
.position(x: geo.size.width/2,
y: geo.size.height/2)
}
.frame(width: 200, height: 200)
.background(
customIcon.bgColor
)
.cornerRadius(10)
}
}
struct IconView_Previews: PreviewProvider {
static var backgrounds: [(Image, UUID)] = {
var blah = [(Image, UUID)]()
for _ in 0...CustomIcon.numberOfBGItems {
let image = Image(BackGroundOptions.selectable.randomElement()!.rawValue, bundle: .main)
blah.append((image, UUID()))
}
return blah
}()
static var previews: some View {
IconView(customIcon: CustomIcon(leftEye: EyeOptions.defaultOption,
rightEye: EyeOptions.defaultOption,
mouth: MouthOptions.defaultOption,
background: [(AnyView, UUID)](),
background: IconView_Previews.backgrounds,
bgColor: .red,
innerColor: .green))
innerColor: .green,
bgOverlayColor: .orange),
isPreview: true)
.frame(width: 256, height: 256, alignment: .center)
}
}