Android实现底部导航选中凸起效果

2018-06-07  本文已影响58人  zzl93

最近项目底部导航栏需要做成中间的条目选中凸起,未选中不凸起的效果,自己写了个,先贴出来代码先。。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:clipChildren="false"
    >

    <FrameLayout
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/ll_bottom"
        android:background="@color/white"/>

    <LinearLayout
        android:id="@+id/ll_bottom"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:clipChildren="false"
        android:orientation="horizontal">

        <RelativeLayout
            android:id="@+id/rl1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_gravity="bottom"
            android:layout_weight="1">

            <ImageView
                android:id="@+id/iv1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_above="@+id/tv1"
                android:layout_centerInParent="true"
                android:src="@drawable/rb_home_pressed"/>

            <TextView
                android:id="@+id/tv1"
                android:layout_width="wrap_content"
                android:layout_height="18dp"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:text="文本"
                />

        </RelativeLayout>


        <RelativeLayout
            android:id="@+id/rl2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_gravity="bottom"
            android:layout_weight="1">

            <ImageView
                android:id="@+id/iv2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_above="@+id/tv2"
                android:layout_centerInParent="true"
                android:src="@drawable/rb_home_pressed"/>

            <TextView
                android:id="@+id/tv2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:text="文本"
                />

        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/rl3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_gravity="bottom"
            android:layout_weight="1">

            <ImageView
                android:id="@+id/iv3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_above="@+id/tv3"
                android:layout_centerHorizontal="true"
                android:layout_centerVertical="true"
                android:src="@drawable/rb_home_pressed"/>

            <TextView
                android:id="@+id/tv3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentBottom="true"
                android:layout_centerHorizontal="true"
                android:text="文本"
                />

        </RelativeLayout>
    </LinearLayout>
</RelativeLayout>
package com.face.jfshare.androidplus;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;

public class MainActivity extends AppCompatActivity {

    @BindView(R.id.main_content)
    FrameLayout mainContent;
    @BindView(R.id.iv1)
    ImageView iv1;
    @BindView(R.id.rl1)
    RelativeLayout rl1;
    @BindView(R.id.iv2)
    ImageView iv2;
    @BindView(R.id.rl2)
    RelativeLayout rl2;
    @BindView(R.id.iv3)
    ImageView iv3;
    @BindView(R.id.rl3)
    RelativeLayout rl3;
    @BindView(R.id.ll_bottom)
    LinearLayout llBottom;

    int preSelectedTabPosition = -1;
    int[] lightPics = {R.drawable.rb_home_pressed, R.drawable.dianxin, R.drawable.rb_home_pressed};
    int[] greyPics = {R.drawable.rb_home_pressed, R.drawable.rb_home_pressed, R.drawable.rb_home_pressed};
    List<ImageView> imageViews = new ArrayList<>();
    List<TextView> textViews = new ArrayList<>();
    @BindView(R.id.tv1)
    TextView tv1;
    @BindView(R.id.tv2)
    TextView tv2;
    @BindView(R.id.tv3)
    TextView tv3;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ButterKnife.bind(this);
        imageViews.add(iv1);
        imageViews.add(iv2);
        imageViews.add(iv3);

        textViews.add(tv1);
        textViews.add(tv2);
        textViews.add(tv3);
    }

    public void setTextColor(List<TextView> text, int position) {
        if (position != preSelectedTabPosition) {
            text.get(position).setTextColor(getResources().getColor(R.color.red));
            if (preSelectedTabPosition != -1)
                text.get(preSelectedTabPosition).setTextColor(getResources().getColor(R.color.black));
        }
    }

    public void setBackgroud(int position) {
        if (position != preSelectedTabPosition) {
            if (position == 1) {
                LinearLayout.LayoutParams params4rl = (LinearLayout.LayoutParams) rl2.getLayoutParams();
                params4rl.height = DensityUtils.dp2px(MainActivity.this, 150);
                rl2.setLayoutParams(params4rl);
            } else {
                LinearLayout.LayoutParams params4rl = (LinearLayout.LayoutParams) rl2.getLayoutParams();
                params4rl.height = ViewGroup.LayoutParams.MATCH_PARENT;
                rl2.setLayoutParams(params4rl);
            }
            imageViews.get(position).setImageDrawable(getResources().getDrawable(lightPics[position]));
            if (preSelectedTabPosition != -1)
                imageViews.get(preSelectedTabPosition).setImageDrawable(getResources().getDrawable(greyPics[preSelectedTabPosition]));
        }
    }

    public void setButton(int position) {
        setTextColor(textViews, position);
        setBackgroud(position);
//        mViewPager.setCurrentItem(position,false);
        preSelectedTabPosition = position;
    }

    @OnClick({R.id.rl1, R.id.rl2, R.id.rl3})
    public void onViewClicked(View view) {
        switch (view.getId()) {
            case R.id.rl1:
                setButton(0);
                break;
            case R.id.rl2:
                setButton(1);
                break;
            case R.id.rl3:
                setButton(2);
                break;
        }
    }
}
上一篇 下一篇

猜你喜欢

热点阅读