読者です 読者をやめる 読者になる 読者になる

View.padding

Android

マージンとパディングは混同しやすい・・・。

(マージンとパディングの違いの詳細については、
Android Advent Calendar: 今さら聞けないmarginとpadding
ここを参照のこと)

親Viewとの境界線、またはView同士の間隔には、layout_margin~を使った・・・。
これはViewの外側の余白を設定することで間隔が生まれたというようなイメージである・・・。

それに対して、padding~は、Viewの内側に余白を作る・・・。

View | Android Developers

View全体の境界線は一番外側だが、View本体の機能は余白の内側にできるというイメージ・・・。
子Viewがあったら、それも余白の内側にできるというイメージ・・・。

わかりやすい例として、EditTextの余白を考えてみる・・・。

f:id:BG1:20170102175958p:plain

EditTextのDrawableをカスタマイズするので、drawable_edittextを追加・・・。

f:id:BG1:20170102180027p:plain

shapeで、

白地に赤い枠線・・・。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
    <EditText
        android:id="@+id/edittext1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/drawable_edittext"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp" />
    
</LinearLayout>

横幅いっぱいのEditText、backgroundにdrawable_edittextをセットして、layout_marginTop、layout_marginLeftともに10dp・・・。

f:id:BG1:20170102180406p:plain

このようにpaddingがないと、赤い枠線とキャレット(カーソル)が重なってしまう・・・。

f:id:BG1:20170102180518p:plain

文字を入力してみても、キャレットが枠線の上下に当たってしまっている・・・。
これでは余裕が無い感じ・・・。

そこで、

paddingに3dpを指定する・・・。
(今回はTopとかLeftとか個別の設定ではなく、上下左右全体の余白としてpaddingに3dpをセットするようにした・・・。)

すると、

f:id:BG1:20170102180953p:plain

枠の大きさはちょっと大きくなったが、キャレットの左に余白が出来ている・・・。

f:id:BG1:20170102181100p:plain

入力しても、上下に当たってないし、余裕が感じられる・・・。
EditTextの本体の高さはキャレットの高さと同じである・・・。
しかし、枠は余白の分だけ縦の大きさが大きくなっている・・・。
もちろん、枠の横の大きさも余白の分だけ大きくなっている・・・。

Sample/android/View/padding/src/View at master · bg1bgst333/Sample · GitHub