Using a hidden TextView to get a pop-up message to appear
This solution involves adding an additional hidden textbox just below the spinner just at the right position to allow the TextView's error dialog to show, whilst also using the TextView set on the spinner's layout XML to allow the red (!) icon to be displayed. So in effect, two textviews are used -- one for the icon, and another (hidden) one to allow the error dialog.
This is what it looks like when not in an error state (use SetError(null)
):
![Spinner in valid state](https://cdn.statically.io/img/i.sstatic.net/Z58FV.png)
This is what it looks like when there is an error (use SetError("my error text, ideally from a resource!")
):
![Spinner in invalid state](https://cdn.statically.io/img/i.sstatic.net/URqqy.png)
Here is the excerpt of the spinner's layout XML. There is a RelativeLayout used to ensure that the TextView is as close as possible to the spinner, and has just enough paddingRight to ensure that the arrow on the message dialog is aligned just under the red error (!) icon. The hidden (fake) TextView is positioned relative to the Spinner.
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="top|left"
>
<Spinner
android:id="@+id/spnMySpinner"
android:layout_width="400dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:dropDownSelector="@drawable/selector_listview"
android:background="@android:drawable/btn_dropdown"
android:paddingBottom="0dp"
android:layout_marginBottom="0dp"
/>
<!-- Fake TextView to use to set in an error state to allow an error to be shown for the TextView -->
<android.widget.TextView
android:id="@+id/tvInvisibleError"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_alignRight="@+id/spnMySpinner"
android:layout_alignBottom="@+id/spnMySpinner"
android:layout_marginTop="0dp"
android:paddingTop="0dp"
android:paddingRight="50dp"
android:focusable="true"
android:focusableInTouchMode="true"
/>
</RelativeLayout>
Note: @drawable/selector_listview
defined outside the scope of this solution. See example here of how to get this to work, as it's off topic for this answer.
Here is the code to make it work. Just call the SetError(errMsg)
either with null
to clear the error, or with text to set it in an error state.
/**
* When a <code>errorMessage</code> is specified, pops up an error window with the message
* text, and creates an error icon in the secondary unit spinner. Error cleared through passing
* in a null string.
* @param errorMessage Error message to display, or null to clear.
*/
public void SetError(String errorMessage)
{
View view = spnMySpinner.getSelectedView();
// Set TextView in Secondary Unit spinner to be in error so that red (!) icon
// appears, and then shake control if in error
TextView tvListItem = (TextView)view;
// Set fake TextView to be in error so that the error message appears
TextView tvInvisibleError = (TextView)findViewById(R.id.tvInvisibleError);
// Shake and set error if in error state, otherwise clear error
if(errorMessage != null)
{
tvListItem.setError(errorMessage);
tvListItem.requestFocus();
// Shake the spinner to highlight that current selection
// is invalid -- SEE COMMENT BELOW
Animation shake = AnimationUtils.loadAnimation(this, R.anim.shake);
spnMySpinner.startAnimation(shake);
tvInvisibleError.requestFocus();
tvInvisibleError.setError(errorMessage);
}
else
{
tvListItem.setError(null);
tvInvisibleError.setError(null);
}
}
In the SetError
function above, example there is some additional code that causes the text in the Spinner to shake when the error is set. This is not required to make the solution work, but is a nice addition. See here for the inspiration for this approach.
Kudos to @Gábor for his solution which makes use of the TextView on the Spinner's item layout XML. The code View view = spnMySpinner.getSelectedView();
(based on @Gábor's solution) is necessary, because it gets the currently displayed TextView, rather than using a findViewById
, which would just get the first TextView in the list (based on the Resource ID provided), and hence would not work (to display the red (!) icon) if very first item in the list is not selected.