效果图是这样的
源码下载地址：
https://download.csdn.net/download/ylj15503473366/10588051
关键代码
package ylj.com.dynictab;
import android.content.res.ColorStateList;
import android.graphics.Color;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.StateListDrawable;
import android.os.AsyncTask;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import java.io.IOException;
import java.net.URL;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
/**
* 动态导航图片、文字、文字颜色
*/
public class MainActivity extends AppCompatActivity {
//导航中间是一个日历组件，rb3是没有点击效果的
// RadioButton rb1,rb2,rb4,rb5;
RadioGroup mainRadioGroup;
List<HashMap> menuInfo;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// rb1=findViewById(R.id.main_radio_button1);
// rb2=findViewById(R.id.main_radio_button2);
// rb4=findViewById(R.id.main_radio_button4);
// rb5=findViewById(R.id.main_radio_button5);
mainRadioGroup =findViewById(R.id.mainRadioGroup);
mainRadioGroup.setOnCheckedChangeListener(changeListener);
menuInfo= initMenusInfo();
//如果不需要加载网络图片，把menuInfo 设置为null即可
// menuInfo=null;
if(null!=menuInfo)
{
//加载网络导航图标图片
addWebPic(menuInfo);
//动态设置导航按钮文字颜色
setTabTextColorAndText(menuInfo);
}
//如果是每个字点击后的颜色都不同，就需要循环创建ColorStateList；否则，只需要创建一个
//颜色可以固定取color文件里面的int格式，也可以通过Color.parserColor 把#000000转后使用
}
/**
* 通过网络加载
* 耗时操作，需要新起线程加载
* @param menus 菜单信息
*/
private void addWebPic(final List menus) {
new AsyncTask<List<HashMap>, Void, List<Drawable>>() {
@Override
protected List<Drawable> doInBackground(List<HashMap>... params) {
List<Drawable> pics = new ArrayList<Drawable>(menus.size());
Drawable drawableTab = getResources().getDrawable(R.drawable.main_radiobutton_1);
for (int i = 0; i < menus.size(); i++) {
StateListDrawable drawable = new StateListDrawable();
String url_unSelected = params[0].get(i).get("IMAGE_NORMAL").toString();
String url_selected = params[0].get(i).get("IMAGE_PRESS").toString();
Drawable selected = loadImageFromNetwork(url_selected, "selected");
Drawable unSelected = loadImageFromNetwork(url_unSelected, "unSelected");
drawable.addState(new int[]{android.R.attr.state_checked},
selected);
drawable.addState(new int[]{},
unSelected);
pics.add(drawable);
drawable = null;
}
return pics;
}
@Override
protected void onPostExecute(List<Drawable> drawables) {
super.onPostExecute(drawables);
try {
Drawable drawableTab = getResources().getDrawable(R.drawable.main_radiobutton_1);
for (int i = 0; i < drawables.size(); i++) {
// drawables.get(i).setBounds(0, 0, Math.round(drawableTab.getIntrinsicWidth() * 1.5f), Math.round(drawableTab.getIntrinsicHeight() * 1.5f));
drawables.get(i).setBounds(0, 0, drawableTab.getIntrinsicWidth(), drawableTab.getIntrinsicHeight());
}
for (int i = 0; i < mainRadioGroup.getChildCount(); i++) {
RadioButton rb = (RadioButton) mainRadioGroup.getChildAt(i);
if(i<2)
{
rb.setCompoundDrawables(null, drawables.get(i), null, null);
}
else if (i == 2) {
continue;
}else
{
rb.setCompoundDrawables(null, drawables.get(i-1), null, null);
}
}
setTabPicBigOrSmall();
} catch (Exception e) {
e.printStackTrace();
}
}
}.execute(menus);
}
/**
* 通过url获取网络图片
*
* @param imageUrl 图片的url
* @param srcName
* @return 加载完成的网络图片
*/
private Drawable loadImageFromNetwork(String imageUrl, String srcName) {
Drawable drawable = null;
try {
drawable = Drawable.createFromStream(
new URL(imageUrl).openStream(), srcName);
} catch (IOException e) {
Log.d("test", e.getMessage());
}
if (drawable == null) {
Log.d("test", "null drawable");
} else {
Log.d("test", "not null drawable");
}
//可以手动设置宽和高
if(null!=drawable)
{
drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable
.getIntrinsicHeight());
}
return drawable;
}
/**
* 加载网络图片后
* 设置选中的图片放大1.5倍
*/
private void setTabPicBigOrSmall() {
// int checkedId= main_RadioGroup.getCheckedRadioButtonId();
Drawable drawableTabNormal = getResources().getDrawable(R.drawable.main_radiobutton_1);
for (int i = 0; i < mainRadioGroup.getChildCount(); i++) {
//其中2是不用处理的,显示日期
RadioButton rb = (RadioButton) mainRadioGroup.getChildAt(i);
if (i == 2) {
continue;
}
Drawable[] drawables = rb.getCompoundDrawables();
if (rb.isChecked()) {
if (null != drawables[1]) {
drawables[1].setBounds(0, 0, Math.round(drawableTabNormal.getIntrinsicWidth() * 1.5f), Math.round(drawableTabNormal.getIntrinsicHeight() * 1.5f));
rb.setCompoundDrawables(null, drawables[1], null, null);
}
} else {
if (null != drawables[1]) {
drawables[1].setBounds(0, 0, drawableTabNormal.getIntrinsicWidth(), drawableTabNormal.getIntrinsicHeight());
rb.setCompoundDrawables(null, drawables[1], null, null);
}
}
}
}
/**
* 对RadioButton设置不同状态时其文字颜色。
*/
private ColorStateList createColorStateList(int checkked, int normal) {
int[] colors = new int[]{checkked, normal};
int[][] states = new int[2][];
states[0] = new int[]{android.R.attr.state_checked};
states[1] = new int[]{};
ColorStateList colorList = new ColorStateList(states, colors);
return colorList;
}
private RadioGroup.OnCheckedChangeListener changeListener = new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup arg0, int arg1) {
if(null!=menuInfo)
{
setTabPicBigOrSmall();
}
}
};
/**
* 初始化动态的导航数据
*/
private List<HashMap> initMenusInfo()
{
List<HashMap> menuInfo = new ArrayList<HashMap>();
HashMap menu = new HashMap();
menu.put("IMAGE_NORMAL", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("IMAGE_PRESS", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("TEXT_COLOR_PRESS", "#00ffaa");
menu.put("TEXT", "首页");
menuInfo.add(menu);
menu = new HashMap();
menu.put("IMAGE_NORMAL", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("IMAGE_PRESS", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("TEXT_COLOR_PRESS", "#ff0000");
menu.put("TEXT", "通报");
menuInfo.add(menu);
menu = new HashMap();
menu.put("IMAGE_NORMAL", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("IMAGE_PRESS", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("TEXT_COLOR_PRESS", "#00ff00");
menu.put("TEXT", "日报");
menuInfo.add(menu);
menu = new HashMap();
menu.put("IMAGE_NORMAL", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("IMAGE_PRESS", "https://avatar.csdn.net/B/4/9/3_shirly_yy.jpg");
menu.put("TEXT_COLOR_PRESS", "#0000ff");
menu.put("TEXT", "我的");
menuInfo.add(menu);
return menuInfo;
}
/**
* 动态设置导航文字颜色和文字
* @param menuInfo 菜单信息
*/
private void setTabTextColorAndText(List<HashMap> menuInfo )
{
for (int i = 0; i < mainRadioGroup.getChildCount(); i++) {
RadioButton rb = (RadioButton) mainRadioGroup.getChildAt(i);
ColorStateList colorList;
String text="";
if(i<2)
{
colorList = createColorStateList(Color.parseColor(menuInfo.get(i).get("TEXT_COLOR_PRESS").toString()), getResources().getColor(R.color.main_tab_text));
text=menuInfo.get(i).get("TEXT").toString();
}
else if (i == 2) {
continue;
}else
{
colorList = createColorStateList(Color.parseColor(menuInfo.get(i-1).get("TEXT_COLOR_PRESS").toString()), getResources().getColor(R.color.main_tab_text));
text=menuInfo.get(i-1).get("TEXT").toString();
}
if(null!=colorList)
{
rb.setTextColor(colorList);
}
if(null!=text)
{
rb.setText(text);
}
}
}
}
color文件
<color name="main_tab_text">#444444</color>
<color name="main_tab_text_selected">#60ACFB</color>
<color name="datetext">#3c3c3c</color>string 文件
<string name="app_name">动态导航栏</string>
<string name="main_radio_shouye">首页</string>
<string name="main_radio_tongbao">风暴</string>
<string name="main_radio_ribao">日报</string>
<string name="main_radio_wo">我的</string>style文件
<style name="main_tab_bottom">
<item name="android:textSize">12.0sp</item>
<item name="android:textColor">@drawable/tab_text_color</item>
<item name="android:ellipsize">marquee</item>
<item name="android:gravity">bottom|center_horizontal</item>
<item name="android:background">@drawable/main_radiobutton_bg</item>
<item name="android:paddingTop">0.0dp</item>
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:button">@null</item>
<item name="android:singleLine">true</item>
<item name="android:drawablePadding">2.0dp</item>
<item name="android:layout_weight">1.0</item>
<item name="android:layout_marginBottom">4dp</item>
</style>layout activity_main 文件
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<FrameLayout
android:id="@+id/main_view_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/mainTabFrameLayout"
android:background="#f5f5f5"
android:orientation="vertical" >
</FrameLayout>
<FrameLayout
android:id="@+id/mainTabFrameLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerVertical="true"
android:background="@drawable/bottom_navigation_bg"
android:orientation="horizontal"
android:paddingTop="3dp"
android:minHeight="60dp"
>
</FrameLayout>
<RadioGroup
android:id="@+id/mainRadioGroup"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:minHeight="60dp"
android:orientation="horizontal"
android:paddingTop="3dp"
android:gravity="bottom">
<RadioButton
android:id="@+id/main_radio_button1"
style="@style/main_tab_bottom"
android:drawableTop="@drawable/main_radiobutton_1_bg"
android:tag="radio_button0"
android:text="@string/main_radio_shouye"
android:checked="true"/>
<RadioButton
android:id="@+id/main_radio_button2"
style="@style/main_tab_bottom"
android:drawableTop="@drawable/main_radiobutton_2_bg"
android:tag="radio_button1"
android:text="@string/main_radio_tongbao" />
<RadioButton
android:id="@+id/main_radio_button3"
style="@style/main_tab_bottom"
android:background="#00000000"
android:clickable="false"
android:tag="radio_button1" />
<RadioButton
android:id="@+id/main_radio_button4"
style="@style/main_tab_bottom"
android:drawableTop="@drawable/main_radiobutton_3_bg"
android:tag="radio_button2"
android:text="@string/main_radio_ribao" />
<RadioButton
android:id="@+id/main_radio_button5"
style="@style/main_tab_bottom"
android:drawableTop="@drawable/main_radiobutton_4_bg"
android:tag="radio_button3"
android:text="@string/main_radio_wo" />
</RadioGroup>
<LinearLayout
android:id="@+id/dateRelativeLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="@drawable/date"
android:gravity="center"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="horizontal" >
<TextView
android:id="@+id/dateTv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="1dp"
android:layout_weight="1.2"
android:gravity="center"
android:paddingRight="2dp"
android:text="07日"
android:textColor="@drawable/date_text"
android:textSize="10sp" />
<TextView
android:id="@+id/weekTv"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="1dp"
android:layout_weight="1.2"
android:gravity="center"
android:paddingLeft="1dp"
android:text="周二"
android:textColor="@drawable/date_text"
android:textSize="10sp" />
</LinearLayout>
<TextView
android:id="@+id/locationTv"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:layout_weight="1"
android:gravity="center"
android:singleLine="true"
android:text="山西"
android:textColor="@drawable/date_text"
android:textSize="10sp" />
</LinearLayout>
</RelativeLayout>图片资源
main_radiobutton_1_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_enabled="true" android:state_pressed="false" android:drawable="@drawable/main_radiobutton_1" />
<item android:state_enabled="true" android:state_pressed="true" android:drawable="@drawable/main_radiobutton_1" />
<item android:state_enabled="true" android:state_checked="true" android:drawable="@drawable/main_radiobutton_1_selected" />
<item android:drawable="@drawable/main_radiobutton_1" />
</selector>main_radiobutton_1 和 main_radiobutton_1_selected 和bottom_navigation_bg
注意我的main_radiobutton_1 和 main_radiobutton_1_selected 是在drawabl-hdpi 里面放的，所以放大1.5倍，如果放到其它文件夹，大家需要调整大小。
