Search code examples
androidplot

X and Y axis labels are not shown using android widget


I want to use androidplot to show a plot inside an android widget. Actually, the main content of the widget is supposed to show the plot. My problem is that I don't see the x- and y- tic-labels at all. (I can set and see the overall range label like "temperature in °C", though).

Here are the relevant code parts (actually in Kotlin and not in Java):

val plot = XYPlot(context, "Historyplot")

plot.setRangeLabel("Temp. in Grad")
plot.setDomainLabel("Zeit")

plot.title.labelPaint.textSize = 20f
plot.rangeTitle.labelPaint.textSize = 20f
plot.domainTitle.labelPaint.textSize = 20f

plot.legend.isVisible = false

plot.setBackgroundColor(Color.TRANSPARENT)

val h = appWidgetManager.getAppWidgetOptions(appWidgetId).getInt(AppWidgetManager.OPTION_APPWIDGET_MAX_HEIGHT)
val w = appWidgetManager.getAppWidgetOptions(appWidgetId).getInt(AppWidgetManager.OPTION_APPWIDGET_MAX_WIDTH)
plot.setPlotMargins(10f, 10f, 10f, 10f)

plot.layout(0, 0, w, h)

val history = mutableListOf<Double>()

for (dataPoint in sensorHist) {    
    history.add(dataPoint.value ?: Double.NaN)
}

val series = SimpleXYSeries(history, SimpleXYSeries.ArrayFormat.Y_VALS_ONLY, "")
val seriesFormat = LineAndPointFormatter(Color.BLACK, Color.BLACK, Color.LTGRAY, null)
plot.addSeries(series, seriesFormat)

val bitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888)

plot.draw(Canvas(bitmap))
views.setImageViewBitmap(R.id.plot_widget_img, bitmap)
appWidgetManager.updateAppWidget(appWidgetId, views)

And this is what it currently looks like (including two other widget elements in the top left and top right of the widget): widget screenshot

I've tried many different things to make the tic-labels visible but none of them worked (setRangeOriginLinePaint(Color.BLACK), series.useImplicitXVals(), setLineLabelEdges(), setRangeStep(), setDomainStep(), setLinesPerRangeLabel(), ...)

Could it be that x- any y-tics do not work in an android widget? Or am I missing something?

Update

Thanks, @Nick, I've added the line

plot.graph().setLineLabelEdges(XYGraphWidget.Edge.LEFT, XYGraphWidget.Edge.BOTTOM)

and this is how it looks like (I've added red arrows as a visual guide):

some labels visible

A step in the right direction! How can I now manipulate the font style and, more importantly, that the whole labels are visible? I've tried plot.layoutManager.addToTop() but could only find the title of x and y and not the labels itself.


Solution

  • I was able to get the labels to display in the DemoApp's (very outdated) widget example by adding this:

    plot.getGraph().setLineLabelEdges(XYGraphWidget.Edge.LEFT, XYGraphWidget.Edge.BOTTOM);
    

    It's not pretty but it's a start:

    enter image description here

    I see you already tried this but so far as I can tell, that's all you are missing.

    Response to your Update

    You can adjust positioning and color of your labels like this:

    plot.getGraph().setLineLabelEdges(XYGraphWidget.Edge.LEFT, XYGraphWidget.Edge.BOTTOM);
    plot.getGraph().getLineLabelInsets().setLeft(PixelUtils.dpToPix(16));
    plot.getGraph().getLineLabelInsets().setBottom(PixelUtils.dpToPix(4));
    plot.getGraph().getLineLabelStyle(XYGraphWidget.Edge.LEFT).getPaint().setColor(Color.RED);
    

    produces:

    enter image description here

    After that its a matter of adjusting plot / graph margins etc.