web-dev-qa-db-ja.com

TabHostでタブ画像を変更する方法

アプリケーションでTabHostを使用しています。アプリケーションで4つのタブを使用していて、特定のタブが選択されていて選択されていない場合に、TabHostで異なる画像を使用したいと思います。特定のタブごとに異なる画像を使用する必要があります。

任意のタブを選択すると画像が少し明るくなり、別のタブに切り替えるとその明るい画像は灰色の網掛けになります。

TabHostを実装しましたが、TabHostで画像を変更する方法がわかりません。

誰かがこれで私を助けることができますか?.

おかげで、デビッド

27
David Brown

選択された状態と選択されていない状態に異なる画像を使用する場合は、各タブのドローアブルフォルダに「セレクタ」XMLファイルを作成します。 tab1_selector.xml、tab2_selector.xmlには以下を含める必要があり、選択された状態と選択されていない状態の画像への描画可能な参照を置き換えます。つまり.

    <?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:Android="http://schemas.Android.com/apk/res/Android">
  <item
    Android:state_selected="true"
    Android:drawable="@drawable/tab1_selected_image" />
  <item
    Android:state_selected="false"
    Android:drawable="@drawable/tab2_unselected_image" />
</selector>

次に、上記でbharathが書いたように.setIndicatorメソッドを使用して、新しいxmlドローアブルリソースを参照する必要があります。

43
David Brown

まず、2つの画像が必要です。1つから別の画像に変更するため、両方の画像が必要であり、3つの描画可能なフォルダーに配置する必要があります。

私の例では、icon1.pngおよびicon2.pngと呼ばれる画像を使用する必要があります。

その後、ドローアブルフォルダー内にxmlファイルを作成します(すべてのドローアブルフォルダーに同じファイル)。これはファイルです:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
<!-- When selected, use icon1 -->
<item Android:drawable="@drawable/icon1"
      Android:state_selected="true" />
<!-- When not selected, use icon2-->
<item Android:drawable="@drawable/icon2" />
</selector>

タブを選択したときに表示される画像を選択できます。この場合、icon1が表示されます。state_selected = trueのタグで宣言したためです。

これで、3つのドローアブルフォルダー内に2つの画像とxmlファイルができました。 OK!

次に、タブを宣言するクラスで、追加するタブごとにこの行を追加します。

tabHost.addTab(tabHost
.newTabSpec("one")
.setIndicator("The Tab",
  res.getDrawable(R.drawable.yourxmlfile))
.setContent(new Intent(this, YourClass.class)));

R.drawable.yourxmlfileは、ドローアブルフォルダーに作成したxmlファイルに対応することに注意してください。

それでおしまい!これがお役に立てば幸いです。

16
rogcg

テキストとアイコンを設定するには、setIndicatorプロパティを使用する必要があります。

 tabSpec.setIndicator(Char,Drawable);
 firstTabSpec.setIndicator("First Tab Name", getResources().getDrawable(R.drawable.logo));
 secondTabSpec.setIndicator("Second Tab Name",getResources().getDrawable(R.drawable.logo));

これを使用して、各タブに個別の画像を設定します

10
bharath

セレクターxmlファイルtabicon.xmlを作成し、このコードを配置します

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item Android:drawable="@drawable/tab_enbled" Android:state_selected="true"/>
    <item Android:drawable="@drawable/tab_default" Android:state_selected="false"/>
</selector>

今あなたのTabActivityに行き、このコードを入れてください

TabSpec MyTab = tabhost.newTabSpec("MyTab");
MyTab.setIndicator("", getResources().getDrawable(R.drawable.tabicon));
//note:if you give some text in setIndicator sometimes the icon will not be showed. 
Intent tabIntent = new Intent(this, TabOne.class);
TWTTab.setContent(tabIntent);
6
Aby Mathew

this TabLayoutチュートリアルでは、タブが選択されている場合と選択されていない場合に異なる画像が使用されます。

基本的には Statelist ドローアブルを作成する必要があります。これは、開発者サイトからの同じコードです

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <!-- When selected, use grey -->
    <item Android:drawable="@drawable/ic_tab_artists_grey"
          Android:state_selected="true" />
    <!-- When not selected, use white-->
    <item Android:drawable="@drawable/ic_tab_artists_white" />
</selector>

また、setIndicator(CharSequence、Drawable)を呼び出して、タブのテキストとアイコンを設定します。

2

このコードは、[ホスト]タブでアイコンを設定する方法と、インテントを設定する方法を示しています

  TabHost tabHost = getTabHost();

        // Tab for Photos
        TabSpec photospec = tabHost.newTabSpec("Photos");
        // setting Title and Icon for the Tab
        photospec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_photos_tab));
        Intent photosIntent = new Intent(this, PhotosActivity.class);
        photospec.setContent(photosIntent);

        // Tab for Songs
        TabSpec songspec = tabHost.newTabSpec("Songs");
        songspec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_songs_tab));
        Intent songsIntent = new Intent(this, SongsActivity.class);
        songspec.setContent(songsIntent);


        // Tab for Videos
        TabSpec videospec = tabHost.newTabSpec("Videos");
        videospec.setIndicator("", getApplicationContext().getResources().getDrawable(R.drawable.icon_videos_tab));
        Intent videosIntent = new Intent(this, VideosActivity.class);
        videospec.setContent(videosIntent);

        // Adding all TabSpec to TabHost
        tabHost.addTab(photospec); // Adding photos tab
        tabHost.addTab(songspec); // Adding songs tab
        tabHost.addTab(videospec); // Adding videos tab
2
Gangnaminmo Ako

ImageViewを選択して選択することはできず、ImageButtonは選択せずに押すこともできるため、ImageButtonを使用する方がよいでしょう。

1
ademar111190

プログラムでタブの画像を変更したい場合:

ImageView yourImage= (ImageView)mTabHost.getTabWidget().getChildTabViewAt(youtTabPosition).findViewById(Android.R.id.icon);   
yourImage.setImageResource(R.drawable.ic_more_vert_white_24dp);
0
Irfan Shah

@Suchismitaは、TabActivityの代わりにTextViewを使用することをお勧めします。タブアクティビティで以下の問題に直面しました

  • 同じタブ内で別のアクティビティを開始できませんでした。これは私が直面した大きな問題です

  • 次はタブのビューのカスタマイズです、私は仕切りのドローアブルを変更できませんでした。

  • ICSではTabActivityは廃止されました

次に、TextViewを使用して、イベントとアクティビティフローを処理するのが非常に簡単であることがわかりました。ここでは、アプリケーションの動作を完全に制御でき、タブの外観を好きなようにカスタマイズできます。

実装方法に興味がありますか?

0
Charan Pai