とりあえずやってみる。
ActionBarSherlock のサイトから
JakeWharton-ActionBarSherlock-4.4.0-0-g4a79d53.zip をダウンロードし解凍する。
解凍したらJakeWharton-ActionBarSherlock-5a15d92 フォルダが作成される。
eclipse で使ええるようにする。
ファイル->インポートを選んで、
ウインドウでAndroidのExisting Android Code Into Workspace を選択する。
インポートするプロジェクトを選択する。
解凍して出来たフォルダの中にある、
actionbarsherlock フォルダを選択する。
プロジェクトエクスプローラに読みこまれる。
ActionBarSherlock の準備はとりあえず完了。
タブを使うAndroid プロジェクトを作成する。
プロジェクトで ActionBarSherlock を使えるようにする。
パッケージエクスプローラからプロジェクトを選択して、
右クリックからプロパティーを選択する。
左のAndroid を選択して、ライブラリの追加ボタンをクリックする。
現れたウインドウから、actionbarsherlock を選択してOKボタンをクリックする。
エラーが発生した。
[2013-09-05 08:36:56 - TabTest] Found 2 versions of android-support-v4.jar in the dependency list,
[2013-09-05 08:36:56 - TabTest] but not all the versions are identical (check is based on SHA-1 only at this time).
[2013-09-05 08:36:56 - TabTest] All versions of the libraries must be the same at this time.
[2013-09-05 08:36:56 - TabTest] Versions found are:
[2013-09-05 08:36:56 - TabTest] パス: D:\workspaceTop\workspace\actionbarsherlock\libs\android-support-v4.jar
[2013-09-05 08:36:56 - TabTest] 長さ: 271754
[2013-09-05 08:36:56 - TabTest] SHA-1: 53307dc2bd2b69fd5533458ee11885f55807de4b
[2013-09-05 08:36:56 - TabTest] パス: D:\workspaceTop\workspace\TabTest\libs\android-support-v4.jar
[2013-09-05 08:36:56 - TabTest] 長さ: 556198
[2013-09-05 08:36:56 - TabTest] SHA-1: 4a6be13368bb64c5a0b0460632d228a1a915f58f
[2013-09-05 08:36:56 - TabTest] Jar mismatch! Fix your dependencies
actionbarsherlock と 自分で作成したプロジェクトで使っている、android-support-v4.jar が違うと想像されるるので、
自分で作ったプロジェクトの中のlibsフォルダに入っている、android-support-v4.jar を
actionbarsherlock の中のlibsフォルダにコピーする。
これで本当に準備完了だと思う。
タブが2つあるページを作る
1つ目のタブに表示する xml レイアウトを作成する。
パッケージエクスプローラからプロジェクトを選択して、右クリックで、
新規->Android XML ファイルを選択する。
fragment_tab1.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Tab1" /> </LinearLayout>同様に、
2つ目のタブに表示する xml レイアウトを作成する。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Tab2" /> </LinearLayout>
1つ目のタブの Fragment を作成する。
プロジェクトエクスプローラからプロジェクトを選択して、
src フォルダの中のcom.example.tabtest を選択して、右クリックから新規からクラスを選択する。
Tab1Fragment.java
package com.example.tabtest; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class Tab1Fragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.fragment_tab1, container, false); } }Tab2Fragment.java
package com.example.tabtest; import android.os.Bundle; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class Tab2Fragment extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.fragment_tab2, container, false); } }
タブを選択した時の処理をする。
TabListener.java を作る。
package com.example.tabtest; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentTransaction; import com.actionbarsherlock.app.ActionBar; import com.actionbarsherlock.app.ActionBar.Tab; import com.actionbarsherlock.app.SherlockFragmentActivity; public class TabListener<T extends Fragment> implements ActionBar.TabListener { private Fragment mFragment; private final SherlockFragmentActivity mActivity; private final String mTag; private final Class<T> mClass; private static final String TAG = "TabListener"; public TabListener(MainActivity activity, String tag, Class<T> clz) { // TODO 自動生成されたコンストラクター・スタブ mActivity = activity; mTag = tag; mClass = clz; mFragment = mActivity.getSupportFragmentManager().findFragmentByTag( mTag); } /* * 概要: タブが選択されたときの処理 */ @Override public void onTabSelected(Tab tab, FragmentTransaction ft) { // TODO 自動生成されたメソッド・スタブ if (mFragment == null) { mFragment = Fragment.instantiate(mActivity, mClass.getName()); FragmentManager fm = mActivity.getSupportFragmentManager(); fm.beginTransaction().add(android.R.id.content, mFragment, mTag) .commit(); } else { if (mFragment.isDetached()) { FragmentManager fm = mActivity.getSupportFragmentManager(); fm.beginTransaction().attach(mFragment).commit(); } } } /* * タブの選択が解除されたときの処理 */ @Override public void onTabUnselected(Tab tab, FragmentTransaction ft) { // TODO 自動生成されたメソッド・スタブ FragmentManager fm = mActivity.getSupportFragmentManager(); fm.beginTransaction().detach(mFragment).commit(); } @Override public void onTabReselected(Tab tab, FragmentTransaction ft) { // TODO 自動生成されたメソッド・スタブ } }
MainActivity.java にタブを設定する
package com.example.tabtest; import com.actionbarsherlock.app.ActionBar; import com.actionbarsherlock.app.SherlockFragmentActivity; import android.os.Bundle; public class MainActivity extends SherlockFragmentActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // setContentView(R.layout.activity_main); // テーマを設定する setTheme(R.style.Theme_Sherlock_Light); // アクションバーを設定する。 ActionBar actionBar = getSupportActionBar(); actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); actionBar.addTab(actionBar .newTab() .setText("タブ1") .setTabListener( new TabListener<Tab1Fragment>(this, "tag1", Tab1Fragment.class))); actionBar.addTab(actionBar .newTab() .setText("タブ2") .setTabListener( new TabListener<Tab2Fragment>(this, "tag2", Tab2Fragment.class))); } // @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; // } }
参考ページ:Android ActionBarとFragmentを使用してTab画面を表示する(Android 2.x)
0 件のコメント:
コメントを投稿