Morghen Lethe

プログラミングの備忘録、趣味の事とか書いていきます。

【Android】Buttonの形を丸型にする

開発環境

Android Studio 3.5.3
compileSdkVersion = 29
targetSdkVersion = 29
minSdkVersion = 21

ソース

適当なxmlファイル名(今回はcircle_button.xml)で作って下記の通り記述する。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid
        android:color="#FFF388"/>
</shape>

※補足
android:shape="oval"の記述で、ボタンが楕円形になる。
ボタンのカラーは黄色にしてます。

そして、作ったcircle_button.xmlをdrawableフォルダにつっこむ。

このままだと楕円なってしまう(レイアウトの設定次第ではあると思う)ので、activity_main.xmlでボタンのwidthとHeightを同じサイズする。

<Button
        android:id="@+id/Button1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:text="B1"
        android:background="@drawable/circle_button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

今回は「android:layout_width」と「android:layout_height」を「50dp」に設定している。
あとは、上記の通り「android:background」を追加して、作ったcircle_button.xmlを設定("@drawable/circle_button")してあげれば完成!

f:id:hiropon_drg:20200312085357j:plain
circle_button

こんな感じになります。

参考リンク

[Android] shapeを使ってカスタムボタン作成

【Android】動く丸形ボタンを drawable だけで作ってみた | PisukeCode - Web開発まとめ

[Android] SHAPEタグを使って出来ること〜画像ファイルを使わずにボタンや背景をカスタマイズする〜 | Developers.IO

http://android-note.open-memo.net/sub/button__make_round_shape_button.html