spacing on shapes and text

This commit is contained in:
Trey t
2022-03-20 14:43:25 -05:00
parent 36a688084c
commit e226437e50
5 changed files with 79 additions and 39 deletions

View File

@@ -25,7 +25,16 @@ enum BGShape: Int, CaseIterable {
minHeight: 5, minHeight: 5,
maxHeight: 500, maxHeight: 500,
alignment: .center) alignment: .center)
.overlay(
text
.font(.title2)
.fontWeight(.bold)
.lineLimit(1)
.foregroundColor(textColor)
.minimumScaleFactor(0.2)
.padding(10)
.frame(maxWidth: .infinity, alignment: .center)
)
case .diamond: case .diamond:
Diamond() Diamond()
.fill(bgColor) .fill(bgColor)
@@ -34,7 +43,16 @@ enum BGShape: Int, CaseIterable {
minHeight: 5, minHeight: 5,
maxHeight: 500) maxHeight: 500)
.aspectRatio(contentMode: .fit) .aspectRatio(contentMode: .fit)
.overlay(
text
.font(.title2)
.fontWeight(.bold)
.lineLimit(1)
.foregroundColor(textColor)
.minimumScaleFactor(0.2)
.padding(10)
.frame(maxWidth: .infinity, alignment: .center)
)
case .rectangle: case .rectangle:
Rectangle() Rectangle()
.fill(bgColor) .fill(bgColor)
@@ -43,6 +61,16 @@ enum BGShape: Int, CaseIterable {
minHeight: 5, minHeight: 5,
maxHeight: 500, maxHeight: 500,
alignment: .center) alignment: .center)
.overlay(
text
.font(.title2)
.fontWeight(.bold)
.lineLimit(1)
.foregroundColor(textColor)
.minimumScaleFactor(0.2)
.padding(10)
.frame(maxWidth: .infinity, alignment: .center)
)
case .roundedRectangle: case .roundedRectangle:
RoundedRectangle(cornerRadius: 8, style: .continuous) RoundedRectangle(cornerRadius: 8, style: .continuous)
.fill(bgColor) .fill(bgColor)
@@ -51,15 +79,17 @@ enum BGShape: Int, CaseIterable {
minHeight: 5, minHeight: 5,
maxHeight: 500, maxHeight: 500,
alignment: .center) alignment: .center)
} .overlay(
text text
.font(.title2) .font(.title2)
.fontWeight(.bold) .fontWeight(.bold)
.lineLimit(1) .lineLimit(1)
.foregroundColor(textColor) .foregroundColor(textColor)
.minimumScaleFactor(0.7) .minimumScaleFactor(0.2)
.padding(10) .padding(10)
.frame(maxWidth: .infinity, alignment: .center) .frame(maxWidth: .infinity, alignment: .center)
)
}
}) })
} }
} }

View File

@@ -484,6 +484,7 @@ struct CustomizeView: View {
Text(String(localized: "customize_view_view_pick_shape")) Text(String(localized: "customize_view_view_pick_shape"))
.padding([.leading]) .padding([.leading])
.foregroundColor(textColor) .foregroundColor(textColor)
Divider() Divider()
HStack { HStack {

View File

@@ -9,7 +9,7 @@ import SwiftUI
enum PercViewType { enum PercViewType {
case text case text
case circular case shape
} }
struct HeaderPercView: View { struct HeaderPercView: View {
@@ -72,7 +72,7 @@ struct HeaderPercView: View {
} }
} }
private var circularViews: some View { private var shapeViews: some View {
VStack { VStack {
Spacer() Spacer()
HStack { HStack {
@@ -102,8 +102,9 @@ struct HeaderPercView: View {
switch self.type { switch self.type {
case .text: case .text:
textViews textViews
case .circular: case .shape:
circularViews shapeViews
.padding([.leading, .trailing])
} }
} }
} }
@@ -113,6 +114,6 @@ struct HeaderPercView_Previews: PreviewProvider {
static var previews: some View { static var previews: some View {
HeaderPercView(fakeData: true, backDays: 30, type: .text) HeaderPercView(fakeData: true, backDays: 30, type: .text)
HeaderPercView(fakeData: true, backDays: 30, type: .circular) HeaderPercView(fakeData: true, backDays: 30, type: .shape)
} }
} }

View File

@@ -196,11 +196,12 @@ extension MonthView {
} }
} }
Divider() Divider()
LazyVGrid(columns: columns, spacing: 25) { LazyVGrid(columns: columns, spacing: 15) {
ForEach(entries, id: \.self) { entry in ForEach(entries, id: \.self) { entry in
shape.view(withText: Text(""), bgColor: entry.mood == .placeholder ? .clear : moodTint.color(forMood: entry.mood), shape.view(withText: Text(""),
bgColor: entry.mood == .placeholder ? .clear : moodTint.color(forMood: entry.mood),
textColor: .clear) textColor: .clear)
.frame(minHeight: 5, idealHeight: 20, maxHeight: 50, alignment: .center) .frame(maxWidth: .infinity, maxHeight: .infinity)
} }
} }
} }

View File

@@ -40,30 +40,37 @@ struct SwitchableView: View {
self._viewType = viewType self._viewType = viewType
} }
var body: some View { private var mainViews: some View {
VStack {
ZStack {
Text(String(customMoodTintUpdateNumber))
.hidden()
switch viewType { switch viewType {
case .total: case .total:
return AnyView(
HeaderStatsView(fakeData: false, backDays: daysBack, moodTint: [ HeaderStatsView(fakeData: false, backDays: daysBack, moodTint: [
moodTint.color(forMood: .great), moodTint.color(forMood: .great),
moodTint.color(forMood: .good), moodTint.color(forMood: .good),
moodTint.color(forMood: .average), moodTint.color(forMood: .average),
moodTint.color(forMood: .bad), moodTint.color(forMood: .bad),
moodTint.color(forMood: .horrible) moodTint.color(forMood: .horrible)
], textColor: textColor) ], textColor: textColor))
.padding([.leading, .trailing], -15)
.padding([.top, .bottom], 8)
.allowsHitTesting(false) .allowsHitTesting(false)
case .percentageShape: case .percentageShape:
HeaderPercView(fakeData: false, backDays: daysBack, type: .circular) return AnyView(
HeaderPercView(fakeData: false, backDays: daysBack, type: .shape))
.allowsHitTesting(false) .allowsHitTesting(false)
case .percentage: case .percentage:
HeaderPercView(fakeData: false, backDays: daysBack, type: .text) return AnyView(
HeaderPercView(fakeData: false, backDays: daysBack, type: .text))
.allowsHitTesting(false) .allowsHitTesting(false)
} }
}
var body: some View {
VStack {
ZStack {
Text(String(customMoodTintUpdateNumber))
.hidden()
mainViews
.padding(.top)
VStack { VStack {
HStack { HStack {