Background color of SupportChartFragment when no data in chart

#1

I’m trying to change the background color of the chart fragment. My app’s theme is dark and the chart fragment is white so I wanted to change its color.

I tried the following:

getStyle().setBackgroundColor()

also I tried in onViewCreated to set the background color of the view or of its only child, still no luck.

Any ideas on how to change the background color?

#2

Hello Radu,

Thanks for getting in touch.

There are a number of styling options within ShinobiCharts for Android, but as you mention the chart fragment I am going to make an assumption that you mean the entire chart (i.e. the area which can accommodate the title, legend, axes and so on) AND the plot area. 

To achieve this, working from the outside in…

First set the plot area to your desired color:

http://www.shinobicontrols.com/docs/ShinobiControls/ShinobiChartsAndroid/1.5.0/Premium/Normal/apidocs/docs/reference/com/shinobicontrols/charts/ChartStyle.html#setPlotAreaBackgroundColor(int)

Then set the chart background color:

http://www.shinobicontrols.com/docs/ShinobiControls/ShinobiChartsAndroid/1.5.0/Premium/Normal/apidocs/docs/reference/com/shinobicontrols/charts/ChartStyle.html#setBackgroundColor(int)

I was then left with a white border round my entire chart which I corrected by adding the following line to my layout:

android:background="#FF000000" 

Or you could just set the theme of the chart which changes everything:

http://www.shinobicontrols.com/docs/ShinobiControls/ShinobiChartsAndroid/1.5.0/Premium/Normal/apidocs/docs/reference/com/shinobicontrols/charts/ShinobiChart.html#applyTheme(int, boolean)

There is actually a guide in the user guide provided within the downloads:

http://www.shinobicontrols.com/docs/ShinobiControls/ShinobiChartsAndroid/1.5.0/Premium/Normal/user-guide/how-to-set-theme.html

I hope you find this information useful, if you need any further help please ask.

Thanks,

Kai.

#3

Hello Radu,

Just to follow on from our email conversation, for the benefit of any others who may be looking for answers to a similar issue:

Firstly, in my post above, I have noticed that I made an error when I said ‘working from the outside in…’ - it should have read ‘working from the inside out’ - apologies for any confusion there.

So just to recap - we have several View layers which make up the ShinobiChart Object:

The plot area - this is where the series are plotted.

The canvas - this contains the plot area plus any axes.

The chart - this contains any title, legend and the canvas (and it’s contained plot area).

As I touched upon earlier, the plot area will size itself to take up all available space in its container - so if you have for example no data points within your series then the axes can’t display any tick marks or labels and will only show their lines. The plot area therefore will be the full size of the canvas minus the thickness of the axes’ lines.

Similarly, the canvas will size itself to take up all of the available space in its container - so if you have no chart title or legend, it will be the full size of the chart object.

Bearing this in mind then, you could set your background colors in the following way:

Call the following methods on your ShinobiChart’s style object (obtained by calling getStyle on the ShinobiChart):

setBackgroundColor(<your chosen color>)

setCanvasBackgroundColor(<your chosen color>)

setPlotAreaBackgroundColor(<your chosen color>)

As with all Style objects you must call the redrawChart method for these changes to take effect.

Quite often users set a background color and then set the canvas and plot area background colors to be transparent. Please note that on devices running versions of Android that are pre-api v14 (Ice Cream Sandwich) due to a limitation in the Android framework it is not possible to set the plot area to be transparent. 

I hope that you find this information useful,  if you have any more queries please get back in touch.

Thanks,

Kai.