Skip to content

Commit

Permalink
Use ColorPickerStackView in AnnotationViewController
Browse files Browse the repository at this point in the history 
Improve ColorPickerStackView
  • Loading branch information
@mvasilak
mvasilak committed Nov 18, 2023
1 parent 62efa17 commit 939dd7f
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 38 deletions.
58 changes: 26 additions & 32 deletions Zotero/Scenes/Detail/Annotation Popover/Views/AnnotationViewController.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ final class AnnotationViewController: UIViewController {
@IBOutlet private weak var containerStackView: UIStackView!
private weak var header: AnnotationViewHeader!
private weak var comment: AnnotationViewTextView?
private weak var colorPickerContainer: UIStackView!
private weak var colorPicker: ColorPickerStackView!
private weak var tagsButton: AnnotationViewButton!
private weak var tags: AnnotationViewText!
private weak var deleteButton: UIButton!
Expand Down Expand Up @@ -107,13 +107,7 @@ final class AnnotationViewController: UIViewController {
)

// Update selected color
if let views = self.colorPickerContainer?.arrangedSubviews {
for view in views {
guard let circleView = view as? ColorPickerCircleView else { continue }
circleView.isSelected = circleView.hexColor == annotation.color
circleView.accessibilityLabel = self.name(for: circleView.hexColor, isSelected: circleView.isSelected)
}
}
colorPicker.setSelected(hexColor: annotation.color)

// Update tags
if !annotation.tags.isEmpty {
Expand Down Expand Up @@ -237,32 +231,32 @@ final class AnnotationViewController: UIViewController {
let colorPickerContainer = UIView()
colorPickerContainer.backgroundColor = Asset.Colors.defaultCellBackground.color
colorPickerContainer.accessibilityLabel = L10n.Accessibility.Pdf.colorPicker
let colorPickerStackView = UIStackView(arrangedSubviews: [])
colorPickerStackView.setContentCompressionResistancePriority(.defaultHigh, for: .vertical)
colorPickerStackView.translatesAutoresizingMaskIntoConstraints = false
for (idx, hexColor) in AnnotationsConfig.colors(for: annotation.type).enumerated() {
let circleView = ColorPickerCircleView(hexColor: hexColor)
circleView.contentInsets = UIEdgeInsets(top: 11, left: (idx == 0 ? 16 : 11), bottom: 11, right: 11)
circleView.backgroundColor = .clear
circleView.isSelected = circleView.hexColor == self.viewModel.state.selectedAnnotation?.color
circleView.tap
.subscribe(with: self, onNext: { `self`, color in
self.set(color: color)
})
.disposed(by: self.disposeBag)
circleView.isAccessibilityElement = true
circleView.accessibilityLabel = self.name(for: circleView.hexColor, isSelected: circleView.isSelected)
circleView.backgroundColor = Asset.Colors.defaultCellBackground.color
colorPickerStackView.addArrangedSubview(circleView)
}
self.colorPickerContainer = colorPickerStackView
colorPickerContainer.addSubview(colorPickerStackView)

let hexColors = AnnotationsConfig.colors(for: annotation.type)
let colorPicker = ColorPickerStackView(
hexColors: hexColors,
columnsDistribution: .fixed(numberOfColumns: hexColors.count),
allowsMultipleSelection: false,
circleBackgroundColor: Asset.Colors.defaultCellBackground.color,
circleContentInsets: UIEdgeInsets(top: 11, left: 11, bottom: 11, right: 11),
accessibilityLabelProvider: { [weak self] hexColor, isSelected in
self?.name(for: hexColor, isSelected: isSelected)
},
hexColorToggled: { [weak self] hexColor in
self?.set(color: hexColor)
}
)
colorPicker.setSelected(hexColor: viewModel.state.selectedAnnotation?.color)
colorPicker.setContentCompressionResistancePriority(.defaultHigh, for: .vertical)
colorPicker.translatesAutoresizingMaskIntoConstraints = false
self.colorPicker = colorPicker
colorPickerContainer.addSubview(colorPicker)

NSLayoutConstraint.activate([
colorPickerStackView.topAnchor.constraint(equalTo: colorPickerContainer.topAnchor),
colorPickerStackView.bottomAnchor.constraint(equalTo: colorPickerContainer.bottomAnchor),
colorPickerStackView.leadingAnchor.constraint(equalTo: colorPickerContainer.leadingAnchor),
colorPickerStackView.trailingAnchor.constraint(lessThanOrEqualTo: colorPickerContainer.trailingAnchor)
colorPicker.topAnchor.constraint(equalTo: colorPickerContainer.topAnchor),
colorPicker.bottomAnchor.constraint(equalTo: colorPickerContainer.bottomAnchor),
colorPicker.leadingAnchor.constraint(equalTo: colorPickerContainer.leadingAnchor, constant: 5),
colorPicker.trailingAnchor.constraint(lessThanOrEqualTo: colorPickerContainer.trailingAnchor)
])

self.containerStackView.addArrangedSubview(colorPickerContainer)
Expand Down
23 changes: 17 additions & 6 deletions Zotero/Scenes/Detail/Annotation Popover/Views/ColorPickerStackView.swift
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ class ColorPickerStackView: UIStackView {
let circleSelectionInset: UIEdgeInsets
let circleContentInsets: UIEdgeInsets
let trailingSpacerViewProvider: () -> UIView?
let accessibilityLabelProvider: (_ hexColor: String, _ isSelected: Bool) -> String?
let hexColorToggled: (_ hexColor: String) -> Void
private let disposeBag: DisposeBag

Expand All @@ -35,11 +36,12 @@ class ColorPickerStackView: UIStackView {
allowsMultipleSelection: Bool,
circleBackgroundColor: UIColor,
circleSize: CGFloat = 22,
circleOffset: CGFloat,
circleOffset: CGFloat = .zero,
circleSelectionLineWidth: CGFloat = 1.5,
circleSelectionInset: UIEdgeInsets = UIEdgeInsets(top: 2, left: 2, bottom: 2, right: 2),
circleContentInsets: UIEdgeInsets = .zero,
trailingSpacerViewProvider: @escaping () -> UIView? = { nil },
accessibilityLabelProvider: @escaping (_ hexColor: String, _ isSelected: Bool) -> String? = { _, _ in nil },
hexColorToggled: @escaping (_ hexColor: String) -> Void
) {
self.hexColors = hexColors
Expand All @@ -52,6 +54,7 @@ class ColorPickerStackView: UIStackView {
self.circleSelectionInset = circleSelectionInset
self.circleContentInsets = circleContentInsets
self.trailingSpacerViewProvider = trailingSpacerViewProvider
self.accessibilityLabelProvider = accessibilityLabelProvider
self.hexColorToggled = hexColorToggled
disposeBag = DisposeBag()
super.init(frame: .zero)
Expand Down Expand Up @@ -83,6 +86,7 @@ class ColorPickerStackView: UIStackView {
circleView.selectionInset = circleSelectionInset
circleView.contentInsets = circleContentInsets
circleView.isAccessibilityElement = true
circleView.accessibilityLabel = accessibilityLabelProvider(hexColor, false)
circleView.tap
.observe(on: MainScheduler.instance)
.subscribe(onNext: { [weak self] _ in
Expand Down Expand Up @@ -142,17 +146,24 @@ class ColorPickerStackView: UIStackView {
for view in arrangedSubviews {
guard let colorRow = view as? UIStackView else { continue }
for view in colorRow.arrangedSubviews {
guard let pickerView = view as? ColorPickerCircleView else { continue }
guard let circleView = view as? ColorPickerCircleView else { continue }
let isSelected: Bool
if allowsMultipleSelection {
pickerView.isSelected = hexColors.contains(pickerView.hexColor)
isSelected = hexColors.contains(circleView.hexColor)
} else {
pickerView.isSelected = hexColors.first == pickerView.hexColor
isSelected = hexColors.first == circleView.hexColor
}
circleView.isSelected = isSelected
circleView.accessibilityLabel = accessibilityLabelProvider(circleView.hexColor, isSelected)
}
}
}

func setSelected(hexColor: String) {
setSelected(hexColors: [hexColor])
func setSelected(hexColor: String?) {
if let hexColor {
setSelected(hexColors: [hexColor])
} else {
setSelected(hexColors: [])
}
}
}

0 comments on commit 939dd7f

Please sign in to comment.