XamaWIN – ListView Highlighting in Android

Xamawin • zam-ah win | noun
A quick, easy to implement enhancement for a Xamarin App that improves performance, appearance, or functionality


This is  my go-to styles.xml for almost every Xamarin App I make. While the system default highlighting can be desirable, I find most apps look better with a custom/branded highlight or (more often) no highlight at all. Assuming the latter, I usually address the issue like so:

<?xml version="1.0" encoding="utf-8" ?>
<resources>

  <!-- Colors -->
  <color name="CustomHighlight">@android:color/transparent</color>
  <color name="DarkOverride">@android:color/black</color>
  <color name="Brand">#BE1003</color>
<style name="MainTheme" parent="MainTheme.Base">
  </style>

  <!-- Base theme applied no matter what API -->
<style name="MainTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="colorPrimary">@color/Brand</item>
    <item name="colorPrimaryDark">@color/DarkOverride</item>
    <item name="colorAccent">@color/Brand</item>
    <item name="windowActionModeOverlay">true</item>
    <item name="android:datePickerDialogTheme">@style/AppCompatDialogStyle</item>

	<!-- Override -->
    <item name="android:colorPressedHighlight">@color/CustomHighlight</item>
    <item name="android:colorLongPressedHighlight">@color/CustomHighlight</item>
    <item name="android:colorFocusedHighlight">@color/CustomHighlight</item>
    <item name="android:colorActivatedHighlight">@color/CustomHighlight</item>
    <item name="android:activatedBackgroundIndicator">@color/CustomHighlight</item>

    <!--<item name="android:textColorHint">#C14242</item>-->
  </style>
<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">@color/Brand</item>
  </style>

</resources>

Also, since we are removing the highlight, it may make sense to clear out the selected value from the list so that the user may re-select the same entry in the row if needed. There are a few ways to achieve this, but assuming that clicking an entry causes a page navigation, you may use something like the following block to clear out their selection when they return to the view:

        protected override void OnAppearing()
        {
            base.OnAppearing();

            MyListView.SelectedItem = null;
        }

I’m missing an easy way to do this in iOS without a custom renderer. If you’ve got a snippet handy, let me know in the comments!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s