WIP - custom widget creator

This commit is contained in:
Trey t
2022-02-13 13:34:41 -06:00
parent adcdf636c3
commit 1e7199337f
13 changed files with 457 additions and 4 deletions

View File

@@ -269,7 +269,7 @@ struct ContentView: View {
settingsButtonView
if viewModel.hasNoData {
Spacer()
EmptyView(viewModel: viewModel)
EmptyContentView(viewModel: viewModel)
Spacer()
} else {
ZStack {

View File

@@ -0,0 +1,321 @@
//
// CreateIconView.swift
// Feels (iOS)
//
// Created by Trey Tartt on 2/13/22.
//
import SwiftUI
struct CustomIcon {
let leftEye: Image
let rightEye: Image
let mouth: Image
let background: AnyView?
let bgColor: Color
let innerColor: Color
}
enum BackGroundOptions: String, CaseIterable {
case horrible
case bad
case average
case good
case great
case random
static var selectable: [BackGroundOptions] {
return [.great, .good, .average, .bad, .horrible]
}
}
enum Eyes {
case left
case right
}
enum EyeOptions: String, CaseIterable {
case fire = "fire"
case bolt = "bolt2"
case dollar = "dollar"
static public var defaultOption: AnyView {
let image = Image(EyeOptions.fire.rawValue, bundle: .main)
.resizable()
.frame(width: 20, height: 20)
return AnyView(image)
}
}
enum MouthOptions: String, CaseIterable {
case moonFill = "moon.fill"
case flame = "flame"
case flameCircle = "flame.circle"
static public var defaultOption: MouthOptions {
return MouthOptions.flameCircle
}
}
struct CreateIconView: View {
@State private var bgColor = Color.red
@State private var innerColor = Color.green
@State private var bgPattern = [(AnyView, UUID)]()
@State private var leftEye: AnyView = EyeOptions.defaultOption
@State private var rightEye: AnyView = EyeOptions.defaultOption
@State private var mouth: Image = Image(systemName: MouthOptions.defaultOption.rawValue)
private var randomElements: [AnyView] = [
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
.resizable()
.frame(width: 20, height: 20)),
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
.resizable()
.frame(width: 20, height: 20)),
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
.resizable()
.frame(width: 20, height: 20)),
AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
.resizable()
.frame(width: 20, height: 20))
]
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)
]
func update(eye: Eyes, eyeOption: EyeOptions) {
let image = Image(eyeOption.rawValue, bundle: .main)
.resizable()
.frame(width: 20, height: 20)
switch eye {
case .left:
leftEye = AnyView(image)
case .right:
rightEye = AnyView(image)
}
}
func createRandom() {
bgColor = Color(
red: .random(in: 0...1),
green: .random(in: 0...1),
blue: .random(in: 0...1)
)
innerColor = Color(
red: .random(in: 0...1),
green: .random(in: 0...1),
blue: .random(in: 0...1)
)
update(eye: .left, eyeOption: EyeOptions.allCases.randomElement()!)
update(eye: .right, eyeOption: EyeOptions.allCases.randomElement()!)
update(mouthOption: MouthOptions.allCases.randomElement()!)
update(background: BackGroundOptions.allCases.randomElement()!)
}
func update(mouthOption: MouthOptions) {
mouth = Image(systemName: mouthOption.rawValue)
}
func update(background: BackGroundOptions) {
bgPattern.removeAll()
if background == .random {
for _ in 0...120 {
let image = Image(BackGroundOptions.selectable.randomElement()!.rawValue, bundle: .main)
let sizedImage = image
.resizable()
.frame(width: 20, height: 20)
bgPattern.append((AnyView(sizedImage), UUID()))
}
return
}
let image = Image(background.rawValue, bundle: .main)
let sizedImage = image
.resizable()
.frame(width: 20, height: 20)
for _ in 0...120 {
bgPattern.append((AnyView(sizedImage), UUID()))
}
}
var mixBG: some View {
VStack {
HStack {
randomElements[0]
randomElements[1]
}
HStack {
randomElements[2]
randomElements[3]
}
}
}
var iconView: some View {
ZStack {
LazyVGrid(columns: columns, spacing: 0) {
ForEach(bgPattern, id: \.self.1) {
$0.0
}
}
.frame(width: 200, height: 200)
.position(x: 100, y: 110)
Circle()
.strokeBorder(Color.black, lineWidth: 12)
.background(Circle().fill(innerColor))
.frame(width: 120, height: 120, alignment: .center)
VStack {
Spacer()
.frame(height: 70)
HStack {
Spacer()
.frame(width: 72)
leftEye
Spacer()
.frame(width: 24)
rightEye
Spacer()
}
Spacer()
.frame(height: 28)
mouth
Spacer()
}
}
.frame(width: 200, height: 200)
.background(
bgColor
)
.cornerRadius(10)
}
var body: some View {
VStack {
iconView
.padding()
Spacer()
VStack {
ColorPicker("Set the background color", selection: $bgColor)
.padding([.leading, .trailing])
ColorPicker("Set the inner color", selection: $innerColor)
.padding([.leading, .trailing])
}
HStack {
Spacer()
Menu("Left Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .left, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
Spacer()
Menu("Right Eye") {
ForEach(EyeOptions.allCases, id: \.self) { option in
Button(action: {
update(eye: .right, eyeOption: option)
}, label: {
Label(option.rawValue, image: option.rawValue)
})
}
}
Spacer()
Menu("Mouth") {
ForEach(MouthOptions.allCases, id: \.self) { option in
Button(action: {
update(mouthOption: option)
}, label: {
Image(systemName: option.rawValue)
})
}
}
Spacer()
}
.padding(.top, 10)
VStack{
Text("Background")
HStack {
ForEach(BackGroundOptions.selectable, id: \.self) { bg in
Image(bg.rawValue, bundle: .main)
.resizable()
.frame(width: CGFloat(50), height: CGFloat(50), alignment: .center)
.onTapGesture {
update(background: bg)
}
}
mixBG
.onTapGesture {
update(background: .random)
}
}
}
.padding(.top, 10)
Button(action: {
createRandom()
}, label: {
Text("Random")
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
.frame(minWidth: 0, maxWidth: .infinity)
.background(.blue)
})
Button(action: {
// let newIcon = CustomIcon(leftEye: leftEye,
// rightEye: rightEye,
// mouth: mouth,
// background: bgPattern,
// bgColor: bgColor,
// innerColor: innerColor)
}, label: {
Text("Save")
.font(.title)
.fontWeight(.bold)
.foregroundColor(Color(UIColor.white))
.frame(minWidth: 0, maxWidth: .infinity)
.background(.green)
})
}
}
}
struct CreateIconView_Previews: PreviewProvider {
static var previews: some View {
CreateIconView()
}
}

