spacing on shapes and text
This commit is contained in:
@@ -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
|
||||||
|
.font(.title2)
|
||||||
|
.fontWeight(.bold)
|
||||||
|
.lineLimit(1)
|
||||||
|
.foregroundColor(textColor)
|
||||||
|
.minimumScaleFactor(0.2)
|
||||||
|
.padding(10)
|
||||||
|
.frame(maxWidth: .infinity, alignment: .center)
|
||||||
|
)
|
||||||
}
|
}
|
||||||
text
|
|
||||||
.font(.title2)
|
|
||||||
.fontWeight(.bold)
|
|
||||||
.lineLimit(1)
|
|
||||||
.foregroundColor(textColor)
|
|
||||||
.minimumScaleFactor(0.7)
|
|
||||||
.padding(10)
|
|
||||||
.frame(maxWidth: .infinity, alignment: .center)
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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 {
|
||||||
|
|||||||
@@ -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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -40,31 +40,38 @@ struct SwitchableView: View {
|
|||||||
self._viewType = viewType
|
self._viewType = viewType
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private var mainViews: some View {
|
||||||
|
switch viewType {
|
||||||
|
case .total:
|
||||||
|
return AnyView(
|
||||||
|
HeaderStatsView(fakeData: false, backDays: daysBack, moodTint: [
|
||||||
|
moodTint.color(forMood: .great),
|
||||||
|
moodTint.color(forMood: .good),
|
||||||
|
moodTint.color(forMood: .average),
|
||||||
|
moodTint.color(forMood: .bad),
|
||||||
|
moodTint.color(forMood: .horrible)
|
||||||
|
], textColor: textColor))
|
||||||
|
.allowsHitTesting(false)
|
||||||
|
case .percentageShape:
|
||||||
|
return AnyView(
|
||||||
|
HeaderPercView(fakeData: false, backDays: daysBack, type: .shape))
|
||||||
|
.allowsHitTesting(false)
|
||||||
|
case .percentage:
|
||||||
|
return AnyView(
|
||||||
|
HeaderPercView(fakeData: false, backDays: daysBack, type: .text))
|
||||||
|
.allowsHitTesting(false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
VStack {
|
VStack {
|
||||||
ZStack {
|
ZStack {
|
||||||
Text(String(customMoodTintUpdateNumber))
|
Text(String(customMoodTintUpdateNumber))
|
||||||
.hidden()
|
.hidden()
|
||||||
switch viewType {
|
|
||||||
case .total:
|
mainViews
|
||||||
HeaderStatsView(fakeData: false, backDays: daysBack, moodTint: [
|
.padding(.top)
|
||||||
moodTint.color(forMood: .great),
|
|
||||||
moodTint.color(forMood: .good),
|
|
||||||
moodTint.color(forMood: .average),
|
|
||||||
moodTint.color(forMood: .bad),
|
|
||||||
moodTint.color(forMood: .horrible)
|
|
||||||
], textColor: textColor)
|
|
||||||
.padding([.leading, .trailing], -15)
|
|
||||||
.padding([.top, .bottom], 8)
|
|
||||||
.allowsHitTesting(false)
|
|
||||||
case .percentageShape:
|
|
||||||
HeaderPercView(fakeData: false, backDays: daysBack, type: .circular)
|
|
||||||
.allowsHitTesting(false)
|
|
||||||
case .percentage:
|
|
||||||
HeaderPercView(fakeData: false, backDays: daysBack, type: .text)
|
|
||||||
.allowsHitTesting(false)
|
|
||||||
}
|
|
||||||
|
|
||||||
VStack {
|
VStack {
|
||||||
HStack {
|
HStack {
|
||||||
Spacer()
|
Spacer()
|
||||||
|
|||||||
Reference in New Issue
Block a user