ViewPagerIndicator+ViewPager

最新推荐文章于 2022-10-18 19:48:56 发布

LYF400

最新推荐文章于 2022-10-18 19:48:56 发布

阅读量178

点赞数

分类专栏： Android 开发

本文链接：https://blog.csdn.net/qq_41138470/article/details/79976652

版权

Android 开发专栏收录该内容

77 篇文章 0 订阅

订阅专栏

ViewPagerIndicator

public class ViewPagerIndicator extends LinearLayout {

    //画笔
    private Paint mPaint;
    //用来画一条线
    private Path mPath;
    //绘制线的宽度
    private int mLineWidth;
    //线的初始位置
    private int mInitTranslationX;
    //移动位置
    private int mTranslationX;
    //子控件
    private View mChildView;

    public ViewPagerIndicator(Context context) {
        super(context,null);
    }

    public ViewPagerIndicator(Context context, AttributeSet attrs) {

        super(context, attrs);
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setColor(Color.parseColor("#ffba00"));
        mPaint.setStrokeWidth(3);
        mPaint.setStyle(Paint.Style.STROKE);
    }

    //完成布局后获取子控件
    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        mChildView = getChildAt(0);
    }
    //在onSizeChanged中获取宽和初始位置，并根据位置初始化线
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mTranslationX = 0;
        mLineWidth = mChildView.getMeasuredWidth();
        mInitTranslationX = (w/getChildCount()-mLineWidth)/2;

        initLine();
    }
    //初始化线
    private void initLine(){
        mPath = new Path();
        mPath.moveTo(0,0);
        mPath.lineTo(mLineWidth,0);

    }
    //绘制线
    @Override
    protected void dispatchDraw(Canvas canvas) {
        canvas.save();
        //移动到该坐标后开始绘制
        canvas.translate(mInitTranslationX + mTranslationX,getHeight());
        canvas.drawPath(mPath,mPaint);
        canvas.restore();
        super.dispatchDraw(canvas);
    }

    在viewpager的onPageScrolled监听方法中调用此方法。viewPager滑动时mTranslationX的距离跟着变化，实现线的滑动，position，offset由onPageScrolled传值
    public void scroll(int position ,float offset){
        int tabWidth = getWidth()/getChildCount();
        mTranslationX =(int) (tabWidth * offset +tabWidth * position);
        //请求重绘，调用dispatchDraw方法
        invalidate();
    }
}

Activity_main

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.myfragmentlayout.MainActivity">

  <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/store_fl"
        >
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:background="#FF6143"
            />

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:id="@+id/store_top"
                >
                <ImageView
                    android:layout_width="15dp"
                    android:layout_height="15dp"
                    android:background="@mipmap/back"
                     android:layout_centerVertical="true"
                    />
                <EditText
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@null"
                     android:layout_centerInParent="true"
                    android:hint="请选择该店铺的商品"
                    android:textSize="14sp"
                    />
                <ImageView
                    android:layout_width="20dp"
                    android:layout_height="20dp"
                    android:layout_alignParentRight="true"
                    android:src="@mipmap/detaile_share"
                    />
            </RelativeLayout>

             <RelativeLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
                 android:layout_gravity="bottom"
                 android:layout_alignBottom="@id/store_fl"
                 android:layout_marginBottom="10dp"
                 android:layout_marginLeft="10dp"
                 android:layout_marginRight="10dp"
                 >
                 <ImageView
                     android:id="@+id/store_img"
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:src="@mipmap/ic_launcher"
                     />
                 <LinearLayout
                     android:layout_width="wrap_content"
                     android:layout_height="wrap_content"
                     android:layout_toRightOf="@id/store_img"
                     android:orientation="vertical"
                     android:layout_alignBottom="@id/store_img"
                      android:layout_marginLeft="10dp"
                     >
                     <TextView
                         android:layout_width="wrap_content"
                         android:layout_height="wrap_content"
                         android:text="sdfsd"
                         android:textColor="#EFEFEF"
                         android:textSize="20sp"
                         />
                      <TextView
                          android:layout_marginTop="8dp"
                          android:layout_width="wrap_content"
                          android:layout_height="wrap_content"
                          android:textColor="#EFEFEF"
                          android:text="sdfsdf"
                          android:textSize="14sp"
                          />
                 </LinearLayout>
                 <ImageView
                     android:layout_width="50dp"
                     android:layout_height="20dp"
                     android:src="@mipmap/ic_launcher"
                     android:layout_alignBottom="@id/store_img"
                     android:layout_alignParentRight="true"
                     />
             </RelativeLayout>
    </FrameLayout>
     <com.example.myfragmentlayout.ViewPagerIndicator
         android:id="@+id/store_indicator"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:paddingTop="10dp"
         android:paddingBottom="10dp"
         android:orientation="horizontal"
         >
          <TextView
              android:id="@+id/store_all"
              android:layout_width="0dp"
              android:layout_weight="1"
              android:layout_height="wrap_content"
              android:clickable="true"
              android:gravity="center"
              android:onClick="onClick"
             android:text="综合"

             />
          <TextView
              android:id="@+id/store_new"
              android:layout_width="0dp"
              android:layout_weight="1"
              android:layout_height="wrap_content"
              android:clickable="true"
              android:gravity="center"
              android:onClick="onClick"
             android:text="新品"

             />
          <TextView
              android:id="@+id/store_sales"
              android:layout_width="0dp"
              android:layout_weight="1"
              android:layout_height="wrap_content"
              android:clickable="true"
              android:gravity="center"
              android:onClick="onClick"
             android:text="销量"

             />

             <TextView
              android:id="@+id/store_prece"
                 android:layout_width="0dp"
                 android:layout_weight="1"
                 android:layout_height="wrap_content"
                 android:clickable="true"
                 android:gravity="center"
                 android:onClick="onClick"
              android:text="价格"
               />
     </com.example.myfragmentlayout.ViewPagerIndicator>
    <android.support.v4.view.ViewPager
        android:id="@+id/store_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fff">
    </android.support.v4.view.ViewPager>
