WIP - custom widget creator
This commit is contained in:
@@ -269,7 +269,7 @@ struct ContentView: View {
|
||||
settingsButtonView
|
||||
if viewModel.hasNoData {
|
||||
Spacer()
|
||||
EmptyView(viewModel: viewModel)
|
||||
EmptyContentView(viewModel: viewModel)
|
||||
Spacer()
|
||||
} else {
|
||||
ZStack {
|
||||
|
||||
321
Shared/views/CreateIconView.swift
Normal file
321
Shared/views/CreateIconView.swift
Normal 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()
|
||||
}
|
||||
}
|
||||
@@ -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())
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user