Spiner(コンポーネント)を使う。

spinerコンポーネントとはtab形式のボタンでクリックをすると、選択肢が出てきてその中から適正なものを選ぶインターフェイスです。

spiner

 

上記のようなインターフェイスを簡単に作成できるので、作ってみましょう。

 

最初にtabSpinerというプロジェクトを作成します。

作成が完了したら、main.xmlのファイルを開きます。

※main.xmlでは【graphical layout】で作業を行うと簡単にレイアウトの変更ができます。

TextViewクラスがデフォルトで中に配置されていると思いますが、削除をします。

次に、項目の中からtabSpinerをドラッグして、main.xmlの中にいれます。

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

これで、パブリッシュをするとタブは表示されますが、選択肢がない状態で表示がされてしまいます。

spiner

 

この選択肢を追加する為には、まずstrings.xmlというxmlを初期で作成できていると思いますが、その中にarrayの配列を作成します。

string.xmlの中にあった変数の値に関しては今回は使用をしていないので、消しても問題ありません。

※今回は消してません。

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <string name="hello">Hello World, TabSpiner!</string>
 <string name="app_name">tabSpiner</string>
 <string-array name="spiners">
 <item>red</item>
 <item>blue</item>
 <item>green</item>
 <item>yellow</item>
 </string-array>
</resources>

この値をmain.xml側で、entriesで取得をします。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 >
 <Spinner 
 android:layout_width="fill_parent" 
 android:id="@+id/spinner1" 
 android:layout_height="wrap_content"
 android:entries="@array/spiners"></Spinner>
</LinearLayout>

これで、下記のように表示がされます。

spiner

 

次にこれをスクリプトで実行をしてみたいと思います。

xmlに関してもスクリプトで制御を行うので、まずはスクリプトからxmlを読みこむメソッドを足して考えたいと思います。

 

spinnerに関しては最初に関数に読み込める部分を用意しておきます。。

private Spinner _spinner;

 

次にレイアウトからスクリプトに値うを渡します。

_spinner = (Spinner)findViewById(R.id.spinner1);

 

これでspinnerが呼び出せました。

この中にsetAdapterで値をいれます。setAdapter(new ArrayAdapter(this, 表示形式,配列));

上記を用いると

package in.android.android.tabspiner;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Spinner;

public class TabSpiner extends Activity {
 /** Called when the activity is first created. */
 private Spinner _spinner;
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 _spinner = (Spinner)findViewById(R.id.spinner1);
 _spinner.setAdapter(new ArrayAdapter(this, android.R.layout.simple_spinner_item,getResources().getStringArray(R.array.spiners)));
 }
}

上記のようになります。

ただし、こちらで設定を行うとボタンの形が若干違うような。。

spinner

(形に関しては確認次第、追って報告させていただきます。)

 

で、main.xmlを用いて作成を行いましたが、配列に関してもスクリプトで制御を行うと下記のようになります。

 

package in.android.android.tabspiner;

import android.app.Activity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Spinner;

public class TabSpiner extends Activity {
 /** Called when the activity is first created. */
 private Spinner _spinner;
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 CharSequence[] words = {"red","blue","green","orange"};
 ArrayAdapter<CharSequence> _adapter= new ArrayAdapter<CharSequence>(this, android.R.layout.simple_spinner_item,words);
 _spinner = (Spinner)findViewById(R.id.spinner1);
 _spinner.setAdapter(_adapter);
 }
}

オートコンプリート機能をTextに付加する。で作成したadapterと同じようにスクリプト内でも作成する事ができました。

 

ArrayAdapterのCharSwquenceに関しては、Stringでも問題ないと思います。Charsequenceに関しては、文字ごとに編集が可能な文字列、Stringは集合としての文字列となりますが、現状この違いが必要な機能は備えておりませんので、どちらでも問題ないかと思います。

 

 

また、spinnerイベントに関してはOnItemSelectedListenerが実装できて、

下記のような形で、選択をされた時に何番の選択肢が選択されたかがわかるようになっている。

※上記では足していなかったのですが、確認ようのTextViewをmain.xmlの中のレイアウトに足しております。

 

package in.android.android.tabspiner;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemSelectedListener;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.TextView;

public class TabSpiner extends Activity implements OnItemSelectedListener{
 /** Called when the activity is first created. */
 private Spinner _spinner;
 private TextView _textView;
 @Override
 public void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 CharSequence[] words = {"red","blue","green","orange"};
 ArrayAdapter<CharSequence> _adapter= new ArrayAdapter<CharSequence>(this, android.R.layout.simple_spinner_item,words);
 _spinner = (Spinner)findViewById(R.id.spinner1);
 _textView = (TextView)findViewById(R.id.textView1);
 _spinner.setAdapter(_adapter);
 _spinner.setOnItemSelectedListener(this);
 }
 
 @Override
 public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2,long arg3) {
 _textView.setText(Integer.toBinaryString(arg2) + "が選択されました");//2進数
 //_textView.setText(Long.toString(arg3) + "が選択されました");//10進数
 }
 @Override
 public void onNothingSelected(AdapterView<?> arg0) {
 _textView.setText("何も選択されませんでした");
 }
}

前後の記事

前の記事:

次の記事:

関連の記事

コメントの投稿

  • サイト内検索

新作アプリの紹介

関連サイトの紹介

アンドロイドアプリ開発TIPS
きぐるみカメラ
ふらいぱん
アンドロイドのデザイン集
Page top↑