Need help with Sonar?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

126 Stars 20 Forks MIT License 110 Commits 0 Opened issues


Radar style view written in swift

Services available


Need anything else?

Contributors list

Sonar logo


Version License Platform

Simple radar style view, written in Swift, pure CoreAnimation (no images). Highly adjustable.


Just place the UIView somewhere in your controller and make it SonarView class.

SonarView copies the data source and delegate patter from UITableView.

/// Data source
public weak var dataSource: SonarViewDataSource?

/// SonarViewDelegate and SonarViewLayout public weak var delegate: SonarViewDelegate?

There are three required methods.

public protocol SonarViewDataSource: class {
    func numberOfWaves(sonarView: SonarView) -> Int
    func sonarView(sonarView: SonarView, numberOfItemForWaveIndex waveIndex: Int) -> Int
    func sonarView(sonarView: SonarView, itemViewForWave waveIndex: Int, atIndex: Int) -> SonarItemView

is just a UIView subclass. In order to use your custom view in radar, make your view SonarItemView subclass. The size of view is determined via layout. The layout is defined by SonarViewLayout protocol. Sonar comes with one predefined layout - SonarViewCenteredLayout. The items in a wave are placed from edges to the center, for example if we have 4 items in wave, first is placed at the left side, second at the right side, third at the left again but a right from the first one and so on. I know, the image would be better:

If you need different behaviour, you can of course create your own layout by adopting the SonarViewLayout and pass it to the SonarView. See SonarViewLayout for more information.

The last protocol is Delegate which handles selections and titles on each wave

public protocol SonarViewDelegate: class {
    func sonarView(sonarView: SonarView, didSelectObjectInWave waveIndex: Int, atIndex: Int)
    func sonarView(sonarView: SonarView, textForWaveAtIndex waveIndex: Int) -> String?


returns nil, the label will be hidden. For more information see the Example project.


There are 3 colours that can be adjusted.

class public var lineColor: UIColor
class public var lineShadowColor: UIColor
class public var distanceTextColor: UIColor


If you need to expose another properties or you have ideas how to improve it, file issue or send pull request, I'll be happy to discuss it.


iOS 8+,

Version 2.x - Swift 2.2+

Version 3.x - Swift 3.0+

Version 4.x - Swift 4.2+

Version 5.x - Swift 5.0+


Sonar is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "Sonar"


Aleš Kocur, [email protected]


Sonar is available under the MIT license. See the LICENSE file for more info.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.