</LinearLayout>

MainActivity

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    
    private TextView storeAll;
    private TextView storeNew;
    private TextView storeSales;
    private TextView storePrice;
    private ViewPager storePager;
    private ViewPagerIndicator storeIndicator;

    private List<Fragment> mFragmentList;
    private FragmentPagerAdapter orderPickingAdapter;
    private ViewPager.OnPageChangeListener onPageChangeListener;
    //当前选中的indicator
    private TextView currentItem;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        init();
        storePager.setAdapter(orderPickingAdapter);
        storePager.addOnPageChangeListener(onPageChangeListener);
        storePager.setCurrentItem(0);
        currentItem = storeAll;
        currentItem.setTextColor(Color.parseColor("#ffba00"));
        //自定义适配器


    }

    private void init() {
        storeAll = findViewById(R.id.store_all);
        storeNew = findViewById(R.id.store_new);
        storeSales = findViewById(R.id.store_sales);
        storePrice = findViewById(R.id.store_prece);
        storePager = findViewById(R.id.store_pager);
        storeIndicator = findViewById(R.id.store_indicator);
        storeAll.setOnClickListener(this);
        storeNew.setOnClickListener(this);
        storeSales.setOnClickListener(this);
        storePrice.setOnClickListener(this);
        mFragmentList = new ArrayList<>();
        StoreAllFragment storeAllFragment = new StoreAllFragment();
        mFragmentList.add(storeAllFragment);
        mFragmentList.add(new StoreNewFragment());
        mFragmentList.add(new StoreSaleFragment());
        mFragmentList.add(new StorePriceFrament());

        orderPickingAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
            @Override
            public int getCount() {
                return mFragmentList.size();
            }

            @Override
            public Fragment getItem(int i) {
                return mFragmentList.get(i);
            }
        };
        //设置ViewPager监听事件
        onPageChangeListener = new ViewPager.OnPageChangeListener() {
            //滑动时，indicator下面的横线跟着滑动
            @Override
            public void onPageScrolled(int i, float v, int i1) {
                storeIndicator.scroll(i, v);
            }

            //选中监听，改变indicator文字颜色
            @Override
            public void onPageSelected(int i) {
                switch (i) {
                    case 0:
                        if (currentItem == storeAll)
                            return;
                        storeAll.setTextColor(Color.parseColor("#ffba00"));
                        currentItem.setTextColor(Color.parseColor("#646464"));
                        currentItem = storeAll;
                        break;
                    case 1:
                        if (currentItem == storeNew)
                            return;
                        storeNew.setTextColor(Color.parseColor("#ffba00"));
                        currentItem.setTextColor(Color.parseColor("#646464"));
                        currentItem = storeNew;
                        break;
                    case 2:
                        if (currentItem == storeSales)
                            return;
                        storeSales.setTextColor(Color.parseColor("#ffba00"));
                        currentItem.setTextColor(Color.parseColor("#646464"));
                        currentItem = storeSales;
                        break;
                    case 3:
                        if (currentItem == storePrice)
                            return;
                        storePrice.setTextColor(Color.parseColor("#ffba00"));
                        currentItem.setTextColor(Color.parseColor("#646464"));
                        currentItem = storePrice;
                        break;
                }
            }

            @Override
            public void onPageScrollStateChanged(int i) {

            }

        };

    }


    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.store_all:
                storePager.setCurrentItem(0);
                break;
            case R.id.store_new:
                Toast.makeText(this,"动啊",Toast.LENGTH_SHORT).show();
                storePager.setCurrentItem(1);
                break;
            case R.id.store_sales:
                storePager.setCurrentItem(2);
                break;
            case R.id.store_prece:
                storePager.setCurrentItem(3);
                break;
        }
    }
}

LYF400

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ViewPagerIndicator+ViewPager

ViewPagerIndicatorpublic class ViewPagerIndicator extends LinearLayout { //画笔 private Paint mPaint; //用来画一条线 private Path mPath; //绘制线的宽度 private int mLineWidth; //线的初始位置...
复制链接

扫一扫