Display two number pickers on textview

I made a created two number pickers to fake as timepicker for the simple purpose of been able to rotate 0 - 30 repeatedly, which works.

But now I want to display these two number pickers to a textview.

So if the numberpickers shows what's in the image below:

enter image description here

then the timeoutput should display this: enter image description here

Here's my code:

    public void timepicker() {

        mMinuteSpinner.setMinValue(0);
        mMinuteSpinner.setMaxValue(3);
        mMinuteSpinner.setDisplayedValues(new String[]{"00", "30", "00", "30"});
        mMinuteSpinner.setOnValueChangedListener(this);
        mHourSpinner.setMinValue(0);
        mHourSpinner.setMaxValue(23);
        String[] hours = new String[24];
        for (int i = 0; i < 24; i++) {
            hours[i] = String.format("%02d", i );
        }
        mHourSpinner.setDisplayedValues(hours);
    }

    @Override
    public void onValueChange(NumberPicker picker, int oldVal, int newVal) {

        boolean advanced = (newVal == 0 && oldVal == 3) || (newVal == 2 && oldVal == 1);
        boolean regressed = (newVal == 3 && oldVal == 0) || (newVal == 1 && oldVal == 2);

        if (advanced) {
            mHourSpinner.setValue(mHourSpinner.getValue() + 1);
        } else if (regressed) {
            mHourSpinner.setValue(mHourSpinner.getValue() - 1);
        }

I also tried variations of below:

        timeoutput.setText("" + mHourSpinner.getValue() + "h" + mMinuteSpinner.getValue());

But it didn't work. Getvalue seems to get the position of the number instead of the actual number.

The change to display textview also seems to only happen when the user rotates the numbers on the right(minutes), when the change should also occur if they rotate the numbers on the left(hours)

Solution

Root cause

When you select the mHourSpinner, nothing happens because you forgot to call setOnValueChangedListener on it.
getValue() just return the value of the Picker not displayed value, you must use getDisplayedValues() to do that.

Solution: Change your code to

public void timepicker() {
    mMinuteSpinner.setMinValue(0);
    mMinuteSpinner.setMaxValue(3);
    mMinuteSpinner.setDisplayedValues(new String[]{"00", "30", "00", "30"});
    mMinuteSpinner.setOnValueChangedListener(this);

    mHourSpinner.setMinValue(0);
    mHourSpinner.setMaxValue(23);
    String[] hours = new String[24];
    for (int i = 0; i < 24; i++) {
        hours[i] = String.format("%02d", i);
    }
    mHourSpinner.setDisplayedValues(hours);
    mHourSpinner.setOnValueChangedListener(this);

    displaySelectedHourAndMinute();
}

@Override
public void onValueChange(NumberPicker picker, int oldVal, int newVal) {
    displaySelectedHourAndMinute();
}

private void displaySelectedHourAndMinute() {
    String hour = mHourSpinner.getDisplayedValues()[mHourSpinner.getValue()];
    String minute = mMinuteSpinner.getDisplayedValues()[mMinuteSpinner.getValue()];
    timeoutput.setText(hour + "h" + minute);
}