欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

android magicindicator 万能的指示栏框架学习

程序员文章站 2022-04-01 18:51:28
1.打造一个项目上要求实现的带圆角的,有图片的底部跳转tab:结合这2个框架里面的对象使用:CommonNavigator+ CommonPagerTitleView二话不说先上效果图。xml布局:1.simple_pager_title_layout.xml

1.打造一个项目上要求实现的带圆角的,有图片的底部跳转tab:结合这2个框架里面的对象使用:CommonNavigator+ CommonPagerTitleView

二话不说先上效果图。android magicindicator 万能的指示栏框架学习android magicindicator 万能的指示栏框架学习android magicindicator 万能的指示栏框架学习android magicindicator 万能的指示栏框架学习android magicindicator 万能的指示栏框架学习

android magicindicator 万能的指示栏框架学习android magicindicator 万能的指示栏框架学习

xml布局:1.simple_pager_title_layout.xml

<?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:gravity="center"
    android:orientation="vertical"
    android:paddingLeft="10dp"
    android:paddingRight="10dp">

    <ImageView
        android:id="@+id/title_img"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="center"
        android:src="@drawable/tab_icon_square_nor"
        />
 

</LinearLayout>

2.布局2:  activity_load_custom_layout_example.xml,为了增加外层圆角的效果,我加一个cardview:

<androidx.cardview.widget.CardView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="45dp"
    android:layout_marginRight="45dp"
    android:layout_marginBottom="30dp"
    app:cardCornerRadius="30dp"
    android:layout_alignParentBottom="true">里面再加入MagicIndicator这个。

 

<?xml version="1.0" encoding="utf-8"?>
<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"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@color/color_1DC8CC"
    tools:context=".LoadCustomLayoutExampleActivity">
    <FrameLayout
        android:id="@+id/fr_change"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="48dp" />

    <androidx.cardview.widget.CardView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="45dp"
        android:layout_marginRight="45dp"
        android:layout_marginBottom="30dp"
        app:cardCornerRadius="30dp"
        android:layout_alignParentBottom="true">

        <net.lucode.hackware.magicindicator.MagicIndicator
            android:id="@+id/magic_indicator"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="@color/color_BEE7FA">

        </net.lucode.hackware.magicindicator.MagicIndicator>

    </androidx.cardview.widget.CardView>

</RelativeLayout>

 3.逻辑代码: LoadCustomLayoutExampleActivity.class

实现点击的时候有高亮的圆角,请看getIndicator()这个实现的方法

package com.lodon.test;

import android.content.Context;
import android.graphics.Color;
import android.os.Build;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;

import com.flyco.tablayout.utils.FragmentChangeManager;
import com.lodon.test.ui.DevicesFragment;
import com.lodon.test.ui.HeartRateFragment;
import com.lodon.test.ui.MainPlazaFragment;
import com.lodon.test.utils.DeviceUtils;

import net.lucode.hackware.magicindicator.FragmentContainerHelper;
import net.lucode.hackware.magicindicator.MagicIndicator;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.CommonNavigator;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.abs.CommonNavigatorAdapter;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.abs.IPagerIndicator;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.abs.IPagerTitleView;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.indicators.LinePagerIndicator;
import net.lucode.hackware.magicindicator.buildins.commonnavigator.titles.CommonPagerTitleView;

import java.util.ArrayList;

import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;

