Vista personalizada de la línea de límite en MPAndroidChart
¿Es posible reemplazarLimitLine
con diseño personalizado? Entonces se parece a esto:
Veo pocas soluciones para eso:
Tal vez hay métodos dentro de la biblioteca para personalizaciones como esta, ¿hay alguno?Obtener coordenadas deTextView
donde se almacena el valor y agregue un diseño personalizado en ese lugar. ¿Pero cómo puedo llegar a esto?TextView
?Quizás alguien enfrentó ese problema. Por favor comparte tu experiencia.
EDITAR: última solución parcial
Después de una larga búsqueda de solución, llegué a agregar una vista personalizada mediante programación mediante coordenadas de la línea de límite.
Diseño general de la pantalla de la siguiente manera:
Las coordenadas se calculan de manera bastante sencilla.X
se conoce a partir de coordenadas de la carta yY
:
Y = ((max - lastValue) * height) / ((max + min) + y)
Entonces, en este punto, básicamente sé la posición que necesito. Aunque no estoy seguro de que sea correcto debido a los padresScrollView
.
El siguiente paso es agregar un diseño personalizado en esas coordenadas(x, y)
Y aquí viene lo nuevoproblema. Traté de agregar vista al principioRelativeLayout
. Se agrega pero no se mueve junto conScrollView
. Por lo tanto, es necesario agregar esa vista exactamente en el Gráfico. Mira cómo intenté lograr esto:
private void addCustomLayoutOnLimitLine(final double lastValue) {
mChart.post(new Runnable() { //check location when view is created
public void run() {
int[] chartLocationOnScreen = new int[2];
mChart.getLocationOnScreen(chartLocationOnScreen);
int x = chartLocationOnScreen[0];
int y = chartLocationOnScreen[1];
int width = mChart.getWidth();
int height = mChart.getHeight();
double max = mChart.getYMax();
double min = mChart.getYMin();
int limitXPoint = x + width;
int limitYPoint = (int) ((((max - lastValue) * height) / (max + min))+ y);
LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
RelativeLayout rlValue = (RelativeLayout) inflater.inflate(R.layout.item_chart_value, null);
TextView tvValue = (TextView) rlValue.findViewById(R.id.tv_value);
tvValue.setText(String.valueOf(lastValue));
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(50, 50);
params.leftMargin = limitXPoint - 100;
params.topMargin = limitYPoint;
mChart.addView(rlValue, params); //this doesn't seem to be working
rlValue.bringToFront();
}
});
}
Tal vez debería llegar al diseño principal de Chart e inflar mi diseño personalizado allí. Perocómo?
EDIT 2: se agregó una vista personalizada sobre el gráfico pero no se puede encontrar la ubicación adecuada debido a la vista de desplazamiento
Ahora la situación se ve así:
Quizás estoy equivocado en los cálculos. Pero al menos esa Vista cambia su posición con el nuevo valor, aunque nunca alcanza las coordinaciones correctas.
private void addCustomLayoutOnLimitLine() {
if (mChart == null){
return;
}
mChart.post(new Runnable() { //check location when view is created
public void run() {
int[] chartLocationOnScreen = new int[2];
mChart.getLocationOnScreen(chartLocationOnScreen);
int xChart = chartLocationOnScreen[0];
int yChart = chartLocationOnScreen[1];
int chartWidth = mChart.getWidth();
int chartHeight = mChart.getHeight();
int rootWidth = rlSvContent.getWidth();
int rootHeight = rlSvContent.getHeight(); //this is height of ScrollView
int infoWidth = llInfoWrapper.getWidth(); //width of info panel ABOVE chart
int infoHeight = llInfoWrapper.getHeight();
double lastValue = mSingleAsset.getGraph().get(mSingleAsset.getGraph().size() - 1).getValue();
double maxValue = mChart.getYMax();
double minValue = mChart.getYMin();
int limitXPoint = (rootWidth - chartWidth) / 2 + chartWidth;
int limitYPoint = (int) ((maxValue - lastValue) * chartHeight/(maxValue - minValue)) + yChart;
tvCustomValue.setText(SingleAsset.round((float) lastValue, 2).toString()); //display last value on custom view
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
params.leftMargin = limitXPoint - xChart - 50; //move custom view. xChart = right margin value and 50 is taken to count values bar to the right of chart
params.topMargin = limitYPoint;
rlCustomValue.setLayoutParams(params);
rlCustomValue.bringToFront();
rlCustomValue.invalidate();
}
});
}