ActionBar总结1_实现menu,Navigate up

本文介绍了如何在Android应用中使用Action Bar创建菜单,包括如何在菜单中添加按钮并响应用户操作,以及如何利用App图标进行向上导航。文章详细解释了在AndroidManifest.xml中设置逻辑父活动以实现向上导航,并提供了在Activity中处理向上按钮响应的方法。

例子见资源(不需要资源积分)

主要内容:

  1. 使用action bar的menu

  2. Navigating Up with the App Icon

使用action bar的menu

效果: 
enter image description here


实现:

  • 在menu资源中创建一个xml,添加action buttons到action bar中

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
     >
    <item
        android:id="@+id/search"
        android:title="@string/search"
        android:icon="@drawable/ic_action_search"
        android:showAsAction="ifRoom"/>
    <item
        android:id="@+id/share"
        android:icon="@drawable/ic_action_share"
        android:title="@string/share"
        android:showAsAction="never"/>
</menu>
  • Activity的onCreateOptionsMenu()使用创建的xml

public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater inflater = getMenuInflater();
        inflater.inflate(R.menu.action_button, menu);
        return super.onCreateOptionsMenu(menu);
 }
  • 响应action buttons

 public boolean onOptionsItemSelected(MenuItem item) {
        // TODO Auto-generated method stub
        switch (item.getItemId()) {
        case R.id.search:
            /*点击 seace action button时做相应处理的代码*/
            return true;
        case R.id.share:
            /*点击 share action button时做相应处理的代码*/
            return true;
        default:            
            return onOptionsItemSelected(item);
        }   
 }

注意:

  • 使用action bar要包含Theme.Holo相关的theme。

  • 上面代码要求android:minSdkVersion不小于11,为了支持低版本的设备,可以参阅“官方资料链接”的内容。


效果: 
enter image description here


当按下标题栏中的“<” 就会回到原来的页面

实现:

  • 在AndroidManifest.xml中设置logical parent

  <!--从android4.1开始你可以通过android:parentActivityName属性来指定每个activity的 logical parent 
      在4.1以下版本,使用 <meta-data/>标签来指定,如下: 
  -->
  
  <activity
        android:name="com.actionbar.addactionbuttons_android11.NavigateUpActivity"
        android:label="@string/title_activity_navigate_up" >
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value="com.actionbar.addactionbuttons_android11.ActionButtonActivity" />
  </activity>
  • 调用setDisplayHomeAsUpEnabled()来开启up button

public class NavigateUpActivity extends Activity {
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_navigate_up);

        //To allow Up navigation with the app icon in the action bar
        getActionBar().setDisplayHomeAsUpEnabled(true);
 }
  • 在Activity的onOptionsItemSelected()方法中设置taction bar’s Up button响应

public boolean onOptionsItemSelected(MenuItem item) {
        // TODO Auto-generated method stub
        switch (item.getItemId()) {
        case android.R.id.home:
            //Respond to the action bar's Up/Home button
             NavUtils.navigateUpFromSameTask(this);
             return true;
        }
        return super.onOptionsItemSelected(item);
 }
