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

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

二话不说先上效果图。

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://www.panoramacn.com
源码网提供WordPress源码,帝国CMS源码discuz源码,微信小程序,小说源码,杰奇源码,thinkphp源码,ecshop模板源码,微擎模板源码,dede源码,织梦源码等。

专业搭建小说网站,小说程序,杰奇系列,微信小说系列,app系列小说

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

免责声明,若由于商用引起版权纠纷,一切责任均由使用者承担。

您必须遵守我们的协议,如果您下载了该资源行为将被视为对《免责声明》全部内容的认可-> 联系客服 投诉资源
www.panoramacn.com资源全部来自互联网收集,仅供用于学习和交流,请勿用于商业用途。如有侵权、不妥之处,请联系站长并出示版权证明以便删除。 敬请谅解! 侵权删帖/违法举报/投稿等事物联系邮箱:2640602276@qq.com
未经允许不得转载:书荒源码源码网每日更新网站源码模板! » android magicindicator 万能的指示栏框架学习
关注我们小说电影免费看
关注我们,获取更多的全网素材资源,有趣有料!
120000+人已关注
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

您的打赏就是我分享的动力!

支付宝扫一扫打赏

微信扫一扫打赏