Goodroid

GoodroidはAndroidアプリ開発のための情報をコラムやブログで紹介するサイトです。


スライダーを実装する
ここではスライダーを実装する方法を確認していきます。

スライダーは画面をスライドさせて隠れた画面を表示する機能です。
「SlidingDrawer」クラスを用いたXMLの修正だけで実装できます。

main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="メインコンテンツ表示部分" />

    <SlidingDrawer
        android:id="@+id/slidingdrawer"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        android:handle="@+id/sliderhandle"
        android:content="@+id/slidercontent" >

        <LinearLayout
            android:id="@+id/sliderhandle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dip"
            android:background="#333333">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#FFFFFF"
                android:text="ハンドル"
            />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/slidercontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="#aaaaaa">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#333333"
                android:text="サブコンテンツ表示部分"
            />
        </LinearLayout>

    </SlidingDrawer>

</LinearLayout>

サンプルコードでは「ハンドル」を上にスライドすることで、サブコンテンツ表示部分が表示されます。ポイントはハンドル部分のpadding(余白)と背景色の設定です。余白でハンドルの大きさを指定し、背景色でメインコンテンツ部分と違う色にします(同じ色だと見分けがつかない)。

実行結果



2985 views | コメント:0 | 2012-06-09
コメント
まだこの記事にコメントはありません
コメントの投稿
名前 (必須)

メールアドレス (非公開)

本文(必須)

パスワード (必須)
(半角数字4桁)