### 实现带顶部导航栏、底部导航栏和侧滑菜单的Android布局 #### 实现方案(使用DrawerLayout和ViewPager2) ##### 1. 添加依赖(build.gradle) ```groovy dependencies { implementation 'androidx.appcompat:appcompat:1.6.1' implementation 'com.google.android.material:material:1.9.0' implementation 'androidx.constraintlayout:constraintlayout:2.1.4' implementation "androidx.viewpager2:viewpager2:1.0.0" implementation "androidx.drawerlayout:drawerlayout:1.2.0" } ``` ##### 2. 主布局文件(activity_main.xml) ```xml <?xml version="1.0" encoding="utf-8"?> <androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/drawerLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true"> <!-- 主内容区域 --> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <!-- 顶部导航栏 --> <com.google.android.material.appbar.MaterialToolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary" app:title="应用标题" app:menu="@menu/top_menu"> <!-- 左侧按钮 --> <ImageView android:id="@+id/btnLeft" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_menu" android:layout_gravity="start" android:padding="16dp"/> <!-- 中间标题 --> <TextView android:id="@+id/tvTitle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="主标题" android:textSize="18sp" android:textColor="@android:color/white" android:layout_gravity="center"/> <!-- 右侧按钮 --> <ImageView android:id="@+id/btnRight" android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/ic_more" android:layout_gravity="end" android:padding="16dp"/> </com.google.android.material.appbar.MaterialToolbar> <!-- 内容区域 --> <androidx.viewpager2.widget.ViewPager2 android:id="@+id/viewPager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1"/> <!-- 底部导航栏 --> <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottomNav" android:layout_width="match_parent" android:layout_height="wrap_content" app:menu="@menu/bottom_menu"/> </LinearLayout> <!-- 左侧侧滑菜单 --> <com.google.android.material.navigation.NavigationView android:id="@+id/navViewLeft" android:layout_width="280dp" android:layout_height="match_parent" android:layout_gravity="start" app:menu="@menu/nav_left_menu"/> <!-- 右侧侧滑菜单 --> <com.google.android.material.navigation.NavigationView android:id="@+id/navViewRight" android:layout_width="280dp" android:layout_height="match_parent" android:layout_gravity="end" app:menu="@menu/nav_right_menu"/> </androidx.drawerlayout.widget.DrawerLayout> ``` ##### 3. Java代码实现(MainActivity.java) ```java public class MainActivity extends AppCompatActivity { private DrawerLayout drawerLayout; private ViewPager2 viewPager; private NavigationView navViewLeft, navViewRight; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // 初始化视图 drawerLayout = findViewById(R.id.drawerLayout); viewPager = findViewById(R.id.viewPager); navViewLeft = findViewById(R.id.navViewLeft); navViewRight = findViewById(R.id.navViewRight); ImageView btnLeft = findViewById(R.id.btnLeft); ImageView btnRight = findViewById(R.id.btnRight); BottomNavigationView bottomNav = findViewById(R.id.bottomNav); // 设置ViewPager适配器 ViewPagerAdapter adapter = new ViewPagerAdapter(this); viewPager.setAdapter(adapter); // 顶部左侧按钮点击打开左侧菜单 btnLeft.setOnClickListener(v -> drawerLayout.openDrawer(GravityCompat.START)); // 顶部右侧按钮点击打开右侧菜单 btnRight.setOnClickListener(v -> drawerLayout.openDrawer(GravityCompat.END)); // 底部导航与ViewPager联动 bottomNav.setOnItemSelectedListener(item -> { int itemId = item.getItemId(); if (itemId == R.id.nav_home) { viewPager.setCurrentItem(0); } else if (itemId == R.id.nav_dashboard) { viewPager.setCurrentItem(1); } else if (itemId == R.id.nav_notifications) { viewPager.setCurrentItem(2); } return true; }); // ViewPager页面切换时更新底部导航 viewPager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() { @Override public void onPageSelected(int position) { super.onPageSelected(position); bottomNav.getMenu().getItem(position).setChecked(true); } }); // 侧滑菜单项点击事件 navViewLeft.setNavigationItemSelectedListener(item -> { // 处理左侧菜单点击 drawerLayout.closeDrawer(GravityCompat.START); return true; }); navViewRight.setNavigationItemSelectedListener(item -> { // 处理右侧菜单点击 drawerLayout.closeDrawer(GravityCompat.END); return true; }); } // ViewPager2适配器 private static class ViewPagerAdapter extends FragmentStateAdapter { public ViewPagerAdapter(@NonNull FragmentActivity fragmentActivity) { super(fragmentActivity); } @NonNull @Override public Fragment createFragment(int position) { switch (position) { case 0: return new HomeFragment(); case 1: return new DashboardFragment(); case 2: return new NotificationsFragment(); default: return new HomeFragment(); } } @Override public int getItemCount() { return 3; } } } ``` #### 关键实现点说明 1. **布局结构**: - 使用 `DrawerLayout` 作为根布局实现侧滑菜单 - 主内容区域包含顶部工具栏、ViewPager2 和底部导航栏 - 两个 `NavigationView` 分别作为左右侧滑菜单 2. **功能联动**: - 顶部左右按钮控制对应侧滑菜单的开关 - 底部导航与 ViewPager2 页面联动 - 侧滑菜单项点击后自动关闭菜单 3. **适配器实现**: - 使用 `FragmentStateAdapter` 管理 ViewPager2 的页面 - 每个页面对应一个 Fragment 实现内容分离 4. **资源文件**: - 创建 `res/menu` 目录下的菜单文件: - `top_menu.xml`:顶部工具栏菜单 - `bottom_menu.xml`:底部导航菜单 - `nav_left_menu.xml` 和 `nav_right_menu.xml`:左右侧滑菜单 #### 优化建议 1. **手势控制**: ```java // 添加边缘滑动手势 drawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED); ``` 2. **状态栏沉浸**: ```java // 在styles.xml中设置 <item name="android:windowTranslucentStatus">true</item> ``` 3. **菜单动画**: ```xml <!-- 在res/anim中创建动画 --> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="300" android:fromXScale="0.8" android:toXScale="1.0"/> ``` 使用 Jetpack Navigation实现类似布局
最新发布
06-30
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值