Android : BottomNavigation底部导航_简单应用
示例图：
1.先创建底部导航需要的图片
res → New → Vector Asset 创建三个矢量图
图片1 baseline_home.xml
图片2 baseline_menu.xml
图片3 baseline_author.xml
图片4 用于操作的图片 baseline_img.xml
2.创建 menu 文件 my_menu.xml
res → New → Android Resource File 类型选择 Menu
3.创建3个Fragment 页面
res → New → Fragment → Fragment(with ViewModel)
创建了6个文件
HomeFragment.java HomeViewModel.java 布局文件： fragment_home.xml
MenuFragment.java MenuViewModel.java 布局文件 ： fragment_menu.xml
AuthorFragment.java AuthorViewModel.java 布局文件：fragment_author.xml
往布局中添加操作的图片
fragment_home.xml：
fragment_menu.xml
fragment_author.xml
4.创建Navigation 导航文件 my_Navigation.xml
res → New → Android Resource File 类型选择 Navigation
5.在主布局添加 底部导航（BottomNavigationView） 和 跳转的页面(NavHostFragment)
activity_main.xml
6. 设置主题样式 默认是没有导航栏的
values 目录下 colors.xml
#FFBB86FC
#FF6200EE
#FF3700B3
#FF03DAC5
#FF018786
#FF000000
#FFFFFFFF
themes.xml
7. MainActivity.java
package com.example.mybuttomnavigation;
import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;
import com.google.android.material.bottomnavigation.BottomNavigationView;
public class MainActivity extends AppCompatActivity {
// 底部导航
private BottomNavigationView bottomNavigationView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
bottomNavigationView = findViewById(R.id.bottomNavigationView);
//导航
NavController navController = Navigation.findNavController(this, R.id.fragment);
//设置顶部导航
AppBarConfiguration configuration = new AppBarConfiguration.Builder(
//带返回箭头 ←
// navController.getGraph()
//不带箭头的 ←
bottomNavigationView.getMenu()
// 或者这样写 ←不带箭头
// R.id.menuFragment,R.id.authorFragment,R.id.homeFragment
).build();
//装配顶部导航
NavigationUI.setupActionBarWithNavController(this, navController, configuration);
NavigationUI.setupWithNavController(bottomNavigationView, navController);
}
}经过上面这些步骤已经可以跳转了
8.设置动画
旋转：HomeFragment.java
package com.example.mybuttomnavigation;
import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
public class HomeFragment extends Fragment {
private HomeViewModel mViewModel;
private ImageView imageView;
public static HomeFragment newInstance() {
return new HomeFragment();
}
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_home, container, false);
imageView = view.findViewById(R.id.imageView);
return view;
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
mViewModel = new ViewModelProvider(this).get(HomeViewModel.class);
imageView.setRotation(mViewModel.startAnimation);
// TODO: Use the ViewModel
/**设置动画
*
* alpha（透明度）
* scaleX（X轴缩放）
* scaleY（Y轴缩放）
* rotation（旋转）
* translationX（X轴平移）
* translationY（Y轴平移）
* */
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(imageView, "rotation", 0.0f);
//点击事件
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 判断动画是在运动 objectAnimator.isRunning() 在运动
//!objectAnimator.isRunning()取反
//重新设置旋转角度 当前的角度 旋转到 当前的角度+100，
objectAnimator.setFloatValues(imageView.getRotation(), imageView.getRotation() + 100);
mViewModel.startAnimation += 100;
objectAnimator.start();
}
});
}
}HomeViewModel.java
package com.example.mybuttomnavigation;
import androidx.lifecycle.ViewModel;
public class HomeViewModel extends ViewModel {
// TODO: Implement the ViewModel
float startAnimation = 0;
}缩放：MenuFragment.java
package com.example.mybuttomnavigation;
import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
public class MenuFragment extends Fragment {
private MenuViewModel mViewModel;
private ImageView imageView;
public static MenuFragment newInstance() {
return new MenuFragment();
}
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_menu, container, false);
imageView = view.findViewById(R.id.imageView);
return view;
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
mViewModel = new ViewModelProvider(this).get(MenuViewModel.class);
imageView.setScaleX(mViewModel.scaleFactor);
imageView.setScaleY(mViewModel.scaleFactor);
// TODO: Use the ViewModel
/**设置动画
*
* alpha（透明度）
* scaleX（X轴缩放）
* scaleY（Y轴缩放）
* rotation（旋转）
* translationX（X轴平移）
* translationY（Y轴平移）
* */
ObjectAnimator objectAnimatorX = ObjectAnimator.ofFloat(imageView, "scaleX", 0);
ObjectAnimator objectAnimatorY = ObjectAnimator.ofFloat(imageView, "scaleY", 0);
objectAnimatorX.setDuration(500);
objectAnimatorY.setDuration(500);
//点击事件
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 判断动画是在运动 objectAnimator.isRunning() 在运动
//!objectAnimator.isRunning()取反
//重新设置缩放
objectAnimatorX.setFloatValues(imageView.getScaleX() + 0.1f);
objectAnimatorY.setFloatValues(imageView.getScaleY() + 0.1f);
mViewModel.scaleFactor += 0.1;
objectAnimatorX.start();
objectAnimatorY.start();
}
});
}
}MenuViewModel.java
package com.example.mybuttomnavigation;
import androidx.lifecycle.ViewModel;
public class MenuViewModel extends ViewModel {
// TODO: Implement the ViewModel
float scaleFactor = 1 ;
}平移：AuthorFragment.java
package com.example.mybuttomnavigation;
import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;
import androidx.lifecycle.ViewModelProvider;
import java.util.Random;
public class AuthorFragment extends Fragment {
private AuthorViewModel mViewModel;
public ImageView imageView;
public static AuthorFragment newInstance() {
return new AuthorFragment();
}
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_author, container, false);
imageView = view.findViewById(R.id.imageView);
return view;
}
@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
mViewModel = new ViewModelProvider(this).get(AuthorViewModel.class);
// TODO: Use the ViewModel
imageView.setX(imageView.getX() + mViewModel.mark);
// TODO: Use the ViewModel
/**设置动画
*
* alpha（透明度）
* scaleX（X轴缩放）
* scaleY（Y轴缩放）
* rotation（旋转）
* translationX（X轴平移）
* translationY（Y轴平移）
* */
ObjectAnimator objectAnimatorX = ObjectAnimator.ofFloat(imageView, "x", 0);
//设置动画500毫秒
objectAnimatorX.setDuration(500);
//点击事件
imageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 判断动画是在运动 objectAnimator.isRunning() 在运动
//!objectAnimator.isRunning()取反
float dx = new Random().nextBoolean() ? 100 : -100;
//重新设置缩放 = 当前值 移动到 ， 当前值 + dx
objectAnimatorX.setFloatValues(imageView.getScaleX(), imageView.getScaleX() + dx);
mViewModel.mark += dx;
objectAnimatorX.start();
}
});
}
}AuthorViewModel.java
package com.example.mybuttomnavigation;
import androidx.lifecycle.ViewModel;
public class AuthorViewModel extends ViewModel {
// TODO: Implement the ViewModel
float mark = 0;
}