※本記事は2021年7月2日に更新しました。
「margin と paddingって何が違うの?」
本記事ではこの疑問にお答えします。
この記事を読んでわかることは以下の通りです。
- margin とは何か
- padding とは何か
- margin と padding の違い
では、早速参りましょう!
前回記事はこちら
marginとは何か
![](https://zerokara-app.com/wp-content/uploads/2021/06/laptop-3317007_1920-1-1024x689.jpg)
marginとは何か解説します。
marginはViewとViewの間の距離を定義するものです。
難しく言うとこうなのですが、わかりにくいと思います。
視覚的に覚えるのが一番ですので、以下の図を見てください。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図1-5.png)
人がViewの中身を、四角がViewの外形を表しています。
また、青矢印がmarginを表しています。
ViewとViewの間の距離をmarginが定義していることがわかります。
marginは上下左右の方向によって名前が付けられています。
方向と名前の組み合わせは以下の通りです。
- 上側のmarginは『marginTop』
- 下側はmarginは『marginBottom』
- 左側のmarginは『marginStart』
- 右側のmarginは『marginEnd』
Android Studioでは以下の赤枠で設定が可能です。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図2-9-1024x716.png)
View とViewの間隔をとりたいならmarginと覚えましょう。
Paddingとは何か
![](https://zerokara-app.com/wp-content/uploads/2021/06/business-2717063_1920-1024x678.jpg)
paddingとは何かについて解説します。
paddingとはViewの中身と外形の間の距離を定義するものです。
これも視覚的に覚えるのが一番です。
下記図を見てください。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図3-5.png)
オレンジ矢印がpaddingを表しています。
Viewの中身と外形の間の距離を定義していることがわかります。
marginと同様、paddingも上下左右の方向によって名前が付けられています。
方向と名前の組み合わせは以下の通りです。
- 上側のpaddingは『paddingTop』
- 下側はpaddingは『paddingBottom』
- 左側のpaddingは『paddingStart』
- 右側のpaddingは『paddingEnd』
Android Studioでは以下の赤枠で設定が可能です。
属性の共通属性の中にpaddingの設定があります。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図4-3-1024x575.png)
View の中身と外形の間隔をとりたいならpaddingと覚えましょう。
margin と padding の違い
![](https://zerokara-app.com/wp-content/uploads/2021/05/PAK15_notepenhikkiyougu20140312_TP_V-1024x666.jpg)
最後に、marginとpaddingの違いについてみていきましょう。
- marginはViewとViewの間の距離を定義するもの
- paddingはViewの中身と外形の間の距離を定義するもの
図で見てみると以下の通りです。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図5-2.png)
marginがViewの部屋と部屋の間隔だとすると、
paddingは部屋の広さとなります。
視覚的に覚えるのが一番ですので、この図を覚えておきましょう。
まとめ
![](https://zerokara-app.com/wp-content/uploads/2021/06/meeting-1245776_1920-1024x683.jpg)
本記事ではmarginとpaddingの違いについて解説しました。
marginとpaddingを覚えると、アプリでのレイアウトがぐっと楽になります。
また、この概念はWeb制作の分野でも共通した概念となっています。
覚えておいて損はないので、しっかりと覚えましょう。
本記事が初心者の方の参考になれば幸いです。
次回の記事はこちら
コメント