單擊“ ActionBar”選項卡上的“更改”圖標或滑動-Android

Question

我花了很長時間才將我的ActionBar選項卡圖標放在拆分的ActionBar ，並將選項卡指示器顏色變為白色。 因此，現在我要做的就是在未選擇圖標時將其換成其他顏色。 所選圖標（和指示器）應保持白色。 但是如何？ 我使用Android Action Bar Style Generator制作了很多標簽，因此我對觸摸styles.xml有點緊張（那里已經有很多東西了）。 我曾經做過一個較舊的應用程序，您可以在其中使用可繪制的狀態選擇器xml ，但是我使用的是TabHost ，現在它已經很貶值了，所以我不能再使用它了。 但是，如果您知道一種使用drawables文件或我的styles.xml中的內容或單擊偵聽器的簡單方法？ 我不知道，但我很想學習。 基本上，未選中的圖標應為淺藍色。

我還在ViewPager使用了滑動選項卡，因此在滑動時，未選擇和選擇的圖標應該是其正確的顏色。

更新：原來我必須將代碼添加到我的onTabSelected()和onTabUnselected() ，然后它就像魔術一樣工作：

 @Override
    public void onTabSelected(ActionBar.Tab tab,
                           android.support.v4.app.FragmentTransaction fragmentTransaction) {
        // When the given tab is selected, switch to the corresponding page in the ViewPager.
        pager.setCurrentItem(tab.getPosition());

        if (tab.getPosition() ==  PHOTO_TAB)
            photo.setIcon(R.drawable.ab_camera);
        else if (tab.getPosition() == VIDEO_TAB)
            video.setIcon(R.drawable.ab_video);
        else if (tab.getPosition() == AUDIO_TAB)
            audio.setIcon(R.drawable.ab_microphone);
        else if (tab.getPosition() == TEXT_TAB)
                text.setIcon(R.drawable.ab_write);

    }

    @Override
    public void onTabUnselected(ActionBar.Tab tab,
                           android.support.v4.app.FragmentTransaction fragmentTransaction) {

        photo.setIcon(R.drawable.ab_camera_unselected);
        video.setIcon(R.drawable.ab_video_unselected);
        audio.setIcon(R.drawable.ab_sounds_unselected);
        text.setIcon(R.drawable.ab_write_unselected);

    }

CuteCollection.java

package org.azurespot.cutecollection;

import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBar;
import android.support.v7.app.ActionBar.Tab;
import android.support.v7.app.ActionBar.TabListener;
import android.support.v7.app.ActionBarActivity;
import android.view.MenuItem;

import org.azurespot.R;

/**
 * Created by mizu on 1/26/15.
 */
public class CuteCollection extends ActionBarActivity implements TabListener{

    private static final int PHOTO_TAB = 0;
    private static final int VIDEO_TAB = 1;
    private static final int AUDIO_TAB = 2;
    private static final int TEXT_TAB = 3;

    PhotoTab photoTab;
    TextTab textTab;
    VideoTab videoTab;
    AudioTab audioTab;

    ViewPager pager;

    TabsAdapter tabsAdapter = new TabsAdapter(getSupportFragmentManager());


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

        // Instantiate tabs
        photoTab = new PhotoTab();
        textTab = new TextTab();
        videoTab = new VideoTab();
        audioTab = new AudioTab();

        // Set up the action bar.
        final ActionBar actionBar = getSupportActionBar();
        getSupportActionBar().setStackedBackgroundDrawable
                (new ColorDrawable(Color.parseColor("#7e8287")));

        // Specify that we will be displaying tabs in the action bar.
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

        // Shows the up carat near app icon in ActionBar
        getSupportActionBar().setDisplayUseLogoEnabled(false);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

