Question

I’m using a ratingbar with a custom style that is acting as an indicator, however I want users to still be able to click the ratingbar to bring up a custom dialog with a ratingbar that can be changed.

Is there anyway to do this without using images?

To illustrate:

Answer 1

For those who are having the same issues down the road, I figured it out.

ratingBar = (RatingBar) findViewById(R.id.rbMyRating);
ratingBar.setIsIndicator(true);
ratingBar.setOnTouchListener(new OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_UP) {
            myRatingDialog.show();
            v.setPressed(false);
        }
        if (event.getAction() == MotionEvent.ACTION_DOWN) {
            v.setPressed(true);
        }
        if (event.getAction() == MotionEvent.ACTION_CANCEL) {
            v.setPressed(false);
        }
        return true;
    }
});

The key was that you can still use setPressed to true, even though isIndicator is true. This will allow only allow the RatingBar to highlight but not change.

You can manage the setPressed state using the OnTouchListener. ACTION_UP and ACTION_DOWN control touch events on the widget, ACTION_CANCEL handles any event outside of the widget.

---

The problem with the above code is it does not support key events. To do this the following additional code is needed:

Float rating = 4f;
ratingBar.setFocusable(true);
ratingBar.setTag(rating);
ratingBar.setOnKeyListener(new OnKeyListener() {
    @Override
    public boolean onKey(View v, int keyCode, KeyEvent event) {
        if (event.getAction() == KeyEvent.ACTION_DOWN) {
            if(keyCode == KeyEvent.KEYCODE_DPAD_CENTER || keyCode == KeyEvent.KEYCODE_ENTER) {
                v.setPressed(false);
                myRatingDialog.show();  
            } else if(keyCode == KeyEvent.KEYCODE_DPAD_LEFT) {
                if (v.focusSearch(View.FOCUS_LEFT) != null)  v.focusSearch(View.FOCUS_LEFT).requestFocus();
            } else if(keyCode == KeyEvent.KEYCODE_DPAD_RIGHT) {
                if (v.focusSearch(View.FOCUS_RIGHT) != null) v.focusSearch(View.FOCUS_RIGHT).requestFocus();
            }
        }
        return false;
    }
});
ratingBar.setOnRatingBarChangeListener(new OnRatingBarChangeListener() {
    @Override
    public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
        ratingBar.setRating((Float) ratingBar.getTag());
    }
});

The above code uses both the OnKeyListener and setOnRatingBarChangeListener. To enable key events you will need to set setFocusable(true). You will also need to manually wire up the key events for KEYCODE_ENTER and KEYCODE_DPAD_CENTER.

A problem with setFocusable = true is that you are now able to change the RatingBar rating using the KEYCODE_DPAD_LEFT and KEYCODE_DPAD_RIGHT. To solve this you use onRatingBarChangeListener to reset the RatingBar’s rating. You can store the rating in the RatingBar’s tag. REMEMBER, you will need to change the tag value when you change the rating through the dialog.

As a result of using onRatingBarChangeListener you will now be faced with one final issue. Since you are automatically changing the rating, the user will not be able to focus other UI elements with KEYCODE_DPAD_LEFT and KEYCODE_DPAD_RIGHT. To solve this you simply use the OnKeyListener to detect left and right DPad actions and change the focus using searchFocus and requestFocus. Just remember that searchFocus returns null if no UI element is found.

Hope this helps anyone else who runs into this problem. 🙂