Merge pull request #758 from omnivore-app/reader-prefs-modal

Reader prefs modal
This commit is contained in:
Satindar Dhillon
2022-06-04 08:21:39 -07:00
committed by GitHub
3 changed files with 100 additions and 72 deletions

View File

@ -196,7 +196,7 @@ import WebKit
Spacer()
}
}
.formSheet(isPresented: $showPreferencesPopover) {
.formSheet(isPresented: $showPreferencesPopover, useSmallDetent: false) {
WebPreferencesPopoverView(
updateFontFamilyAction: { updateFontFamilyActionID = UUID() },
updateFontAction: { updateFontActionID = UUID() },

View File

@ -41,74 +41,90 @@ public struct WebPreferencesPopoverView: View {
self.dismissAction = dismissAction
}
public var body: some View {
VStack(alignment: .center) {
Text("Reader Preferences")
.foregroundColor(.appGrayText)
.font(Font.system(size: 17, weight: .semibold))
List {
Section("Sizing") {
LabelledStepper(
labelText: "Font Size:",
onIncrement: {
storedFontSize = min(storedFontSize + 2, 28)
updateFontAction()
},
onDecrement: {
storedFontSize = max(storedFontSize - 2, 10)
updateFontAction()
}
)
if UIDevice.isIPad {
LabelledStepper(
labelText: "Margin:",
onIncrement: {
storedMargin = min(storedMargin + 45, 560)
updateMarginAction()
},
onDecrement: {
storedMargin = max(storedMargin - 45, 200)
updateMarginAction()
var fontList: some View {
List {
ForEach(WebFont.allCases, id: \.self) { font in
Button(
action: {
preferredFont = font.rawValue
updateFontFamilyAction()
},
label: {
HStack {
Text(font.rawValue).foregroundColor(.appGrayTextContrast)
Spacer()
if font.rawValue == preferredFont {
Image(systemName: "checkmark").foregroundColor(.appGrayTextContrast)
}
)
}
LabelledStepper(
labelText: "Line Spacing:",
onIncrement: {
storedLineSpacing = min(storedLineSpacing + 25, 300)
updateLineHeightAction()
},
onDecrement: {
storedLineSpacing = max(storedLineSpacing - 25, 100)
updateLineHeightAction()
}
)
}
Section("Font Family") {
ForEach(WebFont.allCases, id: \.self) { font in
Button(
action: {
preferredFont = font.rawValue
updateFontFamilyAction()
},
label: {
HStack {
Text(font.rawValue).foregroundColor(.appGrayTextContrast)
Spacer()
if font.rawValue == preferredFont {
Image(systemName: "checkmark").foregroundColor(.appGrayTextContrast)
}
}
}
)
}
}
)
}
.padding()
}
.padding()
.navigationBarTitleDisplayMode(.inline)
}
public var body: some View {
NavigationView {
VStack(alignment: .center) {
Text("Reader Preferences")
.foregroundColor(.appGrayText)
.font(Font.system(size: 17, weight: .semibold))
LabelledStepper(
labelText: "Font Size:",
onIncrement: {
storedFontSize = min(storedFontSize + 2, 28)
updateFontAction()
},
onDecrement: {
storedFontSize = max(storedFontSize - 2, 10)
updateFontAction()
}
)
if UIDevice.isIPad {
LabelledStepper(
labelText: "Margin:",
onIncrement: {
storedMargin = min(storedMargin + 45, 560)
updateMarginAction()
},
onDecrement: {
storedMargin = max(storedMargin - 45, 200)
updateMarginAction()
}
)
}
LabelledStepper(
labelText: "Line Spacing:",
onIncrement: {
storedLineSpacing = min(storedLineSpacing + 25, 300)
updateLineHeightAction()
},
onDecrement: {
storedLineSpacing = max(storedLineSpacing - 25, 100)
updateLineHeightAction()
}
)
HStack {
NavigationLink(destination: fontList) {
Text("Change Reader Font")
}
Image(systemName: "chevron.right")
Spacer()
}
.frame(height: 40)
Spacer()
}
.padding()
.navigationBarHidden(true)
}
.accentColor(.appGrayTextContrast)
}
}

View File

@ -13,28 +13,33 @@ import SwiftUI
var content: () -> Content
var onDismiss: (() -> Void)?
var modalSize: CGSize
let useSmallDetent: Bool
private var hostVC: UIHostingController<Content>?
@available(*, unavailable)
required init?(coder _: NSCoder) { fatalError("") }
init(content: @escaping () -> Content, modalSize: CGSize) {
init(content: @escaping () -> Content, modalSize: CGSize, useSmallDetent: Bool) {
self.content = content
self.modalSize = modalSize
self.useSmallDetent = useSmallDetent
super.init(nibName: nil, bundle: nil)
}
func show() {
guard hostVC == nil else { return }
// WIP: use subclass to control a max height we pass in for iphone
// let controller = FormSheetHostingController(rootView: content(), height: 100)
let controller = UIHostingController(rootView: content())
let controller: UIHostingController<Content> = {
if UIDevice.isIPhone, useSmallDetent {
return FormSheetHostingController(rootView: content(), height: 100)
} else {
return UIHostingController(rootView: content())
}
}()
if controller.traitCollection.userInterfaceIdiom == .phone {
if UIDevice.isIPhone {
if let sheet = controller.sheetPresentationController {
// sheet.preferredCornerRadius = 32
sheet.prefersGrabberVisible = true
sheet.prefersGrabberVisible = false
sheet.detents = [.medium()]
sheet.widthFollowsPreferredContentSizeWhenEdgeAttached = true
}
@ -68,12 +73,17 @@ import SwiftUI
@Binding var show: Bool
let modalSize: CGSize
let useSmallDetent: Bool
let content: () -> Content
func makeUIViewController(
context _: UIViewControllerRepresentableContext<FormSheet<Content>>
) -> FormSheetWrapper<Content> {
let controller = FormSheetWrapper(content: content, modalSize: modalSize)
let controller = FormSheetWrapper(
content: content,
modalSize: modalSize,
useSmallDetent: useSmallDetent
)
controller.onDismiss = { self.show = false }
return controller
}
@ -94,12 +104,14 @@ import SwiftUI
func formSheet<Content: View>(
isPresented: Binding<Bool>,
modalSize: CGSize = CGSize(width: 320, height: 320),
useSmallDetent: Bool = false,
@ViewBuilder content: @escaping () -> Content
) -> some View {
background(
FormSheet(
show: isPresented,
modalSize: modalSize,
useSmallDetent: useSmallDetent,
content: content
)
)