Switched to Pickers instead of Sliders

…because tick marks on SwiftUI pickers are painful
This commit is contained in:
Stuart Breckenridge
2022-12-20 17:20:45 +08:00
parent 7a41b411c8
commit 686d93f49e
6 changed files with 51 additions and 35 deletions

View File

@@ -2644,7 +2644,7 @@
511D43CE231FA51100FB1562 /* Resources */,
176813A22564B9D100D98635 /* Widget */,
173A64162547BE0900267F6E /* AccountType+Helpers.swift */,
DFB34985294B3B0800BC81AD /* Translations */,
DFB34985294B3B0800BC81AD /* Localizations */,
);
path = Shared;
sourceTree = "<group>";
@@ -2983,14 +2983,14 @@
path = Views;
sourceTree = "<group>";
};
DFB34985294B3B0800BC81AD /* Translations */ = {
DFB34985294B3B0800BC81AD /* Localizations */ = {
isa = PBXGroup;
children = (
DFB34983294B3AFF00BC81AD /* Buttons.strings */,
DFB34998294C4F1D00BC81AD /* Errors.strings */,
DFB34995294C4DCB00BC81AD /* LocalizedNetNewsWireError.swift */,
);
path = Translations;
path = Localizations;
sourceTree = "<group>";
};
DFB34986294B446300BC81AD /* SwiftUI Extensions */ = {

View File

@@ -162,7 +162,7 @@ extension CGImage {
}
enum IconSize: Int, CaseIterable {
enum IconSize: Int, CaseIterable, CustomStringConvertible {
case small = 1
case medium = 2
case large = 3
@@ -181,5 +181,16 @@ enum IconSize: Int, CaseIterable {
return CGSize(width: IconSize.largeDimension, height: IconSize.largeDimension)
}
}
var description: String {
switch self {
case .small:
return "Small"
case .medium:
return "Medium"
case .large:
return "Large"
}
}
}

View File

@@ -15,43 +15,44 @@ struct TimelineCustomizerView: View {
var body: some View {
List {
Section(header: Text("ICON_SIZE", tableName: "Settings")) {
Slider(value: Binding(get: { Float(appDefaults.timelineIconSize.rawValue) },
set: { appDefaults.timelineIconSize = IconSize(rawValue: Int($0))! }),
in: Float(IconSize.small.rawValue)...Float(IconSize.large.rawValue),
step: 1,
label: { Text("ICON_SIZE", tableName: "Settings") },
onEditingChanged: { _ in
})
.tint(Color(uiColor: AppAssets.primaryAccentColor))
Section {
ZStack {
Picker(selection: $appDefaults.timelineIconSize) {
ForEach(IconSize.allCases, id: \.self) { size in
Text(size.description)
}
} label: {
Text("ICON_SIZE", tableName: "Settings")
}
}
.padding(.horizontal, 16)
.padding(.vertical, 8)
.padding(.vertical, 4)
.listRowInsets(EdgeInsets(top: 0, leading: 15, bottom: 0, trailing: 15))
.background(
RoundedRectangle(cornerRadius: 8)
.foregroundColor(Color(uiColor: UIColor.systemBackground))
.foregroundColor(Color(uiColor: UIColor.secondarySystemGroupedBackground))
)
}
.listRowInsets(EdgeInsets(top: 0, leading: 30, bottom: 0, trailing: 30))
.listRowBackground(Color.clear)
.listRowSeparator(.hidden)
Section(header: Text("NUMBER_OF_LINES", tableName: "Settings")) {
Slider(value: Binding(get: { Float(appDefaults.timelineNumberOfLines) },
set: { appDefaults.timelineNumberOfLines = Int($0) }),
in: 1...5,
step: 1,
label: { Text("NUMBER_OF_LINES", tableName: "Settings") },
onEditingChanged: { _ in
})
.tint(Color(uiColor: AppAssets.primaryAccentColor))
Section {
ZStack {
Picker(selection: $appDefaults.timelineNumberOfLines) {
ForEach(1...5, id: \.self) { size in
Text("\(size)")
}
} label: {
Text("NUMBER_OF_LINES", tableName: "Settings")
}
}
.padding(.horizontal, 16)
.padding(.vertical, 8)
.padding(.vertical, 4)
.listRowInsets(EdgeInsets(top: 0, leading: 15, bottom: 0, trailing: 15))
.background(
RoundedRectangle(cornerRadius: 8)
.foregroundColor(Color(uiColor: UIColor.systemBackground))
.foregroundColor(Color(uiColor: UIColor.secondarySystemGroupedBackground))
)
}
.listRowInsets(EdgeInsets(top: 0, leading: 30, bottom: 0, trailing: 30))
@@ -59,16 +60,22 @@ struct TimelineCustomizerView: View {
.listRowSeparator(.hidden)
Section {
timeLinePreviewRow
.listRowInsets(EdgeInsets(top: 4, leading: 4, bottom: 4, trailing: 28))
withAnimation {
timeLinePreviewRow
.listRowInsets(EdgeInsets(top: 8, leading: 4, bottom: 4, trailing: 24))
}
}
}
.listStyle(.grouped)
.navigationTitle(Text("TIMELINE_LAYOUT", tableName: "Settings"))
.onAppear {
}
}
var timeLinePreviewRow: some View {
HStack(spacing: 6) {
HStack(alignment: .top, spacing: 6) {
VStack {
Circle()
.foregroundColor(Color(uiColor: AppAssets.primaryAccentColor))
@@ -76,13 +83,14 @@ struct TimelineCustomizerView: View {
Spacer()
}.frame(width: 12)
VStack {
Image(systemName: "globe.europe.africa.fill")
Image("faviconTemplateImage")
.renderingMode(.template)
.resizable()
.frame(width: appDefaults.timelineIconSize.size.width, height: appDefaults.timelineIconSize.size.height)
.foregroundColor(Color(uiColor: AppAssets.primaryAccentColor))
Spacer()
}.frame(width: appDefaults.timelineIconSize.size.width)
VStack(spacing: 4) {
VStack(alignment: .leading, spacing: 4) {
Text("Enim ut tellus elementum sagittis vitae et. Nibh praesent tristique magna sit amet purus gravida quis blandit. Neque volutpat ac tincidunt vitae semper quis lectus nulla. Massa id neque aliquam vestibulum morbi blandit. Ultrices vitae auctor eu augue. Enim eu turpis egestas pretium aenean pharetra magna. Eget gravida cum sociis natoque. Sit amet consectetur adipiscing elit. Auctor eu augue ut lectus arcu bibendum. Maecenas volutpat blandit aliquam etiam erat velit. Ut pharetra sit amet aliquam id diam maecenas ultricies. In hac habitasse platea dictumst quisque sagittis purus sit amet.")
.bold()
.lineLimit(appDefaults.timelineNumberOfLines)
@@ -100,10 +108,7 @@ struct TimelineCustomizerView: View {
.edgesIgnoringSafeArea(.all)
.padding(.vertical, 4)
.padding(.leading, 4)
}
}
struct TimelineCustomizerView_Previews: PreviewProvider {