scrollview和viewpager联动

Posted 2020-07-17 glj521

main.xml中

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <HorizontalScrollView
        android:id="@+id/sc"
        android:layout_width="match_parent"
        android:layout_height="40dip"
        android:background="#F2F2F2" 
        android:scrollbars="none">

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

            <RadioGroup
                android:id="@+id/rg"
                android:layout_width="match_parent"
                android:layout_height="38dip"
                android:orientation="horizontal" >
            </RadioGroup>
            <ImageView 
                android:id="@+id/img"
                android:layout_width="1dip"
                android:layout_height="5dip"
                android:layout_alignParentBottom="true"
                android:background="#0f0"
                android:scaleType="matrix"
                />
        </RelativeLayout>
    </HorizontalScrollView>

    <android.support.v4.view.ViewPager
        android:id="@+id/vp"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/sc" >
    </android.support.v4.view.ViewPager>

</RelativeLayout>

fragment的xml。。。。fragment_selection_common

<?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:layout_width="300dp"
        android:layout_height="wrap_content"
        android:textSize="18sp"
        android:text="这是CommonUIFragment界面"
        />
    
    <TextView 
        android:id="@+id/tv_tabName"
        android:layout_marginTop="30dp"
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_gravity="center"
        android:textSize="20sp"
        />

</LinearLayout>

selector选择器  rb_blue_bg

<?xml version="1.0" encoding="UTF-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:color="#5AB0EB" />
    <item android:state_checked="false" android:color="#000000"/>
</selector>

radiobutton按钮  nav_radiogroup_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RadioButton xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="0dip"
    android:layout_height="fill_parent"
    android:background="#F2F2F2"
    android:button="@null"
    android:checked="true"
    android:gravity="center"
    android:text=""
    android:textColor="@drawable/rb_blue_bg"
    android:textSize="14.0dip" />

fragment

package com.bwie.test;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class CommonUIFragment extends Fragment {
    
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        
        View rootView = inflater.inflate(R.layout.fragment_selection_common, container, false);
        
        TextView tv_tabName = (TextView) rootView.findViewById(R.id.tv_tabName);
        
        Bundle bundle = getArguments();
        
        tv_tabName.setText(bundle.getString(MainActivity.ARGUMENTS_NAME, ""));
        
        return rootView;
    }
    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onActivityCreated(savedInstanceState);
    }
    
}

activity中

package com.bwie.test;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.DisplayMetrics;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.TranslateAnimation;
import android.widget.HorizontalScrollView;
import android.widget.ImageView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;

public class MainActivity extends FragmentActivity {

    public static final String ARGUMENTS_NAME = null;
    private ViewPager vp;
    private RadioGroup rg;
    private ImageView img;
    private int indicatorWidth;
    public static String[] tabTitle = { "选项1", "选项2", "选项3", "选项4", "选项5" };    //标题
    private LayoutInflater inflater;
    private HorizontalScrollView sc;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        vp = (ViewPager) findViewById(R.id.vp);
        rg = (RadioGroup) findViewById(R.id.rg);
        img = (ImageView) findViewById(R.id.img);
        sc = (HorizontalScrollView) findViewById(R.id.sc);
        initView();
        
        setlisenten();
    }

    private void setlisenten() {
        vp.setOnPageChangeListener(new OnPageChangeListener() {
            
            @Override
            public void onPageSelected(int position) {
                if(rg!=null && rg.getChildCount()>position){
                    ((RadioButton)rg.getChildAt(position)).performClick();
                }
            }
            
            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
            }
            
            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });
        rg.setOnCheckedChangeListener(new OnCheckedChangeListener() {
            
            private int currentIndicatorLeft;

            @Override
            public void onCheckedChanged(RadioGroup group, int checkedId) {
                if(rg.getChildAt(checkedId)!=null){
//                    new TranslateAnimation(fromXDelta, toXDelta, fromYDelta, toYDelta);
                    TranslateAnimation animation = new TranslateAnimation(
                            currentIndicatorLeft ,
                            ((RadioButton) rg.getChildAt(checkedId)).getLeft(), 0f, 0f);
//                    animation.setInterpolator(new LinearInterpolator());
                    animation.setDuration(100);
                    animation.setFillAfter(true);
                    
                    //执行位移动画
                    img.startAnimation(animation);
                    
                    vp.setCurrentItem(checkedId);    //ViewPager 跟随一起 切换
                    
                    //记录当前 下标的距最左侧的 距离
                    currentIndicatorLeft = ((RadioButton) rg.getChildAt(checkedId)).getLeft();
                    
                     sc.smoothScrollTo(
                            (checkedId > 1 ? ((RadioButton) rg.getChildAt(checkedId)).getLeft() : 0) - ((RadioButton) rg.getChildAt(2)).getLeft(), 0);
                 }
            }
            
        });
    }

    private void initView() {
        //DisplayMetrics 类提供了一种关于显示的通用信息，如显示大小，分辨率和字体
        DisplayMetrics dm = new DisplayMetrics();
        //将当前窗口的一些信息放在DisplayMetrics类中，
        getWindowManager().getDefaultDisplay().getMetrics(dm);
        //radiobutton的宽度
        indicatorWidth = dm.widthPixels / 4;
        LayoutParams params = img.getLayoutParams();
        params.width=indicatorWidth;
        
        img.setLayoutParams(params);
        //获取布局填充器
        inflater = LayoutInflater.from(this);
        initNavigationHSV();
        
        TabFragmentPagerAdapter mAdapter = new TabFragmentPagerAdapter(getSupportFragmentManager());
        vp.setAdapter(mAdapter);
    }

    private void initNavigationHSV() {
        rg.removeAllViews();
        for (int i = 0; i < tabTitle.length; i++) {
            RadioButton rb = (RadioButton) inflater.inflate(R.layout.nav_radiogroup_item, null);
            rb.setId(i);
            rb.setText(tabTitle[i]);
            rb.setLayoutParams(new LayoutParams(indicatorWidth,
                    LayoutParams.MATCH_PARENT));
            rg.addView(rb);
        }
        
    }

    
    class TabFragmentPagerAdapter extends FragmentPagerAdapter{

        private com.bwie.test.CommonUIFragment ft;

        public TabFragmentPagerAdapter(FragmentManager fm) {
            super(fm);
            // TODO Auto-generated constructor stub
        }

        @Override
        public Fragment getItem(int arg0) {
            ft = new CommonUIFragment();
            
            Bundle args = new Bundle();
            args.putString(ARGUMENTS_NAME, tabTitle[arg0]);
            ft.setArguments(args);
            return ft;
        }

        @Override
        public int getCount() {
            // TODO Auto-generated method stub
            return tabTitle.length;
        }
        
    }

}