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

TechAcademy

2017年4月27日 12:00

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

今回はその中の1つである、SlidingDrawer(スライドドロワー)を追加する方法と基本的な使い方をご紹介します。

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

20160620

田島メンター!!SlidingDrawerっていうGUIコンポーネントがあるんですけど、これってなんですか〜?

20163020-2

SlidingDrawerっていうのは、画面上のハンドルで新しい画面をスライドして呼び出すことのできるGUIコンポーネントなんだ。

SlidingDrawerとは

SlidingDrawerは、ハンドルを引き出して新しい画面を表示させるためのウィジェットです。

Android端末のホーム画面でも、上から下にスライドして通知画面を表示させるというように使われています。

SlidingDrawerを配置する

SlidingDrawerはレイアウトエディタのパレットの「コンポジット」から配置できます。

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

001

この状態でxmlタブを見ると、「<LinearLayout」の下に赤い波線があります。これはエラーが発生していることを示しています。

002

グラフィカルレイアウトタブに戻り、アウトラインで「content(LinearLayout)」を選択し、プロパティの「Orientation」の値を「horizontal」にしてください。

003

これでSlidingDrawerの配置は完了です。

xmlファイルには次のようなコードが追加されています。

<SlidingDrawer
android:id=”@+id/slidingDrawer1″
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:layout_column=”0″
android:layout_gravity=”left|top”
android:layout_row=”0″
android:content=”@+id/content”
android:handle=”@+id/handle” >

<Button
android:id=”@+id/handle”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”Handle” />

<LinearLayout
android:id=”@+id/content”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:background=”#FF0000″
android:orientation=”horizontal” >

</LinearLayout>
</SlidingDrawer>

それでは、実際に起動してみます。

画像では動きが分かりやすいように、アウトラインで「content(LinearLayout)」を選択し、プロパティの「Background」の値を「#FF0000」にして、引き出される画面の色を赤にしています。

「Handle」ボタンを上下にスライドさせると、画面を引き出したりしまったりすることができます。

004

ボタンを配置する

アウトラインで「content(LinearLayout)」を選択します。

この状態で、パレットの「フォーム・ウィジェット」にあるButtonをcontent(LinearLayout)の枠の上までドラッグします。

ドラッグしたボタンは枠しか見えませんが、配置はできています。

005

同じように、4つのボタンを配置して、起動して確認してみましょう。

006

SlidingDrawerの基本的な使い方は以上です。

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

20160620

SlideDrawerって活用方法がたくさんありそうですね♪

20163020-2

そうだね。通知とか画面外から出てくるような表示を使いたいときにはとても有効なコンポーネントだね。

20160620

はい♪

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

人気記事トップ10

人気記事ランキングをもっと見る

企画広告も役立つ情報バッチリ! Sponsored

ClickHouse Cloudが実現した広告運用SaaS「ATOM」のデータ基盤革新、パフォーマンスを向上しながら、運用負荷とコストを削減 11月11日 6:20 AIで開発が加速する時代、品質保証はどう変わる? Tricentisが示すAIエージェント活用の実像 11月9日 6:45 悪用までの猶予が「1分」に迫るフロンティアAI時代に開発と本番を貫く脆弱性管理が必要 10月29日 8:30 欧州CRA対応とSBOM運用。AI生成コードのOSS混入問題の対策とは ――スニペット単位で検出する「FossID」「Insignary Clarity」によるSBOM運用 9月16日 6:40 PostgreSQLからTiDBへ、稼働中SaaSで進める段階的DB移行の実践と再設計への展望 9月7日 6:30 機能安全開発におけるGoogleTestの活用を支援!「Parasoft C/C++test CT」で実現する効率化&AI連携 4月14日 6:30 【CNDW2025】Grafanaが明かす「オブザーバビリティの哲学」ー最小限の労力で実用的なインサイトを得るには 1月23日 6:30 【CNDW2025】プロダクト急増に備える基盤刷新 ーウェルスナビがECSからEKSへの移行で得た知見とは 1月15日 6:30 【CNDW2025】250環境を5人で運用、構築時間は30分に ーKINTOテクノロジーズが語るインフラ基盤組織の作り方 2025年12月18日 6:30 新たな自動化で熱視線! AIエージェントの「推論能力」を支える2つのコンポーネントとは? 2025年11月28日 6:30