MPAndroidChart - Button click in MarkerView

问题

Currently I have a Button in a layout, however an assigned OnClickListener never calls back to the onClick method.

Is it possible to intercept the click of a Button in a layout assigned to a MarkerView?

回答1:

Using the library it appears not to be possible, however a solution of sorts is to show a View or ViewGroup over the chart which has a Button in it. You’ll need to set up an empty layout for the MarkerView and wrap your Chart in a ViewGroup such as a RelativeLayout.

Define a listener such as this in your CustomMarkerView:

public interface Listener {
    /**
     * A callback with the x,y position of the marker
     * @param x the x in pixels
     * @param y the y in pixels
     */
    void onMarkerViewLayout(int x, int y);
}

Set up some member variables:

private Listener mListener;
private int mLayoutX;
private int mLayoutY;
private int mMarkerVisibility;

In your constructor require a listener:

    /**
     * Constructor. Sets up the MarkerView with a custom layout resource.
     * @param context a context
     * @param layoutResource the layout resource to use for the MarkerView
     * @param listener listens for the bid now click
     */
    public SQUChartMarkerView(Context context, int layoutResource, Listener listener) {
        super(context, layoutResource);
        mListener = listener;
    }

Store the location the marker should be when the values are set:

@Override public int getXOffset(float xpos) {
    mLayoutX = (int) (xpos - (getWidth() / 2));
    return -getWidth() / 2;
}


@Override public int getYOffset(float ypos) {
    mLayoutY = (int) (ypos - getWidth());
    return -getHeight();
}

Then override onDraw to determine when you should draw your layout:

@Override protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    if(mMarkerVisibility == View.VISIBLE) mListener.onMarkerViewLayout(mLayoutX, mLayoutY);
}

I added an option to change the state of the marker:

public void setMarkerVisibility(int markerVisibility) {
    mMarkerVisibility = markerVisibility;
}

Where you listen for marker being laid out, get your layout (eg. inflate it or you may have it as a member variable), make sure you measure it, then set the margins. In this case I am using getParent() as the chart and the layout for the marker share the same parent. I have a BarChart so my margins may be different from yours.

@Override public void onMarkerViewLayout(int x, int y) {
    if(getParent() == null || mChartListener.getAmount() == null) return;
    // remove the marker
    ((ViewGroup) getParent()).removeView(mMarkerLayout);
    ((ViewGroup) getParent()).addView(mMarkerLayout);

    // measure the layout
    // if this is not done, the first calculation of the layout parameter margins
    // will be incorrect as the layout at this point has no height or width
    int widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(((ViewGroup) getParent()).getWidth(), View.MeasureSpec.UNSPECIFIED);
    int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(((ViewGroup) getParent()).getHeight(), View.MeasureSpec.UNSPECIFIED);
    mMarkerLayout.measure(widthMeasureSpec, heightMeasureSpec);

    // set up layout parameters so our marker is in the same position as the mpchart marker would be (based no the x and y)
    RelativeLayout.LayoutParams lps = (RelativeLayout.LayoutParams) mMarkerLayout.getLayoutParams();
    lps.height = FrameLayout.LayoutParams.WRAP_CONTENT;
    lps.width = FrameLayout.LayoutParams.WRAP_CONTENT;
    lps.leftMargin = x - mMarkerLayout.getMeasuredWidth() / 2;
    lps.topMargin = y - mMarkerLayout.getMeasuredHeight();
}

Hope this helps.

回答2:

I have finished my app with clickable marker view. My solution is that we'll create a subclass of LineChart (or other chart), then let override onTouchEvent and detect the touch location.

public class MyChart extends LineChart {

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        boolean handled = true;
        // if there is no marker view or drawing marker is disabled
        if (isShowingMarker() && this.getMarker() instanceof ChartInfoMarkerView){
            ChartInfoMarkerView markerView = (ChartInfoMarkerView) this.getMarker();
            Rect rect = new Rect((int)markerView.drawingPosX,(int)markerView.drawingPosY,(int)markerView.drawingPosX + markerView.getWidth(), (int)markerView.drawingPosY + markerView.getHeight());
            if (rect.contains((int) event.getX(),(int) event.getY())) {
                // touch on marker -> dispatch touch event in to marker
                markerView.dispatchTouchEvent(event);
            }else{
                handled = super.onTouchEvent(event);
            }
        }else{
            handled = super.onTouchEvent(event);
        }
        return handled;
    }

    private boolean isShowingMarker(){
        return mMarker != null && isDrawMarkersEnabled() && valuesToHighlight();
    }
}

public class ChartInfoMarkerView extends MarkerView {
    @BindView(R.id.markerContainerView)
    LinearLayout markerContainerView;

    protected float drawingPosX;
    protected float drawingPosY;
    private static final int MAX_CLICK_DURATION = 500;
    private long startClickTime;

    /**
     * The constructor
     *
     * @param context
     * @param layoutResource
     */
    public ChartInfoMarkerView(Context context, int layoutResource) {
        super(context, layoutResource);
        ButterKnife.bind(this);
        markerContainerView.setClickable(true);
        markerContainerView.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Log.d("MARKER","click");
            }
        });
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN: {
                startClickTime = Calendar.getInstance().getTimeInMillis();
                break;
            }
            case MotionEvent.ACTION_UP: {
                long clickDuration = Calendar.getInstance().getTimeInMillis() - startClickTime;
                if(clickDuration < MAX_CLICK_DURATION) {
                    markerContainerView.performClick();
                }
            }
        }
        return super.onTouchEvent(event);
    }

    @Override
    public void draw(Canvas canvas, float posX, float posY) {
        super.draw(canvas, posX, posY);
        MPPointF offset = getOffsetForDrawingAtPoint(posX, posY);
        this.drawingPosX = posX + offset.x;
        this.drawingPosY = posY + offset.y;
    }
}

来源：https://stackoverflow.com/questions/37959156/mpandroidchart-button-click-in-markerview