title: Android - Custom View - Extending EditText with Views on Top
body: <p>I'm trying to figure out a good solution on how to extend EditText to allow me to have other Views layered on top. I am trying to make a custom View that is an EditText that has a TextView on top to display the number of characters, and an ImageView on top for a clear button.</p>
  
  <p>Currently, I have it working with extending FrameLayout, but that doesn't give me the control/flexibility that I am looking for. Such as I can't use ButterKnife's @OnTextChanged as it expects a TextView, and I don't have direct access to any XML attributes of the EditText unless I pass them through.</p>
  
  <p>Thanks for your time.</p>
  
  <p>ClearableEditText.java</p>
  
  <pre><code>public class ClearableEditText extends FrameLayout {
  
      public ClearableEditText(Context context, AttributeSet attrs) {
          super(context, attrs);
          init();
      }
  
      protected void init() {
          View inflate = inflate(getContext(), R.layout.clearable_edit_text, this);
          ButterKnife.bind(this, inflate);
          ...
      }
  
      ...
  }
  </code></pre>
  
  <p>R.layout.clearable_edit_text.xml</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical"&gt;
  
      &lt;EditText
          android:id="@+id/clearable_edit"
          style="@style/edit_text"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:ems="10" /&gt;
  
      &lt;ImageView
          android:id="@+id/clearable_clear"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="right"
          android:layout_marginRight="10dp"
          android:layout_marginTop="5dp"
          android:src="@drawable/button_clear"
          android:visibility="invisible"
          tools:visibility="visible" /&gt;
  
  
      &lt;TextView
          android:id="@+id/clearable_count"
          style="@style/edit_text_number"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_gravity="bottom|right"
          tools:text="1200" /&gt;
  &lt;/FrameLayout&gt;
  </code></pre>