scrolling disabled, better intrinsic size, changed asset

This commit is contained in:
Mauro Romito 2022-11-30 11:11:00 +01:00
parent 84c9c7fa50
commit e7b9b2e8d7
11 changed files with 74 additions and 50 deletions

View file

@ -1,17 +1,17 @@
{
"images" : [
{
"filename" : "action_formatting_disabled.png",
"filename" : "Frame 143.png",
"idiom" : "universal",
"scale" : "1x"
},
{
"filename" : "action_formatting_disabled@2x.png",
"filename" : "Frame 143@2x.png",
"idiom" : "universal",
"scale" : "2x"
},
{
"filename" : "action_formatting_disabled@3x.png",
"filename" : "Frame 143@3x.png",
"idiom" : "universal",
"scale" : "3x"
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 447 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 738 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 924 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 513 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -41,14 +41,23 @@ final class ComposerCreateActionListCoordinator: NSObject, Coordinator, Presenta
// MARK: - Setup
init(actions: [ComposerCreateAction], wysiwygEnabled: Bool, textFormattingEnabled: Bool) {
let isScrollingEnabled: Bool
if #available(iOS 16, *) {
isScrollingEnabled = false
} else {
isScrollingEnabled = true
}
viewModel = ComposerCreateActionListViewModel(initialViewState: ComposerCreateActionListViewState(
actions: actions,
wysiwygEnabled: wysiwygEnabled,
isScrollingEnabled: isScrollingEnabled,
bindings: ComposerCreateActionListBindings(textFormattingEnabled: textFormattingEnabled)))
view = ComposerCreateActionList(viewModel: viewModel.context)
let hostingVC = VectorHostingController(rootView: view)
let height = hostingVC.sizeThatFits(in: CGSize(width: hostingVC.view.frame.width, height: UIView.layoutFittingCompressedSize.height)).height
hostingVC.bottomSheetPreferences = VectorHostingBottomSheetPreferences(
detents: [.custom(height: 470)],
// on iOS 15 custom will be replaced by medium which may require some scrolling
detents: [.custom(height: height)],
prefersGrabberVisible: true,
cornerRadius: 20,
prefersScrollingExpandsWhenScrolledToEdge: false
@ -56,6 +65,7 @@ final class ComposerCreateActionListCoordinator: NSObject, Coordinator, Presenta
hostingController = hostingVC
super.init()
hostingVC.presentationController?.delegate = self
hostingVC.bottomSheetPreferences?.setup(viewController: hostingVC)
}
// MARK: - Public

View file

@ -36,6 +36,7 @@ enum MockComposerCreateActionListScreenState: MockScreenState, CaseIterable {
let viewModel = ComposerCreateActionListViewModel(initialViewState: ComposerCreateActionListViewState(
actions: actions,
wysiwygEnabled: true,
isScrollingEnabled: false,
bindings: ComposerCreateActionListBindings(textFormattingEnabled: true)))
return (

View file

@ -38,6 +38,7 @@ struct ComposerCreateActionListViewState: BindableState {
/// The list of composer create actions to display to the user
let actions: [ComposerCreateAction]
let wysiwygEnabled: Bool
let isScrollingEnabled: Bool
var bindings: ComposerCreateActionListBindings
}

View file

@ -32,56 +32,68 @@ struct ComposerCreateActionList: View {
// MARK: Public
@ObservedObject var viewModel: ComposerCreateActionListViewModel.Context
private var internalView: some View {
VStack(alignment: .leading) {
ForEach(viewModel.viewState.actions) { action in
HStack(spacing: 16) {
Image(action.icon)
.renderingMode(.template)
.foregroundColor(theme.colors.accent)
Text(action.title)
.foregroundColor(theme.colors.primaryContent)
.font(theme.fonts.body)
.accessibilityIdentifier(action.accessibilityIdentifier)
Spacer()
}
.contentShape(Rectangle())
.onTapGesture {
viewModel.send(viewAction: .selectAction(action))
}
.padding(.horizontal, 16)
.padding(.vertical, 12)
}
if viewModel.viewState.wysiwygEnabled {
SeparatorLine()
HStack(spacing: 16) {
Image(textFormattingIcon)
.renderingMode(.template)
.foregroundColor(theme.colors.accent)
Text(VectorL10n.wysiwygComposerStartActionTextFormatting)
.foregroundColor(theme.colors.primaryContent)
.font(theme.fonts.body)
.accessibilityIdentifier("textFormatting")
Spacer()
Toggle("", isOn: $viewModel.textFormattingEnabled)
.toggleStyle(ComposerToggleActionStyle())
.labelsHidden()
.onChange(of: viewModel.textFormattingEnabled) { isOn in
viewModel.send(viewAction: .toggleTextFormatting(isOn))
}
}
.contentShape(Rectangle())
.padding(.horizontal, 16)
.padding(.vertical, 12)
}
}
}
var body: some View {
ScrollView {
VStack(alignment: .leading) {
ForEach(viewModel.viewState.actions) { action in
HStack(spacing: 16) {
Image(action.icon)
.renderingMode(.template)
.foregroundColor(theme.colors.accent)
Text(action.title)
.foregroundColor(theme.colors.primaryContent)
.font(theme.fonts.body)
.accessibilityIdentifier(action.accessibilityIdentifier)
Spacer()
}
.contentShape(Rectangle())
.onTapGesture {
viewModel.send(viewAction: .selectAction(action))
}
.padding(.horizontal, 16)
.padding(.vertical, 12)
}
if viewModel.viewState.wysiwygEnabled {
SeparatorLine()
HStack(spacing: 16) {
Image(textFormattingIcon)
.renderingMode(.template)
.foregroundColor(theme.colors.accent)
Text(VectorL10n.wysiwygComposerStartActionTextFormatting)
.foregroundColor(theme.colors.primaryContent)
.font(theme.fonts.body)
.accessibilityIdentifier("textFormatting")
Spacer()
Toggle("", isOn: $viewModel.textFormattingEnabled)
.toggleStyle(ComposerToggleActionStyle())
.labelsHidden()
.onChange(of: viewModel.textFormattingEnabled) { isOn in
viewModel.send(viewAction: .toggleTextFormatting(isOn))
}
}
.contentShape(Rectangle())
.padding(.horizontal, 16)
.padding(.vertical, 12)
}
if viewModel.viewState.isScrollingEnabled {
ScrollView {
internalView
}
Spacer()
.padding(.top, 23)
.background(theme.colors.background.ignoresSafeArea())
} else {
VStack {
internalView
Spacer()
}
.padding(.top, 23)
.background(theme.colors.background.ignoresSafeArea())
}
.padding(.top, 23)
.background(theme.colors.background.ignoresSafeArea())
}
}