View File

@@ -7,7 +7,7 @@
import SwiftUI
struct EmptyView: View {
struct EmptyContentView: View {
@AppStorage(UserDefaultsStore.Keys.theme.rawValue, store: GroupUserDefaults.groupDefaults) private var theme: Theme = .system
let viewModel: ContentModeViewModel
@@ -38,8 +38,8 @@ struct EmptyView: View {
}
}
struct EmptyView_Previews: PreviewProvider {
struct EmptyContentView_Previews: PreviewProvider {
static var previews: some View {
EmptyView(viewModel: ContentModeViewModel())
EmptyContentView(viewModel: ContentModeViewModel())
}
}

View File

@@ -18,6 +18,7 @@ struct SettingsView: View {
@State private var showSpecialThanks = false
@State private var showWhyBGMode = false
@State private var showCreateCustomWidget = false
@ObservedObject var syncMonitor = SyncMonitor.shared
@AppStorage(UserDefaultsStore.Keys.useCloudKit.rawValue, store: GroupUserDefaults.groupDefaults) private var useCloudKit = false
@@ -35,6 +36,7 @@ struct SettingsView: View {
canDelete
changeIcon
themePicker
createCustomWidget
showOnboardingButton
whyBackgroundMode
specialThanksCell
@@ -58,6 +60,9 @@ struct SettingsView: View {
showOnboarding = false
})
}
.sheet(isPresented: $showCreateCustomWidget) {
CreateIconView()
}
.background(
theme.currentTheme.bg
.edgesIgnoringSafeArea(.all)
@@ -283,6 +288,20 @@ struct SettingsView: View {
.fixedSize(horizontal: false, vertical: true)
.cornerRadius(10, corners: [.topLeft, .topRight, .bottomLeft, .bottomRight])
}
private var createCustomWidget: some View {
ZStack {
Color(theme.currentTheme.secondaryBGColor)
Button(action: {
showCreateCustomWidget = true
}, label: {
Text("Create Custom Widget")
})
.padding()
}
.fixedSize(horizontal: false, vertical: true)
.cornerRadius(10, corners: [.topLeft, .topRight, .bottomLeft, .bottomRight])
}
}
struct SettingsView_Previews: PreviewProvider {