2013年12月8日日曜日

Androidで艦これ用ブラウザを作成する

艦これAdvent Calendar 2013 12/8のエントリーです。
提督の皆様こんにちは。今日もデイリーこなしているでしょうか?

私も毎日頑張ってますが、結構大変ですよね。特に私は「遠征」を10回成功させよう!がきついです。「遠征」を3回成功させよう!を達成後に出現するので結果13回遠征をする必要があります。

社会人提督の皆様は基本的に仕事が終わった後、帰宅してから艦これをすると思いますが、それから遠征を13回行うのは楽じゃないはずです。

なのでちょっとした時間にAndroidスマホから艦これができるようにしてみました。

準備


環境構築についてはこちらを参照してください。

Eclipseを起動して、[File]->[New]->[Android Application Project]を選択します。
アプリケーション名やAndroidバージョンなどを設定して、[Next]をクリックします。


今回はAndroid 4.0で作成します。(Android 2.3?知らない子ですね...)

あとはすべてデフォルト設定のままプロジェクトを作成します。

実装


・BrowserFragment.java
ブラウザ機能部分のクラスです。
package jp.lilylight.kancollebrowser;

import android.annotation.SuppressLint;
import android.net.Uri;
import android.os.Bundle;
import android.text.TextUtils;
import android.webkit.WebResourceResponse;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.webkit.WebViewFragment;

public class BrowserFragment extends WebViewFragment {

    @SuppressLint("SetJavaScriptEnabled")
    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);

        // Webブラウザの設定
        WebSettings settings = getWebView().getSettings();
        settings.setPluginState(WebSettings.PluginState.ON); // Flashを有効
        settings.setJavaScriptEnabled(true); // JavaScriptを有効
        settings.setUserAgentString("Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36"); // UserAgentをPC用に変更

        getWebView().setWebViewClient(new BrowserClient());
        getWebView().loadUrl("http://www.dmm.com/netgame/social/-/gadgets/=/app_id=854854/"); // 艦これのURLを読み込み
    }

    private class BrowserClient extends WebViewClient {

        boolean mFlashIntercept = true;

        @Override
        public WebResourceResponse shouldInterceptRequest(final WebView view, final String url) {
            String fileName = Uri.parse(url).getLastPathSegment(); // URLからファイル名を取得

            // Flash全画面表示の処理
            if (mFlashIntercept && !TextUtils.isEmpty(fileName) && fileName.endsWith(".swf")) {
                mFlashIntercept = false;
                // URLの読み込みはUIスレッドで行う
                getActivity().runOnUiThread(new Runnable() {
                    @Override
                    public void run() {
                        view.loadUrl(url);
                    }
                });
            }
            return super.shouldInterceptRequest(view, url);
        }

    }

}
Flashの全画面表示は、ページの中に拡張子がswfのファイルを見つけたらswfのファイルのみ読み込むことで実現してます。

・MainActivity.java
ブラウザを表示させる画面のクラスです。
package jp.lilylight.kancollebrowser;

import android.os.Bundle;
import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.app.DialogFragment;
import android.app.FragmentManager;
import android.content.DialogInterface;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        if (savedInstanceState != null) {
            return;
        }
        // 画面にブラウザを表示
        FragmentManager fm = getFragmentManager();
        if (fm.findFragmentById(android.R.id.content) == null) {
            BrowserFragment fragment = new BrowserFragment();
            fm.beginTransaction().add(android.R.id.content, fragment).commit();
        }
    }

    @Override
    public void onBackPressed() {
        new ExitDialog().show(getFragmentManager(), "exit"); // 終了ダイアログを表示
    }

    public static class ExitDialog extends DialogFragment {

        @Override
        public Dialog onCreateDialog(Bundle savedInstanceState) {
            return new AlertDialog.Builder(getActivity())
                    .setTitle(R.string.app_name)
                    .setMessage("これでFinish!?")
                    .setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
                        @Override
                        public void onClick(DialogInterface dialog, int which) {
                            getActivity().finish(); // アプリ終了
                        }
                    })
                    .setNeutralButton(android.R.string.cancel, null)
                    .create();
        }

    }

}
onBackPressed()はバックキーを押したときに呼ばれるメソッドです。通常の動作のまま画面を終了させると誤操作の可能性があるので、確認のダイアログを表示させるようにします。

