icon
icon

Androidアプリ開発でSeekBarを追加する方法【初心者向け】

Androidアプリ開発のGUIコンポーネントの【SeekBar(シークバー)】を追加する方法を初心者向けに解説した記事です。SeekBarを使うと、BGMの音量調節など一定の範囲の数値を変更することができるようになります。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

Androidアプリ開発では、アプリのパーツを簡単に追加できるGUIコンポーネントが数多く用意されています。

今回はそのなかの1つである、SeekBar(シークバー)を追加する方法と基本的な使い方をご紹介します。

 

本記事はTechAcademyのAndroidアプリ開発オンラインブートキャンプの内容をもとに解説しています。

 

大石ゆかり

田島メンター!!Androidアプリの設定画面で、数値をバーでスライドさせて選択するようにしたいんですけど、どうしたらいいんですか〜?

田島悠介

それならシークバーを使うといいよ!

大石ゆかり

シークバー・・・ですか?

 

SeekBarとは

SeekBar(シークバー)とは、ある一定の範囲の数値を入力するときに使用するGUIコンポーネントです。

アプリに流すBGMの音量の調節などで使用すると便利です。

001

 

 

SeekBarを配置する

SeekBarはレイアウトエディタのパレットの「フォーム・ウィジェット」から配置できます。

パレット内のSeekBarを、配置したい場所までドラッグしましょう。

 

これでSeekBarの設定ができました。起動すると図のように画面にSeekBarが表示されます。

 

 

[PR] Androidアプリ開発コース

SeekBarの設定

配置ができたら、まずはSeekBarの上限を設定しましょう。プロパティの「Max」に上限に設定したい値を入力します。

 

起動したときのつまみの位置は、プロパティの「Progress」で設定できます。

上で上限を300に設定したので、つまみを真ん中に表示するためにProgressを150に設定してみました。

 

このようにSeekBarを追加するとxmlファイルには次のようなコードが追加されます(widthは適宜変更しています)。

<SeekBar
android:id="@+id/seekBar2"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="74dp"
android:layout_marginStart="74dp"
android:layout_marginTop="68dp"
android:max="300"
android:progress="150" />

 

起動すると、起動すると図のように画面にSeekBarが表示されます。先ほどとは違い、SeekBarのつまみが真ん中に表示されます。

今回の記事は以上です。

他のGUIコンポーネントも使ってみたい場合は、Androidアプリ開発でImageViewを追加する方法も合わせてご覧ください。

 

大石ゆかり

バーで数値選択できるようになりました!

田島悠介

シークバーを使うと数値選択がとても楽だから、使えるときには使ったほうがいいね♪

大石ゆかり

はい♪

 

[お知らせ]TechAcademyでは初心者でもオリジナルアプリが作れるAndroidアプリ開発講座(オンラインブートキャンプ)を開催しています。自分でアプリを公開してみたい場合はご参加ください。