結論から言うと非常に単純な原因だったのですが、思うように xml でレイアウトが作成できず詰まったことがあったので共有したいと思います。

作りたかったのはこのような、固定サイズの Button があってその左に画面サイズに合わせた EditText が置かれているレイアウトです。

最初下記のようなコードを書いていました。
(一部簡単のため書き直しています)

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="40dp"
            ... (略)>

            <EditText
                android:id="@+id/word_mute_edit_text"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                ...(略) />

            <Button
                android:id="@+id/word_mute_add_button"
                android:layout_width="60dp"
                android:layout_height="match_parent"
                android:layout_alignParentEnd="true"
                android:layout_alignParentRight="true"
                android:layout_toRightOf="@+id/word_mute_edit_text"
                android:layout_toEndOf="@+id/word_mute_edit_text"
                ...(略) />
        </RelativeLayout>

これだと、下記のように EditText が画面いっぱいになってしまい、Button の layout_width = “60dp” というのが無視される形になってしまいました。

書いたルールとしては下記になります。

  • EditText は左詰めで表示可能な範囲で、ぴったりなサイズ
  • Button は右詰めで EditText の右側で、横幅が 60dp

書き方としては一見問題なさそうなので、何が原因で Button が表示されないのかがわからず1時間ほど悩んでしまいました。
その中でふと「toXxxxOf の基準にするものによってレイアウトが変わるのでは」という考えが浮かびました。
その考え方で行くと、「(Button を無視した状態で)まず EditText を画面いっぱいに配置」して、その後に「Button を EditText の右側に配置」ということになります。
たしかにこれでは、Button が配置される領域がなくなってしまうように思えます。
(それでも横幅の 60dp が無視されるでおかしくはありますが)

そこで、下記のように修正しました。

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="40dp"
            ... (略)>

            <EditText
                android:id="@+id/word_mute_edit_text"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_toLeftOf="@+id/word_mute_edit_text"
                android:layout_toStartOf="@+id/word_mute_edit_text"
                ...(略) />

            <Button
                android:id="@+id/word_mute_add_button"
                android:layout_width="60dp"
                android:layout_height="match_parent"
                android:layout_alignParentEnd="true"
                android:layout_alignParentRight="true"
                ...(略) />
        </RelativeLayout>

先ほどとは少し違って、下記のルールになります。

  • EditText は左詰めで Button の左側で、表示可能な範囲でぴったりなサイズ
  • Button は右詰めで、横幅が 60dp

これでもともと意図したレイアウトになりました。

要するに toXxxxOf は、どちらを基準にするかによってレイアウトが変わってきてしまうようです。
もしかしたら常識なのかもしれませんが、同じように詰まった方の助けになれば嬉しいです。

投稿者プロフィール

みっちー
みっちー