・AndroidManifest.xml
Androidアプリの設定ファイルです。
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="jp.lilylight.kancollebrowser"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="14"
        android:targetSdkVersion="19" />

    <uses-permission android:name="android.permission.INTERNET" /> <!-- インターネット使用の許可 -->

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@android:style/Theme.Holo.Light.NoActionBar.Fullscreen" > <!-- フルスクリーン表示 -->
        <activity
            android:name="jp.lilylight.kancollebrowser.MainActivity"
            android:configChanges="keyboardHidden|orientation|screenSize"
            android:label="@string/app_name"
            android:screenOrientation="landscape" > <!-- 横画面表示 -->
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>
画面が再描画されるとゲームも再ロードされてしまうので、android:configChangesで再描画されるのを防ぎます。

実行


Flashの実行にはFlashPlayerが必要なのでこちらからダウンロード・インストールしてください。

アプリを起動すると最初はログイン画面が表示されると思うので、IDとパスワードを入力してログインすると...


ワーイヽ(゚∀゚)メ(゚∀゚)メ(゚∀゚)ノワーイ

まとめ


これでAndroidで艦これを動作させることができました。(AndroidのWebViewは4.0でFlashが非推奨となり、4.4では動作しなくなったため動かない端末もあります)

試すとわかりますが大抵の端末で重く感じると思います。PCゲームを動かそうとしてるので仕方ないけど、何とかならないものか...

そのほかにもタップがダブルタップ判定されるなどの問題があるので、そのあたりを改修したいです。

以上、艦これAdvent Calendar 2013 8日目のエントリーでした!

2013年11月8日金曜日

[Android] Fragmentこれくしょん・改

前回Fragmentを初めて使うときによくハマるポイントを紹介しました。今回はDialogFragment周りのポイントをこれくしょんします。

No.005 setCancelableが仕事してくれない


ずっとshowDialog()を使ってきた人はまずやらかすはずです。
このように書くとsetCancelable()にfalseを指定してもキャンセルできてしまいます。
public class HogeDialogFragment extends DialogFragment {

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        return new AlertDialog.Builder(getActivity())
                .setMessage(R.string.hello_dialog_fragment)
                .setCancelable(false)
                .create();
    }

}

同様にOnCancelListenerOnDismissListenerDialogに直接setすると期待通りに動いてくれません。
これはソースを見るとわかりますが、DialogFragmentDialogにリスナー等をsetしていて、上書きされてしまうためです。
    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);

        ...

        mDialog.setCancelable(mCancelable);
        mDialog.setOnCancelListener(this);
        mDialog.setOnDismissListener(this);

        ...

    }

これを解決するには、DialogFragmentにあるsetCancelable()onCancel()onDismiss()を使います。
public class HogeDialogFragment extends DialogFragment {

    public static HogeDialogFragment newInstance(boolean cancelable) {
        HogeDialogFragment f = new HogeDialogFragment();
        f.setCancelable(cancelable);
        return f;
    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        return new AlertDialog.Builder(getActivity())
                .setMessage(R.string.hello_dialog_fragment)
                .create();
    }
    
    @Override
    public void onCancel(DialogInterface dialog) {
        // TODO Dialogをキャンセルした時の処理
        super.onCancel(dialog);
    }

    @Override
    public void onDismiss(DialogInterface dialog) {
        // TODO Dialogを閉じた時の処理
        super.onDismiss(dialog);
    }

}
ここで注意点ですが、onDismiss()を使用する場合はsuper.onDismiss()を呼ぶのを忘れないでください。super.onCancel()では処理をしていないので無くても大丈夫ですが、super.onDismiss()ではDialogやFragmentの操作をしているので、無いと動作がおかしくなります。

No.006 DialogFragmentの多重起動


例えばボタンを押すとダイアログを表示するFragmentがあるとします。
public class HogeFragment extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        Button b = new Button(getActivity());
        b.setText("Show");
        b.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                HogeDialogFragment.newInstance().show(getFragmentManager(), "dialog");
            }
        });
        return b;
    }

}
このようにすると、ボタンを押すたびにダイアログが表示されます。「ダイアログ表示してたらボタン押せないから多重起動しないだろ!」...と思うかもしれませんが、ダイアログが表示される前にボタンを連打すると発生するはずです。

いつもボタンを連打する人はまずいないですが、誤って2回タップしてしまうことは日常でありえると思うので、防いでおいた方がいいでしょう。

