Click Event on Point Series Xamarin Android

[Abhinav]

Hi,

I am using TeeChart for creating a basic chart with points and line series.
Everything is working fine except the fact that i am not able to fire the click event on the points.

My requirement is that i must get the click event on the points.
This is quite urgent for me as i need to deliver the project. Any help would be greatly appreciated. Thanks in advance !!!

The code i have implemented is below :

using System;
using Android.App;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
using System.Drawing;
using Steema.TeeChart.Tools;
using Steema.TeeChart;
using Steema.TeeChart.Styles;

namespace TeeChartTest
{
[Activity (Label = "TeeChartTest", MainLauncher = true)]
public class MainActivity : Activity
{
Steema.TeeChart.TChart tChart1;
Steema.TeeChart.Styles.Points point1;
Steema.TeeChart.Styles.Line line1;

protected override void OnCreate (Bundle bundle)
{
base.OnCreate (bundle);

// Set our view from the "main" layout resource
SetContentView (Resource.Layout.Main);

// Get our button from the layout resource,
// and attach an event to it
Button button = FindViewById<Button> (Resource.Id.myButton);
LinearLayout llTeeChart = FindViewById<LinearLayout> (Resource.Id.llTeeChart);

tChart1 = new Steema.TeeChart.TChart(this);
tChart1.Aspect.View3D = false;
tChart1.Header.Visible = false;
tChart1.SubHeader.Visible = false;
tChart1.Legend.Visible = false;
tChart1.Zoom.Style = ZoomStyles.Classic;
tChart1.Axes.Left.SetMinMax(0, 100);

tChart1.Panel.Gradient.Visible = true;
tChart1.Panel.Gradient.StartColor = Color.Gray;
tChart1.Panel.Gradient.MiddleColor = Color.DimGray;
tChart1.Panel.Gradient.EndColor = Color.LightGray;
tChart1.Panel.Gradient.Direction = Steema.TeeChart.Drawing.GradientDirection.DiagonalDown;

Steema.TeeChart.Themes.BlackIsBackTheme theme = new Steema.TeeChart.Themes.BlackIsBackTheme(tChart1.Chart);
theme.Apply();

point1 = new Steema.TeeChart.Styles.Points(tChart1.Chart);
line1 = new Steema.TeeChart.Styles.Line(tChart1.Chart);

line1.Add (10, "5 Jan", Color.AliceBlue);
line1.Add (40, "10 Jan", Color.AliceBlue);
line1.Add (20, "12 Jan", Color.AliceBlue);
line1.Add (40, "25 Jan", Color.AliceBlue);
line1.Add (90, "2 Jan", Color.AliceBlue);
line1.Add (60, "14 Jan", Color.AliceBlue);
line1.Add (70, "5 Jan", Color.AliceBlue);
line1.Add (10, "5 Jan", Color.AliceBlue);
line1.Add (90, "5 Jan", Color.AliceBlue);
line1.Add (55, "5 Jan", Color.AliceBlue);
line1.Add (25, "5 Jan", Color.AliceBlue);

point1.Add(10, Color.Blue);
point1.Add(40, Color.Blue);
point1.Add(20, Color.Blue);
point1.Add(40, Color.Blue);
point1.Add(90, Color.Blue);
point1.Add(60, Color.Blue);
point1.Add(70, Color.Blue);
point1.Add(10, Color.Blue);
point1.Add(90, Color.Blue);
point1.Add(55, Color.Blue);
point1.Add(25, Color.Blue);
point1.Pointer.HorizSize = 10;
point1.Pointer.VertSize = 10;

tChart1.AfterDraw += tChart1_AfterDraw;
tChart1.Axes.Left.Labels.Font.Size = 25;
tChart1.Axes.Bottom.Labels.Font.Size = 25;
// tChart1.ClickSeries += Chart_ClickPointer;

LinearLayout.LayoutParams _lp = new LinearLayout.LayoutParams (WindowManagerLayoutParams.FillParent, 800);
_lp.SetMargins (20, 20, 20, 20);
llTeeChart.AddView(tChart1, _lp);

point1.ClickPointer += Points_ClickPointer;
}

void Points_ClickPointer (CustomPoint series, int valueIndex, int x, int y)
{
new AlertDialog.Builder(this)
.SetTitle("Alert1")
.SetMessage("ValueIndex is: " + valueIndex.ToString())
.SetPositiveButton("OK", null as IDialogInterfaceOnClickListener)
.Show();
}

void Chart_ClickPointer (object sender, Series s, int valueIndex, MotionEvent e)
{
if(s.Equals(line1))
{
new AlertDialog.Builder(this)
.SetTitle("Alert1")
.SetMessage("ValueIndex is: " + valueIndex.ToString())
.SetPositiveButton("OK", null as IDialogInterfaceOnClickListener)
.Show();

new AlertDialog.Builder(this)
.SetTitle("Alert2")
.SetMessage("Point's YValue is " + line1.YValues[valueIndex].ToString())
.SetPositiveButton("OK", null as IDialogInterfaceOnClickListener)
.Show();
}
}

private void tChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g) {
for (int i = 0; i < line1.Count; i++) {
Size s = new Size (40, 40);
Point l = new Point (line1.CalcXPosValue (line1 .X) - 20, line1.CalcYPosValue (line1 .Y) - 20);
Rectangle r = new Rectangle (l, s);
g.Pen.Color = Color.Aquamarine;
g.Brush.Color = Color.Transparent;
g.Rectangle (r);
g.Font.Color = Color.White;
g.Font.Size = 30;
g.TextOut (line1.CalcXPosValue (line1 .X) - 10, line1.CalcYPosValue (line1 .Y) - 30, line1 .Y.ToString());
}
}
}
}

