image inside appbar layout

Question

I am making a tabbed activity. I have placed an image view inside AppBarLayout. I want to change image view src or background when each tab is selected.

Any body give me some hint?

I have attached my code below.

<android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.NoActionBar.AppBarOverlay">

        <ImageView
            android:id="@+id/appBarImg"
            android:layout_width="400dp"
            android:layout_height="200dp"
            android:layout_weight="1"
            android:background="@drawable/sc" />

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="#FFF"
            app:tabMode="scrollable"
            app:tabPaddingEnd="15dp"
            app:tabPaddingStart="15dp">

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Schengen" />

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Rest Of World" />

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Worldwide" />

        </android.support.design.widget.TabLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

Answer 1

Try this

    ImageView appBarImg=findViewById(R.id.appBarImg);
    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            if(position==0){
                appBarImg.setBackgroundResource(R.drawable.position1);
            }else if(position==1){
                appBarImg.setBackgroundResource(R.drawable.position2);
            }else if(position==2){
                appBarImg.setBackgroundResource(R.drawable.position3);
            }
        }

        @Override
        public void onPageSelected(int position) {

        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    });

EDIT

<android.support.design.widget.AppBarLayout
        android:id="@+id/htab_appbar"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:visibility="visible">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">


            <ImageView
                android:id="@+id/appBarImg"
                android:layout_width="match_parent"
                android:layout_height="250dp"
                android:background="@drawable/ic_launcher_background"
                app:layout_collapseMode="parallax" />

        </LinearLayout>





       <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabIndicatorColor="#FFF"
            app:tabMode="scrollable"
            app:tabPaddingEnd="15dp"
            app:tabPaddingStart="15dp">

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Schengen" />

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Rest Of World" />

            <android.support.design.widget.TabItem
                android:id="@+id/tabItem3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Worldwide" />

        </android.support.design.widget.TabLayout>
    </android.support.design.widget.AppBarLayout>