public class LoadCustomLayoutExampleActivity extends AppCompatActivity {
    public static final String TAG = "LoadCustomLayoutExampleActivity";
    //    private static final String[] CHANNELS = new String[]{"NOUGAT", "DONUT", "ECLAIR", "KITKAT"};
    private FragmentContainerHelper mFragmentContainerHelper = new FragmentContainerHelper();
    //    private ViewPager mViewPager;
    MagicIndicator magicIndicator;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate( savedInstanceState );
        setContentView( R.layout.activity_load_custom_layout_example );
        initTabView();
        initMagicIndicator1();
//        全屏代码
        /*View decorView = getWindow().getDecorView();
        int option = View.SYSTEM_UI_FLAG_FULLSCREEN;
        decorView.setSystemUiVisibility(option);*/
        //透明栏
        if (Build.VERSION.SDK_INT >= 21) {
            View decorView = getWindow().getDecorView();
            int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
            decorView.setSystemUiVisibility(option);
            getWindow().setStatusBarColor( Color.TRANSPARENT);
        }

    }

    private FragmentChangeManager mFragmentChangeManager;
    private ArrayList<Fragment> mFragments = new ArrayList<>();

    private void initTabView() {
        mFragments.clear();
        mFragments.add( HeartRateFragment.newInstance( "Heart Rate" ) );//发现
        mFragments.add( DevicesFragment.newInstance( "Device" ) );//我的
        mFragments.add( MainPlazaFragment.newInstance( "Temp" ) );//聊天室
        mFragmentChangeManager = new FragmentChangeManager( getSupportFragmentManager(),
                R.id.fr_change, mFragments );
    }

    public void setMainTabIndex(int index) {
        if (mFragmentChangeManager != null) {
            mFragmentChangeManager.setFragments( index );
        }
    }

    private void initMagicIndicator1() {
        int[] imgList = {R.mipmap.my_privilege_2, R.mipmap.my_privilege_3, R.mipmap.my_privilege_4};
        int[] imgClickList = {R.mipmap.my_privilege_2_slect, R.mipmap.my_privilege_3_slect, R.mipmap.my_privilege_4_slect};
        magicIndicator = findViewById( R.id.magic_indicator );
        CommonNavigator commonNavigator = new CommonNavigator( this );
        commonNavigator.setAdjustMode( true );
        commonNavigator.setAdapter( new CommonNavigatorAdapter() {
            @Override
            public int getCount() {
                return mFragments.size();
            }

            @Override//获取标题栏视图
            public IPagerTitleView getTitleView(Context context, final int index) {
                CommonPagerTitleView commonPagerTitleView = new CommonPagerTitleView( context );

                // load custom layout 图片与标题做为显示栏填到indicator里面去
                View customLayout = LayoutInflater.from( context ).inflate( R.layout.simple_pager_title_layout, null );
                final ImageView titleImg = (ImageView) customLayout.findViewById( R.id.title_img );
//                titleImg.setImageResource(R.drawable.tab_icon_square_nor);
                titleImg.setImageResource( imgList[index] );
                commonPagerTitleView.setContentView( customLayout );
                commonPagerTitleView.setOnClickListener( new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
//                        Log.e("LoadCustom","index ="+index);
                        mFragmentContainerHelper.handlePageSelected( index );
                        setMainTabIndex( index );
//                        titleImg.setImageResource( imgClickList[index] );
                    }
                } );

                commonPagerTitleView.setOnPagerTitleChangeListener( new CommonPagerTitleView.OnPagerTitleChangeListener() {
                    @Override
                    public void onSelected(int index, int totalCount) {

                        Log.e( "onselect", String.valueOf( index ) );
                        titleImg.setImageResource( imgClickList[index] );
                    }

                    @Override
                    public void onDeselected(int index, int totalCount) {
                        titleImg.setImageResource( imgList[index] );
                    }

                    @Override
                    public void onLeave(int index, int totalCount, float leavePercent, boolean leftToRight) {
                    }

                    @Override
                    public void onEnter(int index, int totalCount, float enterPercent, boolean leftToRight) {

                    }
                } );


                return commonPagerTitleView;
            }

            @Override//圆角控制代码
            public IPagerIndicator getIndicator(Context context) {
                LinePagerIndicator indicator = new LinePagerIndicator( context );
                float navigatorHeight = DeviceUtils.dpToPixel( LoadCustomLayoutExampleActivity.this, 50 );
                indicator.setLineHeight( navigatorHeight );
//                float borderWidth = UIUtil.dip2px(context, 1);
//                float lineHeight = navigatorHeight - 2 * borderWidth;
//                indicator.setLineHeight(lineHeight);
//                indicator.setRoundRadius(lineHeight / 2);
                indicator.setRoundRadius( navigatorHeight / 2 );
//                indicator.setYOffset(borderWidth);
                indicator.setColors( getResources().getColor( R.color.white ) );
//                indicator.setBackgroundResource( R.drawable.tab_icon_square_nor );
                return indicator;
            }
        } );
        magicIndicator.setNavigator( commonNavigator );
//        ViewPagerHelper.bind(magicIndicator, mViewPager);
        mFragmentContainerHelper.attachMagicIndicator( magicIndicator );
    }
}

为了增加全屏透明的状态栏加了:

if (Build.VERSION.SDK_INT >= 21) {
    View decorView = getWindow().getDecorView();
    int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
            | View.SYSTEM_UI_FLAG_LAYOUT_STABLE;
    decorView.setSystemUiVisibility(option);
    getWindow().setStatusBarColor( Color.TRANSPARENT);
}

 

本文地址:https://blog.csdn.net/LlanyW/article/details/108187282

相关标签: Android