How to use Custom Selector Styles on a TextView

Question

I'm trying to figure out how to add an outer glow to a TextView when it's touched. The approach I'm working with is to use a Selector, but it doesn't seem to be working.

I've got the following structure

layout\HomeView.axml

<TextView
    android:id="@+id/textview1"
    android:clickable="true"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    style="@drawable/control_selector_state" />

drawable\control_selector_state.xml

<!-- yes these are all the same for testing purposes -->

<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_focused="true"
        style="@style/control_style_focused"/>

  <item android:state_focused="true"
        android:state_pressed="true"
        style="@style/control_style_focused" />

  <item android:state_pressed="true"
        style="@style/control_style_focused" />

  <item style="@style/control_style_focused" />

</selector>

values\styles.xml

<resources>
  <style name="control_style_focused">
    <item name="android:shadowColor">#0000ff</item>
    <item name="android:textColor">#ff0000</item>
    <item name="android:shadowDx">0.0</item>
    <item name="android:shadowRadius">8</item>
  </style>
</resources>

The problem I'm having is that my TextView text is white, and the style doesn't seem to be applying.

How do I get this style to apply to my TextView?

Set the shadowDx to 0.5 and see what happens. 0.0 puts it totally under the widget. — Rick Falck, Dec 18 '13 at 02:30
the shadow at 0.0 is to emulate a glow rather than a shadow. — Chase Florell, Dec 19 '13 at 17:21
Does this answer your question? [Create a selector of styles](https://stackoverflow.com/questions/3659792/create-a-selector-of-styles) — smac89, Jun 10 '20 at 23:26

Chase Florell · Accepted Answer · 2013-12-19T23:21:24.747

so as @Longwayto said, selector styles are only available for drawables. That doesn't mean it's impossible.

Here's a working approach.

First you create a custom TextView that extends TextView

public class MyTextView: TextView
{
    private readonly Context _context;

    public FontIconTextView(Context context, IAttributeSet attrs) : base(context)
    {
        _context = context;
        Initialize(attrs);
    }

    private void Initialize(IAttributeSet attrs)
    {
        var a = _context.Theme.ObtainStyledAttributes(attrs, Resource.Styleable.MyTextView, 0, 0);
        _touchGlowColor = a.GetString(Resource.Styleable.MyTextView_TouchGlowColor);
        _touchGlowSize = a.GetInteger(Resource.Styleable.MyTextView_TouchGlowSize, 0);
        Initialize();
    }

    private void Initialize()
    {
        // other initialize stuff happens here...

    }

    private int _touchGlowSize;
    private string _touchGlowColor;
    public override bool OnTouchEvent(MotionEvent motionEvent)
    {
        if (Enabled)
        {
            var color = string.IsNullOrEmpty(_touchGlowColor) ? new Color(255, 255, 255, 255) : Color.ParseColor(_touchGlowColor);

            switch (motionEvent.Action)
            {
                case MotionEventActions.Down:
                    SetShadowLayer(_touchGlowSize, 0, 0, color);
                    break;
                case MotionEventActions.Up:
                case MotionEventActions.Cancel:
                    SetShadowLayer(0, 0, 0, new Color(255, 255, 255, 255));
                    break;

            }
        }
        return base.OnTouchEvent(motionEvent);
    }
}

then, you have to go into your values directory and specify your custom attributes.

Resources\values\CustomBindingAttributes.xml

<?xml version="1.0" encoding="utf-8" ?>
<resources>
  <declare-styleable name="MyTextView">
    <attr name="TouchGlowColor" format="string" />
    <attr name="TouchGlowSize" format="integer" />
  </declare-styleable>
</resources>

All of the above will be reusable across your entire application... no more duplicating shit on every view.

Lastly, here's how your button will look.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- obviously the foo/bar is just to show that you add android attrs like normal -->
    <some.name.space.MyTextView
        android:foo="foo"
        amdroid:bar="bar"
        local:TouchGlowColor="#66e400"
        local:TouchGlowSize="20" />

</LinearLayout>

one gotcha I ran into is setting TouchGlowSize to 30 caused the app to crash. not sure why atm

How to use Custom Selector Styles on a TextView

1 Answers1