Android開発：横に並んだ複数のButton間の隙間を解消する方法

一. 問題の再確認

概要での説明では少し分かりにくいかもしれませんので、問題を以下の図に示します：

Button1とButton2の間の隙間、およびButtonと左右の境界線との間の隙間を解消するにはどうすればよいでしょうか？

二. 問題の原因

ここで発生している隙間は、実はButtonの背景画像に含まれる透明部分です。以下の図を見てください（2つのボタンが同時に押された状態）：

隙間はButton自身の一部であるため、marginやpaddingを0に設定しても解消できません（marginに負の値を設定するのは、解決策と言えるでしょうか……？）。

三. 解決策と検証

1. Buttonのstyle属性を設定する:

   <Button style="?android:attr/buttonBarButtonStyle"/>
   

   （初期状態）
   （2つのボタンが押された状態）
   解決策1の効果：隙間を解消でき、かつボタンのデフォルトのクリックエフェクト（背景が青くなる）にも影響しません。
2. Buttonのstyleをカスタムスタイルに設定する（またはButtonのbackground属性にカスタム画像を直接設定する）:

   <style name="mybutton">
       <item name="android:background" >@drawable/whitecolor</item>
       <item name="android:padding">0dp</item>
       <item name="android:gravity">center</item>
   </style>
   

   （初期/押下状態）
   解決策2の効果：隙間は解消できますが、ボタンのデフォルトのクリックエフェクトが失われます。
3. Buttonのbackgroundを透明色に設定する：

   android:background="#00000000"
   

   （初期/押下状態）
   解決策3の効果：隙間は解消できますが、ボタンのデフォルトのクリックエフェクトが失われます（解決策2と同じ結果です）。
4. LinearLayoutをTableLayoutに変更する：

   <TableLayout
       android:stretchColumns="*"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content" >
       <TableRow>
           <Button
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_column="0"
               android:text=" Button1" />
           <Button
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:layout_column="1"
               android:text=" Button2" />
       </TableRow>
   </TableLayout>
   

   
   解決策4の効果：隙間を解消できません。
5. カスタムselectorをButtonの背景として使用する：

   <?xml version="1.0" encoding="utf-8"?>
   <selector xmlns:android="http://schemas.android.com/apk/res/android">
       <item android:drawable="@drawable/highlight"
           android:state_pressed="true"></item>
       <item android:drawable="@drawable/normal"></item>
   </selector>
   

   android:background="@drawable/bg_btn"
   

   （左側のボタンが押された状態）
   解決策5の効果：隙間を解消でき、かつボタンのデフォルトのクリックエフェクトにも影響しません（解決策1と似ていますが、ボタンの背景を自由にカスタマイズできる点で解決策1よりも優れています）。

四. まとめ

ボタンの隙間を解消する鍵は、background属性を変更することにあります。枠線に透明色を含まない画像をボタンの背景として使用すれば、隙間を解消できます。

ボタンの隙間を解消するには、解決策5の「カスタムselectorをボタンの背景画像として使用する」方法を推奨します。