コンテンツリストの取得

最終更新: 2013/7

このチュートリアルではコンテンツリストの取得方法について学びます。
使用するCGIは command.cgi です。

GetList ボタンをクリック(タップ)すると、FlashAirの現在のコンテンツがリストに表示されるように作成します。

このようにレイアウトを設定します:

display empty list

重要: Android application は、デフォルトの状態ではインターネットにアクセスすることができません。
そのため、設定ファイル AndroidManifest.xml を変更し、権限を与える必要があります。
パス: [Project_Folder]/AndroidManifest.xml
AndroidManifest.xml に以下のコードを追加してください:

<uses-permission android:name="android.permission.INTERNET" />

ここでは、説明のために AndroidManifest.xmlの内容を記していますが、追加は Permissionsタブの画面から行うようにしてください。

ではまず、 activity_main.xml を記述して、レイアウトを決定します。
このファイルは、layout フォルダに配置されています。
パス: [Project_Folder]/res/layout/activity_main.xml

レイアウトの作成

Button を1つと、 TextView を2つ設定します。
TextView の text要素 には、デフォルト値を設定しておきます。
FlashAir のコンテンツを取得したら内容を置き換えます。

activity_main.xml に以下のように記述してください:

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context=".MainActivity" >

    <Button
        android:id="@+id/button1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="#00000000"
        android:text="Get List"
        android:textColor="@android:color/white"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/textView0"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:scaleType="centerInside"
        android:text="# of items will be here"
        android:textAlignment="center"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:text="List of contents will be here"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="20sp" />

</LinearLayout>

コンテンツリストの作成

次に、 MainActivity.java を修正します。自動生成された直後は、このように記述されています:

MainActivity.java

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class MainActivity extends Activity {

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

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }
}

初期化

ボタンがクリックされた場合の処理を行うため、OnClickListenerインターフェースをクラス宣言に追加します。
以降、必要になったImport文は、適宜追加してください。

MainActivity.java (1)

public class MainActivity extends Activity implements OnClickListener {

ボタンの定義

onCreate(Bundle savedInstanceState) を編集します。
Buttonがクリックされたらコンテンツリストを取得するように、以下のように設定します:

MainActivity.java (2)

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

        Button button = (Button)findViewById(R.id.button1);
        getWindow().setTitleColor(Color.rgb(65, 183, 216));
        button.getBackground().setColorFilter(Color.rgb(65, 183, 216), PorterDuff.Mode.SRC_IN);
        button.setOnClickListener(this);
    }

onCreateOptionsMenu(Menu menu) の関数はそのまま残します:

MainActivity.java (3)

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

ファイル数の取得・表示

前の手順で作成したクリックリスナーを Buttonに設定し、 Buttonがタップされた際に、ファイル数とファイルリストを取得し表示するようにします。

ファイル数を取得するためには、以下のコマンドを使用します。

  • ファイル数は、 command.cgiop=101 とフォルダパスを指定することで取得できます。
    • コマンド: http://flashair/command.cgi?op=101&DIR=/DCIM
    • コマンドが返す情報: <NumberofItems>

コマンドの実行には、URLConnectionを使用しています。
URLConnectionを使用する一連の処理は、 FlashAirRequest.java にまとめます。
CGIコマンドを実行し結果の文字列を返す、 getString()を作成します。

FlashAirRequest.java

public class FlashAirRequest {    
    static public String getString(String command) {    
        String result = "";
        try{
            URL url = new URL(command);
            URLConnection urlCon = url.openConnection();
            urlCon.connect();
            InputStream inputStream = urlCon.getInputStream();         
            BufferedReader bufreader = new BufferedReader(new InputStreamReader(inputStream, "UTF-8"));
            StringBuffer strbuf = new StringBuffer();
            String str;
            while ((str = bufreader.readLine()) != null) {
                if(strbuf.toString() != "") strbuf.append("\n");
                strbuf.append(str);
            }
            result =  strbuf.toString();
        }catch(MalformedURLException e) {
            Log.e("ERROR", "ERROR: " + e.toString());
            e.printStackTrace();
        }
        catch(IOException e) {
            Log.e("ERROR", "ERROR: " + e.toString());
            e.printStackTrace();
        }
        return result;
    }
}

次に、 FlashAirRequest.java を使用する側の処理を作成します。
UIが長い間操作を受け付けない状態にならない(ブロックしない)よう、通信処理は AsyncTask を使用して別スレッドで行います。

MainActivity.java (4)

    @Override
    public void onClick(View view) {
        switch ( view.getId() ) {
        case R.id.button1 :            
            // Fetch number of items in directory and display in a TextView
            new AsyncTask<String, Void, String>(){
                @Override
                protected String doInBackground(String... params) {
                    return FlashAirRequest.getString(params[0]);                
                }
                @Override
                protected void onPostExecute(String fileCount) {
                    TextView textView = (TextView)findViewById(R.id.textView0);                    
                    textView.setText("Items Found: " + fileCount);        
                }
            }.execute("http://flashair/command.cgi?op=101&DIR=/DCIM");
  • 9行目
    FlashAirRequest.java に実装した getString()を使用してCGIコマンドを実行し、その結果を返しています。
  • 13-14行目
    doInBackground()の戻り値を onPostExecute()で受け取り、前の手順で設定した activity_main.xml のTextView のうちの1つ目にファイル数を表示しています。

ファイルリストの取得・表示

ファイルリストを取得するためには、以下のコマンドを使用します。

  • ファイルリストは、 command.cgiop=100 とフォルダパスを指定することで取得できます。
    • コマンド: http://flashair/command.cgi?op=100&DIR=/DCIM
    • コマンドが返す情報: <Directory>,<Filename>,<Size>,<Attribute>,<Date>,<Time>

同じく、作成した FlashAirRequest.java を使用してコマンドを実行します。

MainActivity.java (5)

            // Get a file list from FlashAir
            new AsyncTask<String, Void, String>(){
                @Override
                protected String doInBackground(String... params) {    
                    return FlashAirRequest.getString(params[0]);
                }
                @Override
                protected void onPostExecute(String text) {
                    TextView textView1 = (TextView)findViewById(R.id.textView1);
                    textView1.setText(text);
                }
            }.execute("http://flashair/command.cgi?op=100&DIR=/DCIM");
            break;
        }
    }
} // End MainActivity class
  • 5行目
    FlashAirRequest.java に実装した getString()を使用してCGIコマンドを実行し、その結果を返しています。
  • 9-10行目
    doInBackgroundの戻り値を onPostExecute()で受け取り、前の手順で設定した activity_main.xmlTextView のうちの2つ目にファイルリストを表示しています。

実行結果

command.cgiop=100 は指定したフォルダの以下の情報を返します:
<Directory>,<Filename>,<Size>,<Attribute>,<Date>,<Time>

作成したリストでは、コマンドが返す情報すべてを表示しています:

displayed content list

サンプルコード

android_tutorial_02.zip (528KB)

このサイトのサンプルコードは 二条項BSDライセンスで提供されています。