多重起動を防ぐにはfindFragmentByTag()を使います。
public class HogeFragment extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        Button b = new Button(getActivity());
        b.setText("Show");
        b.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (getFragmentManager().findFragmentByTag("dialog") == null) {
                    HogeDialogFragment.newInstance().show(getFragmentManager(), "dialog");
                }
            }
        });
        return b;
    }

}
今表示してるダイアログを閉じてから表示するときはこんな感じにします。
public class HogeFragment extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        Button b = new Button(getActivity());
        b.setText("Show");
        b.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                FragmentTransaction ft = getFragmentManager().beginTransaction();
                Fragment f = getFragmentManager().findFragmentByTag("dialog");
                if (f != null) {
                    ft.remove(f);
                }
                HogeDialogFragment.newInstance().show(ft, "dialog");
            }
        });
        return b;
    }

}

No.007 DialogFragmentのshow/dismissでクラッシュ


おそらく発生するエラーはIllegalStateExceptionだと思います。
これが発生する原因は2つあります(もっとあるかも)。

  • "Can not perform this action after onSaveInstanceState"
onSaveInstanceState()が実行された後(onStop()とかonDestroy()とか)にFragmentを操作しようとすると発生します。onSaveInstanceState()の前にshow/dismissをするようにしてください。

  • "Can not perform this action inside of  xxx"
xxxの中ではshow/dismissはできないよというエラーです(発生理由はさっきと同じで状態が保存された後に呼びだされるため)。LoaderManager.LoaderCallbacks#onLoaderFinished()LoaderManager.LoaderCallbacks#onLoaderReset()などで発生します。対処としては、
loadInBackground()で操作する、
    @Override
    public Loader<Object> onCreateLoader(int id, Bundle args) {
        return new AsyncTaskLoader<Object>(getActivity()) {
            @Override
            public Object loadInBackground() {

                // 時間のかかる処理

                HogeDialogFragment f = (HogeDialogFragment) getFragmentManager().findFragmentByTag(TAG);
                f.dismiss();

                return result;
            }

            ...

        };
    }

Handlerにpostして操作する、
    @Override
    public void onLoadFinished(Loader<Object> loader, Object data) {
        new Handler().post(new Runnable() {
            @Override
            public void run() {
                HogeDialogFragment f = (HogeDialogFragment) getFragmentManager().findFragmentByTag(TAG);
                f.dismiss();
            }
        });
    }
などの方法があります。

実は、上記2つのタイミングでもFragmentを操作する方法があります(DialogFragmentは閉じる場合限定(API Level19現在))。理解して使わないとかえってハマる可能性があるので(私はあまり使いません)詳しく紹介しませんが、興味がある人はcommitAllowingStateLoss()dismissAllowingStateLoss()で調べてみてください。

No.008 Viewの値が保持されない


これは前回紹介した再生成されないと発生しないパターンなのですが、もはやFragmentと直接は関係ないのでここで紹介します。

例えばEditTextを表示するDialogFragmentがあるとします。
public class HogeDialogFragment extends DialogFragment {

    private EditText mEditText;

    public static HogeDialogFragment newInstance() {
        HogeDialogFragment f = new HogeDialogFragment();
        return f;
    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        mEditText = new EditText(getActivity());
        return new AlertDialog.Builder(getActivity())
                .setTitle(R.string.app_name)
                .setView(mEditText)
                .setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                    }
                })
                .setNeutralButton(android.R.string.cancel, null)
                .create();
    }

    public String getText() {
        return mEditText.getText().toString();
    }

}
このDialogFragmentを表示させて、EditTextに適当な文字を入力した後に画面を再生成させると、入力していた文字が消えてしまいます。

ViewActivityFragmentと同様にonSaveInstanceState()で状態が保存されますが、Viewの場合はBundleではなくSparseArray<Parcelable>に保存されます。
SparseArrayのkeyとしてViewのidが使われるため、idがないと保存されずに再生成時に初期化されてしまいます。

XMLでレイアウトを書くときは(状態を保存する必要があるViewは)だいたいidを付けると思うので、この現象はレイアウトを動的に生成しないとまず発生しないと思います。

Viewを作る時はidを付ける癖をつけようねというお話しでした。

まとめ


