UI libraries / InstantSearch iOS / Widgets

Filter Numeric Comparison

Signature
FilterComparisonConnector<Number: Comparable & DoubleRepresentable>(
    searcher: HitsSearcher, 
    filterState: FilterState,
    attribute: Attribute,
    numericOperator: Filter.Numeric.Operator,
    number: Number?,
    bounds: ClosedRange<Number>?,
    operator: RefinementOperator,
    groupName: String?
)

About this widget

Filter Numeric Comparison is a view to filter on a numeric value using a comparison operator.

Examples

Instantiate a FilterComparisonConnector and launch an initial search on its searcher.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
let searcher = HitsSearcher(appID: "YourApplicationID",
                            apiKey: "YourApiKey",
                            indexName: "YourIndexName")
let filterState = FilterState()

let stepperController = NumericStepperController()

let filterComparisonConnector = FilterComparisonConnector<Double>(searcher: searcher,
                                                                  filterState: filterState,
                                                                  numericOperator: .greaterThanOrEqual,
                                                                  attribute: "price",
                                                                  controller: stepperController)

searcher.search()                                                          

Low-level API

If you want to fully control the Filter Numeric Comparison components and connect them manually, use the following components:

  • Searcher: the Searcher that handles your searches.
  • FilterState: the current state of the filters.
  • NumberInteractor<T>: the logic applied to the numeric value.
  • NumberController: the view controller that renders the numeric value.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let searcher = HitsSearcher(appID: "YourApplicationID",
                            apiKey: "YourApiKey",
                            indexName: "YourIndexName")
let filterState = FilterState()
let numberInteractor = NumberInteractor<Double>()
let stepperController = NumericStepperController()

interactor.connectSearcher(searcher, attribute: "price")
interactor.connectFilterState(filterState, 
                              attribute: attribute,
                              numericOperator: numericOperator,
                              operator: .greaterThanOrEqual)
interactor.connectNumberController(stepperController)

searcher.search()             

SwiftUI

InstantSearch provides the NumberObservableController as a state model, which is an implementation of the NumberController interface. You need to connect NumberObservableController to the FilterComparisonConnector or NumberInteractor like any other NumberController implementation.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
struct ContentView: View {

  @ObservedObject var priceController: NumberObservableController<Double>

  var body: some View {
    HStack {
      Stepper(value: $priceController.value,
              in: priceController.bounds,
              step: 0.1) {
        HStack {
          Text("Price:")
          Spacer()
          Text(String(format: "%.2f", priceController.value))
        }
      }
    }
  }

}

If you prefer to create a custom SwiftUI view that presents the numeric range, you can directly use the NumberObservableController as a data model. It provides value and bounds properties to streamline the design process of your custom SwiftUI view.

Check out the example to see this widget in action.

Parameters

searcher
type: HitsSearcher
Required

The Searcher that handles your searches

filterState
type: FilterState
Required

The FilterState that holds filters.

attribute
type: Attribute
Required

The attribute to filter on.

numericOperator
type: Filter.Numeric.Operator
Required

The comparison operator to apply

number
type: Number: Comparable & DoubleRepresentable
default: nil
Optional

The initial numeric value to filter on.

bounds
type: ClosedRange<Number>?
default: nil
Optional

The optional bounds limiting the max and the min value of the number.

operator
type: RefinementOperator
default: .and
Required

Whether the filter is added to a conjuncitve(and) or a disjuncitve (or) group in the filter state.

groupName
type: String?
default: nil
Optional

Filter group name in the filter state. If not specified, the attribute value is used as the group name.

Controller

controller
type: NumberController
Required

Controller interfacing with a concrete number view.

1
2
let controller = MyNumberController() // your `NumberController` implementation
filterComparisonConnector.connectNumberController(controller)
Did you find this page helpful?