Charts: How to create a custom Marker from Xib - Swift

[nathanmrtns]

So, I'm trying to create a custom marker from a xib file. I'm looking to the RadarMarkerView sample, it is basically the same thing. The problem is that the program compiles but the marker does not show up.

This is my custom marker class

open class DailyMarker: MarkerView {

    @IBOutlet weak var powerLabel: UILabel!
    @IBOutlet weak var hourLabel: UILabel!

    override open func awakeFromNib() {
        self.offset.x = -self.frame.size.width / 2.0
        self.offset.y = -self.frame.size.height - 7.0
    }
    open override func refreshContent(entry: ChartDataEntry, highlight: Highlight) {
        powerLabel?.text = String.init(format: "%.2f kWh", entry.y)
        hourLabel?.text = "Hora"
        layoutIfNeeded()
    }
}

I have created a xib with the same name "DailyMarker.xib" and in the Custom Class field I set to DailyMarker.

Here is the Chart code where I set the marker

let dailyMarker: DailyMarker = DailyMarker()
dailyMarker.chartView = lineChartView
lineChartView.marker = dailyMarker

I just want to create a rounded marker with borders. Could anyone help me ?

[nathanmrtns]

So, I Got it to work!

I think it was missing the .viewFromXib in the file that I was instantiating the graph. That's my updated code

        let dailyMarker: DailyMarker = (DailyMarker.viewFromXib() as? DailyMarker)!
        dailyMarker.chartView = lineChartView
        lineChartView.marker = dailyMarker

Remembering that on the xib file inspector you put the class of the view the same of the swift file. In this case it was DailyMarker. There is no need to set the Placeholder owner.

[JCMcLovin]

Nathan, how did you end up rounding the marker corners?

[nathanmrtns]

@JCMcLovin on the xib file choose the back view and on Inspector file add the attribute layer.cornerRadius.

This link might help.

[JCMcLovin]

Thanks, Nathan! I was thinking there was a property in the framework itself I should be looking for.

[JCMcLovin]

@NathanMrtns Hope you don't mind one more question. I'm not using a xib. Since the marker isn't a UIView it doesn't have a layer property so do I have to use an image in order to do this?

[nathanmrtns]

@JCMcLovin I don't know how you're initializing the marker. Can you post a code snippet?

[JCMcLovin]

Sure:

let marker:BalloonMarker = BalloonMarker(color: UIColor(white: 180/250, alpha: 1),
                                         font: UIFont(name: "Helvetica", size: 12)!,
                                         textColor: UIColor.white,
                                         insets: UIEdgeInsets(top: 7.0, left: 7.0, bottom: 7.0, right: 7.0))
                                         marker.minimumSize = CGSize(width: 80.0, height: 40.0)
chartView.marker = marker

[nathanmrtns]

@JCMcLovin Oh, I see, I believe you will have to override the draw method in BaloonMarker class to draw a rect with rounded corner. Check this solution

[JCMcLovin]

@NathanMrtns That I can do. Thanks!