        // Initialize the ViewPager and set an adapter
        pager = (ViewPager) findViewById(R.id.viewpager);
        pager.setAdapter(tabsAdapter);
        pager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
            @Override
            public void onPageSelected(int position) {
                // When swiping between different app sections, select the corresponding tab.
                // We can also use ActionBar.Tab#select() to do this if we have a reference to the
                // Tab.
                actionBar.setSelectedNavigationItem(position);
            }
        });

        Tab photo = getSupportActionBar().newTab().setIcon(R.drawable.ab_camera).setTabListener(this);
        Tab video = getSupportActionBar().newTab().setIcon(R.drawable.ab_video).setTabListener(this);
        Tab audio = getSupportActionBar().newTab().setIcon(R.drawable.ab_microphone).setTabListener(this);
        Tab text = getSupportActionBar().newTab().setIcon(R.drawable.ab_write).setTabListener(this);

        getSupportActionBar().addTab(photo);
        getSupportActionBar().addTab(video);
        getSupportActionBar().addTab(audio);
        getSupportActionBar().addTab(text);
    }

    // Next 3 methods are mandatory for interface
    @Override
    public void onTabSelected(ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {
        // When the given tab is selected, switch to the corresponding page in the ViewPager.
        pager.setCurrentItem(tab.getPosition());
    }

    @Override
    public void onTabUnselected(ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {

    }

    @Override
    public void onTabReselected(ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {

    }

    private class TabsAdapter extends FragmentPagerAdapter {

        public TabsAdapter(FragmentManager fm) {
            super(fm);
        }

        /**
         * @return the number of pages (tabs) to display
         */
        @Override
        public int getCount() {
            return 4;
        }

//        @Override
//        public CharSequence getPageTitle(int position) {
//            switch (position) {
//                case 0:
//                    return "Photos";
//                case 1:
//                    return "Videos";
//                case 2:
//                    return "Sounds";
//                case 3:
//                    return "Poems";
//            }
//
//            return null;
//        }

        @Override
        public Fragment getItem(int position) {

            switch(position){
                case PHOTO_TAB:
                    return photoTab;
                case VIDEO_TAB :
                    return videoTab;
                case AUDIO_TAB:
                    return audioTab;
                case TEXT_TAB:
                    return textTab;
                default:
                    return null;
            }
        }
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {

        // Makes the UP caret go back to the previous fragment MakeCuteHome
        switch (item.getItemId()) {
            case android.R.id.home:
                android.app.FragmentManager fm= getFragmentManager();
                fm.popBackStack();
                finish();

                return true;
            default:
                return super.onOptionsItemSelected(item);
        }
    }
}

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <style name="Theme.Tabs" parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <item name="actionBarItemBackground">@drawable/selectable_background_tabs</item>
        <item name="popupMenuStyle">@style/PopupMenu.Tabs</item>
        <item name="dropDownListViewStyle">@style/DropDownListView.Tabs</item>
        <item name="actionBarTabStyle">@style/ActionBarTabStyle.Tabs</item>
        <item name="actionDropDownStyle">@style/DropDownNav.Tabs</item>
        <item name="actionBarStyle">@style/ActionBar.Solid.Tabs</item>
        <item name="actionModeBackground">@drawable/cab_background_top_tabs</item>
        <item name="actionModeSplitBackground">@drawable/cab_background_bottom_tabs</item>
        <item name="actionModeCloseButtonStyle">@style/ActionButton.CloseMode.Tabs</item>

        <!-- Light.DarkActionBar specific -->
        <item name="actionBarWidgetTheme">@style/Theme.Tabs.Widget</item>

    </style>

    <style name="ActionBar.Solid.Tabs" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
        <item name="background">@drawable/ab_solid_tabs</item>
        <item name="backgroundStacked">@drawable/ab_stacked_solid_tabs</item>
        <item name="backgroundSplit">@drawable/ab_bottom_solid_tabs</item>
        <item name="progressBarStyle">@style/ProgressBar.Tabs</item>

    </style>

    <style name="ActionBar.Transparent.Tabs" parent="@style/Widget.AppCompat.ActionBar">
        <item name="background">@drawable/ab_transparent_tabs</item>
        <item name="progressBarStyle">@style/ProgressBar.Tabs</item>

    </style>

    <style name="PopupMenu.Tabs" parent="@style/Widget.AppCompat.PopupMenu">
        <item name="android:popupBackground">@drawable/menu_dropdown_panel_tabs</item>
    </style>

    <style name="DropDownListView.Tabs" parent="@style/Widget.AppCompat.ListView.DropDown">
        <item name="android:listSelector">@drawable/selectable_background_tabs</item>
    </style>

    <style name="ActionBarTabStyle.Tabs" parent="@style/Widget.AppCompat.ActionBar.TabView">
        <item name="android:background">@drawable/tab_indicator_ab_tabs</item>
    </style>

    <style name="DropDownNav.Tabs" parent="@style/Widget.AppCompat.Spinner.DropDown.ActionBar">
        <item name="android:background">@drawable/spinner_background_ab_tabs</item>
        <item name="android:popupBackground">@drawable/menu_dropdown_panel_tabs</item>
        <item name="android:dropDownSelector">@drawable/selectable_background_tabs</item>
    </style>

    <style name="ProgressBar.Tabs" parent="@style/Widget.AppCompat.ProgressBar.Horizontal">
        <item name="android:progressDrawable">@drawable/progress_horizontal_tabs</item>
    </style>

    <style name="ActionButton.CloseMode.Tabs" parent="@style/Widget.AppCompat.ActionButton.CloseMode">
        <item name="android:background">@drawable/btn_cab_done_tabs</item>
    </style>

    <!-- this style is only referenced in a Light.DarkActionBar based theme -->
    <style name="Theme.Tabs.Widget" parent="@style/Theme.AppCompat">
        <item name="popupMenuStyle">@style/PopupMenu.Tabs</item>
        <item name="dropDownListViewStyle">@style/DropDownListView.Tabs</item>
    </style>

</resources>

Answer 1

您可以通過執行以下操作來更改選項卡的圖標：

@Override
public void onTabSelected(ActionBar.Tab tab, android.support.v4.app.FragmentTransaction fragmentTransaction) {
    // When the given tab is selected, switch to the corresponding page in the ViewPager.
    pager.setCurrentItem(tab.getPosition());

    //to set tab's icon
    tab.setIcon(id_of_the_icon_to_change_to);

    //or if you don't have a new icon to change to, change the alpha of the current icon to make tab darker/lighter (0 means fully transparent, and 255 means fully opaque.)
    tab.getIcon().setAlpha(255);
}