DialogFragment前回のに加えてNo.005~No.007のポイントがあるので非常にハマりやすいです。
私はpublic static なインナークラスはあまり好きじゃないのでDialogなクラスまみれになって辛い(´・ω・`)

今まで紹介したもの以外に、タブを使ったり、FragmentPagerAdapterを使ったりするとまた違ったポイントがあったりするので、ネタがたまったらまた書きます。

2013年10月29日火曜日

[Android] Fragmentこれくしょん~ふらこれ~

※この記事は某オンラインゲームとは関係ありません

2011年11月にFragment(Android3.0)が誕生して早2年近く経ちましたが、皆様いかがお過ごしでしょうか。

Fragment使ってますか?使ってる人はこの文字列をよく見かけると思います。

IllegalStateException

みんな大好き() IllegalStateExceptionです。Fragmentは使い方を間違えるとよくこいつが発生します。

AlertDialog風なDialogFragmentを作成するでも言いましたが、DialogFragmentは特にハマり所が多いです。
私も1年以上Fragmentを使ってますがいまだにハマることが多々あります。なので、ハマるポイントをこれくしょん(まとめ)してみました。

No.001 画面再生成時にクラッシュする


これはFragmentをはじめてつかった時にやりがち。原因は複数あって、

  • publicで引数なしのコンストラクタが無い
    private HogeFragment() {
    }
  • staticじゃないインナークラス
    public class HogeFragment extends DialogFragment {
    }
  • staticだけどpublicじゃないインナークラス
    private static class HogeFragment extends DialogFragment {
    }
RuntimeException(InstantiationException)が発生した時は、だいたいこの3つが原因です。

No.002 画面再生成時に値が初期化される


だいたいFragment#setArguments()で値を保存していないのが原因です。Fragment#setArguments()についてはこちらをどうぞ。
ここではオレオレsetterダメよと書いていますが、一応こんな感じにすればオレオレsetterでも値は保持されます。
public class HogeFragment extends Fragment {

    private static final String ARG_PARAM1 = "param1";

    public void setParam1(String value) {
        if (getArguments() == null) {
            setArguments(new Bundle());
        }
        getArguments().putString(ARG_PARAM1, value);
    }

}

ちなみに私は(Dialog)Fragmentをいつもこんな感じで書いてます。
public class HogeFragment extends Fragment {
    private static final String ARG_PARAM1 = "param1";
    private static final String ARG_PARAM2 = "param2";

    public static class Builder {

        final Bundle mArgs;

        public Builder() {
            mArgs = new Bundle();
        }

        public Builder setParam1(String value) {
            mArgs.putString(ARG_PARAM1, value);
            return this;
        }

        public Builder setParam2(String value) {
            mArgs.putString(ARG_PARAM2, value);
            return this;
        }

        public HogeFragment create() {
            HogeFragment f = new HogeFragment();
            f.setArguments(mArgs);
            return f;
        }
    }
}
BuilderかわいいよBuilder。

No.003 画面再生成時にリスナーが初期化される


No.002 と同じ現象ですが、Fragment#setArguments()で保持できるBundle型は、そのままではリスナーなどを格納することができません。対処方法はいくつかあると思いますが、ここでは一番メジャーなActivityにリスナーを実装する方法を紹介します。

public class HogeFragment extends Fragment {

    private OnFragmentInteractionListener mListener;


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        Button button = new Button(getActivity());
        button.setText(R.string.hello_world);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                onButtonPressed(null);
            }
        });
        return button;
    }

    // Activityにイベントを通知
    public void onButtonPressed(Uri uri) {
        if (mListener != null) {
            mListener.onFragmentInteraction(uri);
        }
    }

    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        // Activityに実装されているリスナーを取得。実装されていない場合はエラー
        try {
            mListener = (OnFragmentInteractionListener) activity;
        } catch (ClassCastException e) {
            throw new ClassCastException(activity.toString()
                    + " must implement OnFragmentInteractionListener");
        }
    }

    @Override
    public void onDetach() {
        super.onDetach();
        mListener = null;
    }

    public interface OnFragmentInteractionListener {
        public void onFragmentInteraction(Uri uri);
    }

}
public class HogeActivity extends FragmentActivity implements HogeFragment.OnFragmentInteractionListener {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        FragmentManager fm = getSupportFragmentManager();
        fm.beginTransaction().replace(android.R.id.content, new HogeFragment()).commit();
    }

    @Override
    public void onFragmentInteraction(Uri uri) {
        // TODO Auto-generated method stub
    }

}
これで画面再生成時にonAttach()が呼ばれるので、Activityからリスナーを再取得することができます。(色々な人が言ってますが私もこの書き方はあまり好きじゃないです...)

SDKの中にはテンプレートが付属されていますが、その一つにBlankFragmentという空(最小構成)のFragmentを作るテンプレートがあって、上記のような書き方になってるのでこれが現状ベターなのでしょう。(テンプレートの使い方はテンプレートを作成する(Object編)を見てください)

他の方法としてはリスナーをSerializableにしたり、JSON(String)にするなど、Bundle型に格納できる型に変換するという方法があると思いますが、私はあまり詳しくないので、詳しく書いてあるEffective Android読むといいよ!

※JSONは試してみましたがうまいこといかなかったです...

No.004 画面再生成時に値が初期化される その2


No.002 のFragment#setArguments()をやってるのに初期化される!...という方、No.003のHogeActivityのような書き方をしていませんか?サンプルなので最小構成で書いていますが、このままだと値は保持されないはずです。(正確には保持はされるが破棄される)

画面再生成時はFragmentだけでなく、Activityも再生成されるので、onCreate()などももう一度呼ばれます。No.003の例ではnew HogeFragment()で新しいインスタンスで置き換えているので初期化されてしまいます。

ではどうするかというと、onCreate()の引数であるsavedInstanceStateで判断します。savedInstanceStateは初回生成時はnullが、再生成時は保存された状態が格納されています。
public class HogeActivity extends FragmentActivity implements HogeFragment.OnFragmentInteractionListener {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        if (savedInstanceState != null) {
            return;
        }

        FragmentManager fm = getSupportFragmentManager();
        fm.beginTransaction().replace(android.R.id.content, new HogeFragment()).commit();
    }

    @Override
    public void onFragmentInteraction(Uri uri) {
        // TODO Auto-generated method stub
    }

}

まとめ


紹介した4つのポイントですが、すべて再生成されなければ発生しません。毎回発生しないってのがまたハマるポイントですね。これを100%再現させるには、画面をバックグラウンドにした状態でアプリ(プロセス)を停止させるか、[設定]→[開発者向けオプション]→[アクティビティを保持しない]にチェックをつけることで可能です。

今回はFragmentを使い始めたときにハマるポイントを紹介しました。次回はDialogFragmentなどのハマり所をまとめたいと思います。

参考サイト

2013年6月18日火曜日

[Android] TextViewの複数行Ellipsize

TextViewの複数行末尾Ellipsizeの記事を見て前に同じのでハマったことを思い出したので、その時の方法を書きます。
    /**
     * @param view TextView
     * @param maxLines 最大行数
     * @param where 省略する箇所
     */
    public static void setMultilineEllipsize(TextView view, int maxLines, TruncateAt where) {
        if (maxLines >= view.getLineCount()) {
            // ellipsizeする必要無し
            return;
        }
        float avail = 0.0f;
        for (int i = 0; i < maxLines; i++) {
            avail += view.getLayout().getLineMax(i);
        }
        CharSequence ellipsizedText = TextUtils.ellipsize(
                view.getText(), view.getPaint(), avail, where);
        view.setText(ellipsizedText);
    }
TextUtils#ellipsize()はavailで指定された範囲に文字列をいい具合にカットしてくれるAPIです。
availはLayout#getLineMax()で指定行の描画範囲が取得できるので、それを最大行(maxLines)までの範囲を足してもとめます。

使用例

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final TextView tv = (TextView) findViewById(android.R.id.text1);
        tv.setText(R.string.attack_on_titan);
        tv.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                tv.getViewTreeObserver().removeGlobalOnLayoutListener(this);
                setMultilineEllipsize(tv, 3, TruncateAt.END);
            }
        });
    }
TextView#getLayout()などは描画後じゃないと取得できないので、OnGlobalLayoutListenerを使います。

activity_main.xml
    <TextView
        android:id="@android:id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
TextViewにellipsize,maxLinesは設定しないでください。

実行

  • Ellipsize=START, MaxLines=1

  • Ellipsize=MIDDLE, MaxLines=3

  • Ellipsize=END, MaxLines=5

  • Ellipsize=END, MaxLines=20

まとめ

このTextViewのバグでウォール・休日が破壊された。

2013年6月11日火曜日

[Android] Navigation Drawerを画面上側から表示させる

Support Package revision 13でNavigation Drawerを作るためのクラス(DrawerLayoutとかActionBarDrawerToggleとか)が追加されました。

しかし、Navigation Drawerは左側固定で変更することができません。
それを右側から表示するように変更する!...にしようと思いましたが、ActionBarDrawerToggleのGravity.LEFTをGravity.RIGHTに変更したらできてしまったので、今回は上側から表示させるようにしました。

※Navigation Drawerのデザインガイドに準拠してないので使用する場合は自己責任でお願いします。

作成したのは以下のクラスです。それぞれDrawerLayout、ActionBarDrawerToggleの左右の処理を上下の処理に変更しました。

  • VerticalDrawerLayout.java
  • ActionBarVerticalDrawerToggle.java

使用例

MainActivity.java
public class MainActivity extends Activity {
    private VerticalDrawerLayout mDrawerLayout;
    private ListView mDrawerList;
    private ActionBarVerticalDrawerToggle mDrawerToggle;

    private CharSequence mDrawerTitle;
    private CharSequence mTitle;
    private String[] mPlanetTitles;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mTitle = mDrawerTitle = getTitle();
        mPlanetTitles = getResources().getStringArray(R.array.planets_array);
        mDrawerLayout = (VerticalDrawerLayout) findViewById(R.id.drawer_layout);
        mDrawerList = (ListView) findViewById(R.id.top_drawer);

        // set a custom shadow that overlays the main content when the drawer opens
        mDrawerLayout.setDrawerShadow(R.drawable.drawer_shadow, Gravity.TOP);
        // set up the drawer's list view with items and click listener
        mDrawerList.setAdapter(new ArrayAdapter<string>(this,
                R.layout.drawer_list_item, mPlanetTitles));
        mDrawerList.setOnItemClickListener(new DrawerItemClickListener());

        // enable ActionBar app icon to behave as action to toggle nav drawer
        getActionBar().setDisplayHomeAsUpEnabled(true);
        getActionBar().setHomeButtonEnabled(true);

        // ActionBarDrawerToggle ties together the the proper interactions
        // between the sliding drawer and the action bar app icon
        mDrawerToggle = new ActionBarVerticalDrawerToggle(
                this,                  /* host Activity */
                mDrawerLayout,         /* DrawerLayout object */
                R.drawable.ic_drawer,  /* nav drawer image to replace 'Up' caret */
                R.string.drawer_open,  /* "open drawer" description for accessibility */
                R.string.drawer_close  /* "close drawer" description for accessibility */
                ) {
            public void onDrawerClosed(View view) {
                getActionBar().setTitle(mTitle);
                invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
            }

            public void onDrawerOpened(View drawerView) {
                getActionBar().setTitle(mDrawerTitle);
                invalidateOptionsMenu(); // creates call to onPrepareOptionsMenu()
            }
        };
        mDrawerLayout.setDrawerListener(mDrawerToggle);

        if (savedInstanceState == null) {
            selectItem(0);
        }
    }

    ...

}
Navigation Drawerのサンプルを使用しました。DrawerLayoutをVerticalDrawerLayoutに、ActionBarDrawerToggleをActionBarVerticalDrawerToggleに置き換えました。

activity_main.xml
<android.support.v4.widget.VerticalDrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ListView
        android:id="@+id/top_drawer"
        android:layout_width="match_parent"
        android:layout_height="240dp"
        android:layout_gravity="top"
        android:choiceMode="singleChoice"
        android:divider="@android:color/transparent"
        android:dividerHeight="0dp"
        android:background="#111"/>
</android.support.v4.widget.VerticalDrawerLayout>
DrawerLayoutをVerticalDrawerLayoutに、android:layout_gravityを"top"に変更します。

実行


上からスワイプまたは左上の画像をタップで、Navigation Drawerが上側から表示されました∩( ´∀` )∩
android:layout_gravityを"bottom"、ActionBarVerticalDrawerToggle#setGravity()にGravity.BOTTOMを設定することで下側からも表示できます。


まとめ
Navigation Drawerの上下表示はまだしも、右側表示はできるようにしないと右手だけで操作する人(私です)は左からスワイプするという操作が難しいので不便。。。

ソース
https://github.com/lilylight/VerticalNavigationDrawer