※本記事は2021年7月2日に更新しました。
「複数の画面部品を、一気に揃えることってできないかな・・・?」
可能です。
次の画像をご覧ください。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図1-13-1024x454.png)
このように、3つのボタンを好きな揃え方で揃えることが可能です。
今回は複数の画面部品を均等に揃える、チェーン機能について解説します。
前提として、本記事はAndroid Studio 4.2.1を対象に記載します。
また、筆者のAndroid Studioは日本語化しているため、日本語にて解説します。
では早速参りましょう!
前回の記事はこちら
チェーン機能について
![](https://zerokara-app.com/wp-content/uploads/2021/06/work-5382501_1920-1024x617.jpg)
複数のViewを均等に揃えるチェーン機能について解説します。
準備
まず準備として、3つのボタンを用意します。
パレットからドラッグアンドドロップってボタンを3つ用意してください。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図2-15.png)
次に、ボタンの上側の制約を画面の上側に、
ボタンの下側の制約を画面の下側に設定してください。
最後に、1番左のボタンの右側の制約を真ん中のボタンの左側に、
真ん中のボタンの右側の制約を1番右側のボタンの左側に設定してください。
できていれば、次の画像のようになるかと思います。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図3-10.png)
※もしここまででわからなければ、こちらの記事を参考にしてください。
チェーン機能を使う
チェーン機能の使い方を解説します。
ボタン3つを選択し、右クリック ⇒ チェーン ⇒ Create Horizonal Chainを選択してください。
※コンポーネントツリーから選択するとやりやすいです。
Ctrlキーを押しながら選択で一個一個選択、
Shiftキーを押しながら選択で複数範囲選択です。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図4-9.png)
選択すると、次のような画面となります。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図5-6.png)
このように、均等にボタンが配置されています。
今回はHorizonalのチェーンを使ったため、横に整列して配置されました。
チェーンにはいくつかのスタイルがあります。
チェーンのスタイルの切り替えは、
ボタン3つを選択 ⇒ Horizonal Chain Style ⇒ スタイルを選択
で可能です。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図6-3.png)
現在のチェーンのスタイルがspreadです。
余白含めて均等に配置されるスタイルとなります。
下の画像のスタイルが spread insideです。
両端の余白がない形で均等に配置されます。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図7-2.png)
下の画像の配置がpackedです。
ボタン同士の余白が無い形で配置されます。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図8-2.png)
最後に、ボタンの幅を0dp (match_parent)にした場合を紹介します。
ボタン3つを選択した状態で、次の画像の赤枠で変更が可能です。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図9-1-1024x694.png)
ボタンの幅を0dp (match_parent)にすると、
次の画像のように、ボタンにて横幅が埋まる配置となります。
![](https://zerokara-app.com/wp-content/uploads/2021/06/図10-1024x654.png)
以上がチェーン機能の使い方となります。
まとめ
![](https://zerokara-app.com/wp-content/uploads/2021/06/laptop-2620118_1920-1024x683.jpg)
今回は複数の画面部品を均等に揃える、チェーン機能について解説します。
チェーン機能を使えば、アプリのレイアウトを整えるのにとても役に立ちます。
簡単に使用が可能なので、ぜひ使ってみてください。
本記事が初心者の方の参考になれば幸いです。
次回の記事はこちら
コメント