【Android】EditTextのあれこれ

# はじめに
こんにちは！
レイアウトに作成しているときにEditTextについて考えさせられたので、
EditTextのあれこれということでまとめます！
EditTextだけでこれだけカスタムできるんだーと驚きました。笑

# まとめ

[EditTextの色変更箇所まとめ](https://qiita.com/konifar/items/47d467e3574c9228fdc8)　のように表にすると見やすいなーと思ったので、同じように表でまとめようと思います！
| 変更箇所 | 属性 | 説明 |
|:-----------:|:------------|:------------|
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/b0f22f1b-764f-35c2-7113-4589f26acf36.png" width="200px"> | <code>android:textColorHighlight</code> | テキストを選択色のこと。<br>フォーマットはカラーコード|
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/eab93373-2e3b-4b3d-ddc6-8ee5702a1077.png" width="200px"> | <code>colorControlActivated</code>| handleの色を変更する。<br>フォーマットはカラーコード |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/c10705d2-9d01-68d1-66db-45f8a2cf1f63.png" width="200px"> | <code>android:textColor</code> | 入力した文字列の色を変更する。<br>フォーマットはカラーコード |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/4c5aea1b-b866-cfd9-acac-661877e8e9d1.png" width="200px"> | <code>android:textColorHint</code> | 入力前のヒントの文字列の色を変更する。<br>フォーマットはカラーコード |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/4d4700a2-bbcc-13a3-6624-53bb8358fd85.png" width="200px">| <code>android:textCursorDrawable</code> | カーソルの色を変更します。<br>drawableまたはカラーコードをセットすることができましたが、動きが異なりました。 |
| <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/c10705d2-9d01-68d1-66db-45f8a2cf1f63.png" width="200px"> | <code>android:background</code> | 入力エリアを自身のレイアウトを決める<br>drawableまたはカラーコードをセットすることができる。drawableにするとカスタマイズが広い |

## コードの確認 
```xml: activity_main.xml
<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/edit_txt"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:paddingStart="10dp"
        android:background="@drawable/edit_text_background"
        android:hint="10文字以内で入力してね！！（Hint）"
        android:maxLength="10"
        android:textColor="#FF33CC"
        android:textColorHint="#339900"
        android:theme="@style/EditTextStyle"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>
```

```xml:styles.xml
<!-- android:theme="@style/EditTextStyle"で読み込んでいる -->
<style name="EditTextStyle">
    <item name="colorControlActivated">#006400</item>
    <item name="android:textCursorDrawable">@drawable/edit_text_cursor</item>
    <item name="android:textColorHighlight">#800080</item>
</style>
```
```xml:edit_text_cursor.xml
<!-- <item name="android:textCursorDrawable">@drawable/edit_text_cursor</item>で読み込んでいる -->
<!-- カーソルレイアウト -->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <size android:width="2dp" />
    <solid android:color="#FFFF00" />
</shape>
```
```xml:edit_text_background
<!-- android:background="@drawable/edit_text_background"で読み込んでいる -->
<!-- バックグラウンド -->
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="4dp"
        android:color="#FF0000" />
    <solid android:color="#fff" />
</shape>
```
## ちょっと補足
<code>android:theme</code>でstyleを読み込んでいます。<code>android:textColor</code><code>android:textColorHint</code>をstyle.xmlに記載して、themeで呼び出そうとすると文字が透明で色がつかないと言う不具合が起きたのでstyle.xmlにまとめませんでした。（原因まではわかっていないのと、もしかしたら端末依存？の可能性もありますね。理由はわかっていないです。
<code>android:textCursorDrawable</code>にカラーコードを入力すると色は変更されるが、点滅が起こらなくなります。なので、動きを変えたくない場合はdrawableで指定した方が良いです。（デフォルトは点滅あり）
<code>android:background</code>はdrawableで呼び出すことによりカスタマイズは大幅に変えることができます。デフォルトのままだと下線部しか出てこないので少しダサいです。。

# ハンドラーの下に線が出てくる不具合が起きた場合
EditTextを実装している時にハンドラーの下に線が出てくるという不具合が起きました。
(青矢印で差している部分です！)
**不具合が起こった時の画像**
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/486a0461-3ade-c3c1-4b7c-f9938ed7a072.png" width="500px">
**不具合解消時の画像**
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3117699/8d40494b-6526-b9e8-056a-a40fb7a84e42.png" width="500px">
原因としては<code>styles.xml</code>styleの **parent** が原因でした。
継承することで影響があるということですが何が影響しているかは分かりません。ですが今回に関してはparentは不要なのでparentを削除することにより問題は解決しました。
```xml:styles.xml
<!-- 修正前（不具合あり） -->
<style name="EditTextStyle" parent="Widget.AppCompat.EditText">
    <item name="colorControlActivated">#006400</item>
    <item name="android:textCursorDrawable">@drawable/edit_text_cursor</item>
    <item name="android:textColorHighlight">#800080</item>
</style>
```
```xml:styles.xml
<!-- 修正後（不具合解消） -->
<style name="EditTextStyle">
    <item name="colorControlActivated">#006400</item>
    <item name="android:textCursorDrawable">@drawable/edit_text_cursor</item>
    <item name="android:textColorHighlight">#800080</item>
</style>
```
# 最後に
現在はxmlを使用しないレイアウト作成もありますが、
xmlの使用もされているので、まとめてみました。
ユーザーに見えるところなので、こういうこともできるんだと知っておくと良いですね！
最後までご覧いただきありがとうございました！

# 参考
[EditTextの色変更箇所まとめ](https://qiita.com/konifar/items/47d467e3574c9228fdc8)　
[EditTextのthemeを設定したらhandle部分に謎の下線が出てきたときの対処法](https://qiita.com/litmon/items/56f58ec241e4d9e1a24a)