HOME技術AndroidAndroidアプリ:ボタンやEditTextを角丸にする

Androidアプリ:ボタンやEditTextを角丸にする

Android StudioでボタンやEditTextを配置して、角丸にします。
角丸や色などを指定する場合には、それ専用のxmlファイルを別途用意し、読み込ませるようにします。

ボタンの背景色と角丸を設定する

まず設定用のxmlファイルを新規に作成します。
「app\res\drawable」上で右クリックして、「New」→「Drawable resource file」を選択します。

「New Resource File」の画面が表示されたら、「File name」の欄にxmlファイル名をつけます。
(ファイル名は半角小文字英数と_のみです。大文字にしようとするとエラーが出ます)
名前を付けてOKを押すと、drawableフォルダ以下にそのファイルが生成されます。
ここではファイル名を「partsdesign」とします。

生成されたpartsdesign.xmlを開き、<selector>~</selector>内に以下のように入力します。

<item>
<shape android:shape=”rectangle”>
<corners
android:topRightRadius=”5dp”
android:topLeftRadius=”5dp”
android:bottomRightRadius=”5dp”
android:bottomLeftRadius=”5dp”
/>
<solid
android:color=”@color/colorPrimary”
/>
</shape>
</item>

<corners … />に書いた内容が角丸の指定です。
topRightRadius…右上の角
topLeftRadius…左上の角
bottomRightRadius…右下の角
bottomLeftRadius…左下の角
個別に大きさを変えることもできます。

<solid android:color=”@color/colorPrimary” />は、背景色の指定です。
これは、「app\res\values\colors.xml」に指定されている「colorPrimary」という設定を読み込んでいます。

レイアウトファイル(activity_main.xml)を編集する

activity_main.xmlを開き、角丸を設定したいコントロールのタグ内に、以下のように書きます。

android:background=”@drawable/partsdesign”

ここでは、ButtonとEditTextの2つに指定しました。

エミュレータを起動すると、以下のように表示されます。

関連記事

Androidアプリ:画面をタップしたら文字を入れ替える

画面をタップしたら文字を入れ替えるアプリをつくります。 今回はタッチイベントを取得する方法を調べました。 ここではレイアウト定義ファイルを「activity_main.xml」、 プログラムファイルを…続きを読む

Androidアプリを実機で確認する

AndroidアプリをAndroid Studioで開発した際に、実際のスマホの画面で動作確認する方法です。 スマホの設定 以下はArrows FX F-02Hの設定方法です(開発者向けオプションを表…続きを読む

Androidアプリ:フォーカスをあてたEditTextのテキストを全選択する

Android StudioでEditTextにフォーカスが当たったと同時に、既に入力されている文字列をすべて選択した状態にする方法です。 EditTextタグに以下のコードを追加 android:s…続きを読む

Androidアプリ:特定のViewに最初のフォーカスをあてる

Android Studioにおいて、起動時に特定のViewにフォーカスをあてる方法です。 activity_main.xmlで設定 レイアウト定義ファイル(activity_main.xml)におい…続きを読む

Androidアプリ:ボタンやEditTextに背景色・枠線をつける

Android Studioで、ボタンやEditTextに背景色や枠線をつける方法です。 コントロールの見た目の設定をするには、別途専用のxmlファイルを生成して、そこに書いた設定を読み込むようにしま…続きを読む

Androidアプリ:数値型のViewの値がNullか0以下かを判定する

Android Studioで数値型のEditTextのViewを配置して、値を取得した場合に、その値がNull値(空)もしくは0以下であるか否かを判定する方法です。 Null判定にlength()を…続きを読む

Androidアプリ:タイトルバーを消す

Android Studioで、タイトルバーを消す方法です。 通常は、以下のように画面上部にタイトルバーが表示されています。 AndroidManifest.xmlを編集する android:them…続きを読む

Androidアプリ:ボタンやEditTextに余白(パディング)を設定する

Android StudioでボタンやEditTextに余白(パディング)を設定します。 余白の設定はレイアウトファイル(activity_main.xml)を編集します。 activity_main…続きを読む

Androidアプリ:ボタンを押すとメッセージが入れ替わる

Android StudioでAndroidアプリを試作します。 今回は「ボタンを1回押すとテキストの内容が変わり、もう1回押すと元に戻る」というだけのアプリをつくります。 プロジェクトの生成 And…続きを読む

Androidアプリ:入力された数値を足して表示する

2つのテキストボックスに入力した数値を受け取り、それぞれを足した結果を表示するアプリをつくります。 ここではレイアウト定義ファイルを「activity_main.xml」、 プログラムファイルを「Ma…続きを読む