Hi Patrick,

Although there is no official feature for this in the Xamarin.Forms API, you could override the label drawing method to use custom native platform development techniques. At this point, you can draw your own custom label any way you see fit.

Although custom app development falls outside the scope of Telerik Support, I can make an exception to help you get started. You'll find a demo attached that give you the exact result on iOS, but on Android you'll need to finish up the rotation.

First, let me walk you through the important concepts, then explain the demo.


Custom Renderer

The first thing to understand is how to access the native chart in a Xamarin.Forms application. One way to do this is to create custom renderer classes in each platform project. This tells the Xamarin.Forms code to use your custom drawing code instead of the default style. This documentation article shows how to register a custom renderer for the Chart - Register Chart Renderers.

That being said, Instead of custom renderers, I personally prefer using Xamarin.Forms Effects instead because the code is cleaner and you have more control over where to apply the customization. Let me share that approach and a demo that show your how to accomplish customization via Effect.


Xamarin.Forms Platform and Routed Effect

 If you're not familiar with using Platform Effects, read the following Xamarin.Forms Effects Microsoft Documentation tutorials first.

- Effects
- Creating an Effect (especially this one)

Demo

I have a demo on GitHub that shows how to use an Effect to set custom labels here: CustomXamarinDemos - Custom Series Labels. That demo doesn't use a bar series however, but it will give you a huge head start by showing you how to set up the Effect classes and access the label rendering methods.

For your convenience, here is the iOS Effect class and here is the Android Effect class that shows the custom label rendering code for each platform.


Native Label Rendering

Now that you have access to the native platform chart control (via Effect or Custom Renderer), you can begin to override the native label rendering methods. These articles explain how to override the label rendering on the native platforms:

- Xamarin.Android: RadChartView - Custom Labels
- Xamarin.iOS: TKChart Point Labels Customization


If you've already looked at the classes from my custom demo on GitHub, you'll see the approaches mentioned in those two articles implemented inside the Effects classes. This is where you can apply your custom visualization for  BarSeries instead of a SplineSeries.


Bar Series - Headstart Demo

To help you get started and to help understand the structure, I've prepared a custom demo for you (find it attached). Below are my explanations for both platforms.

Xamarin.Android

In the attached demo, I show you how to get the label at precisely the middle of the bar, with 10% padding on the left and right. I've broken out the logic into many variables so that it is easier to follow what is happening and how the calculations are performed.

Here's a screenshot.





The remaining thing is to rotate the canvas at the right position (this is the hard part). It can be done using canvas.Rotate(), but you'll need to calculate the center position, rotate, draw the text, then unrotate. This is not a trivial task and will take some experimentation (I recommend using breakpoints in the label method to see the canvas values).

If you're not familiar with using Xamarin.Android Canvas, there are a lot of StackOverflow posts on the topic (e.g. "how to rotate text in Xamarin Android canvas). There's this particularly good one where a developer rotates text in a pie chart to match the slice angle. this is where you can get hints on using center of rotation (you can convert Java to C# by usually just changing capitalization).


Xamarin.iOS

In iOS it's a lot easier because you don't need to rely solely on custom platform code as we have a properties on the label style object. For this, I was able to get exactly what you're looking for.

To change text orientation, set TextOrientation


To move the label position, set the LabelOffset:


Here's a screenshot at runtime:




Final Note

Until we've implemented this feature officially, it will take some experimentation to get your desired outcome due to the custom nature of the approach.  If this is an absolute must-have, we do have partners that will build it for you. Go to Professional Services - Feature Customization to contact them.

I hope my demo gives you a good head start towards your goal.

Regards,
Lance | Technical Support Engineer, Principal
Progress Telerik