[Narcís]

Hi Abhinav,

Thanks for reporting. This looks like a bug to me and I have added it (ID819) to our bug tracking platform. Feel free to sign up and add yourself to the CC List to receive automatic updates about the issue.

In the meantime, as a workaround, you can use the Touch event like this:

Code: Select all

      tChart1.Touch += tChart1_Touch;

Code: Select all

    void tChart1_Touch(object sender, View.TouchEventArgs e)
    {
      for (int i = 0; i < tChart1.Series.Count; i++)
      {
        if (tChart1[i] is Steema.TeeChart.Styles.CustomPoint)
        {
          int x = Steema.TeeChart.Utils.Round(e.Event.GetX());
          int y = Steema.TeeChart.Utils.Round(e.Event.GetY());

          Steema.TeeChart.Styles.CustomPoint p = (Steema.TeeChart.Styles.CustomPoint)tChart1[i];
          int index = p.Clicked(x, y);

          if (index != -1)
          {
            this.Points_ClickPointer(p, index, x, y);
            break;
          }
        }
      }
    }

    void Points_ClickPointer(CustomPoint series, int valueIndex, int x, int y)
    {
      new AlertDialog.Builder(this)
      .SetTitle("Alert1")
      .SetMessage("ValueIndex is: " + valueIndex.ToString())
      .SetPositiveButton("OK", null as IDialogInterfaceOnClickListener)
      .Show();
    }

[Narcís]

Hi Abhinav,

I have fixed the bug (ID819). It's a shame that yesterday I posted a new maintenance release and it didn't make into it. If you are interested I can arrange test assemblies with the fix for you. Please send an email with your licensing details to info at steema dot com with a reference to this thread.

Thanks in advance.

[Narcís]

Hi Abhinav,

I have added new build 4.14.6.27 assemblies with the fix to the client download area for both the registered and evaluation versions.

[Abhinav]

Hi Narcis,

Thanks for the quick reply.

I was able to work solve my problem by a workaround.
I used the following code :

I was able to get the click events on the image view that i added. But thanks for the fix, will use the information for my future works.
One more thing i added a boolean value to stop the code in afterDraw from being executed as the method was being continuously throught as long as the screen was there.
Just wanted to make sure is it a desirable behavior for this method to be called continuously?

Once again thanks for the reply and the fix.

private void tChart1_AfterDraw(object sender, Graphics3D g) {
if(!afterDraw) {
for (int i = 0; i < line1.Count; i++) {
TextView tvWeScore = new TextView (this);
TextView tvLabel = new TextView (this);
FrameLayout.LayoutParams _layoutParams = new FrameLayout.LayoutParams(40, 40);
FrameLayout.LayoutParams _layoutParamsLabel = new FrameLayout.LayoutParams(80, 80);
tvWeScore.LayoutParameters = _layoutParams;
tvLabel.LayoutParameters = _layoutParamsLabel;
tvWeScore.SetBackgroundResource (Resource.Drawable.markerIcon);
tvWeScore.Alpha = 100;
tvWeScore.SetX (line1.CalcXPosValue (line1 .X) - 20);
tvWeScore.SetY (line1.CalcYPosValue (line1 .Y) - 20);

tvLabel.Text = "40";
tvLabel.TextSize = 12;
tvLabel.SetTextColor (Android.Graphics.Color.Black);
tvLabel.SetX (line1.CalcXPosValue (line1 .X) - 15);
tvLabel.SetY (line1.CalcYPosValue (line1 .Y) + 15);

RunOnUiThread (delegate {
tChart1.AddView (tvWeScore);
tChart1.AddView (tvLabel);
});
// g.Font.Color = Color.Black;
// g.Font.Size = 30;
// g.TextOut (line1.CalcXPosValue (line1 .X) - 10, line1.CalcYPosValue (line1 .Y) - 20, line1 .Y.ToString());

tvWeScore.Click += delegate {
Toast.MakeText(this, "Clicked " + line1 .Y, ToastLength.Long).Show();
};
}
}
afterDraw = true;
}

[Narcís]

Hi Abhinav,

No, that's not something we would expect. Could you please send a Short, Self Contained, Correct (Compilable), Example project to reproduce the problem here?

Thanks in advance.