- 微信
- 微博
  
  分享文章到微博
- 复制链接
  
  复制链接到剪贴板

工具栏,底部导航栏,可扩展列表视图

tea_year 发表于 2021/12/22 23:34:03 2021/12/22

【摘要】 1.工具栏这个概念，所接触的很多开发软件或工具，都会碰到。在手机开发的时候，可以进行导航、显示相应的标题等，使开发者不至于在应用程序中迷路。5.0使用Actionbar来实现，很多公司都会对该类进行定...

1.工具栏

这个概念，所接触的很多开发软件或工具，都会碰到。在手机开发的时候，可以进行导航、显示相应的标题等，使开发者不至于在应用程序中迷路。5.0使用Actionbar来实现，很多公司都会对该类进行定制，使用起来更加灵活。5.0之后使用Toolbar来取代之前的Actionbar，这个更加强大。

1.1 Toolbar类

1.显示程序所处的位置。

2.提供一些重要的交互功能，比如说搜索、跳转等。

3.实现导航功能，例如返回按钮等。

常用属性和方法：

app:title setTitle(参数) 设置应用程序主题

app:subtitle setSubtitle(参数) 设置小标题

app:navigation setNavigation(int resId) 导航图标

logo setLogo(Drawable drawable) 程序logo

titleTextColor setTitleTextColor(int color) 设置标题文字颜色

1.设计主界面.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <!--    加入工具栏;android.support.v7.wideget.Toolbar-->
    <Toolbar
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/toolbar"
        android:background="#9f9f9f"></Toolbar>
</LinearLayout>

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15

2.设计菜单xml文件

步骤：

在res上右击，选择“new/andorid Resource Directory”，在弹出的对话框中，设置ResourceType为Menu,Directory Name采用默认值，即可创建menu文件夹。

在menu上右击，选择“new/menu Resourcefile”，输入文件名。

<?xml version="1.0" encoding="utf-8"?>
<!--这里是以menu开头的自定义标签-->
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <!--    创建4个小选项;showAsAction:ifRoom
        ifRoom:表示有位置才显示；always:总是显示在界面上；never:从不显示在界面上;
    -->
    <item
        android:icon="@mipmap/sousuo"
        android:title="搜索"
        android:id="@+id/action_find"
        app:showAsAction="ifRoom"/>
    <item
        android:icon="@mipmap/fenxiang"
        android:id="@+id/fenxiang"
        android:title="分享"
        app:showAsAction="ifRoom"/>
    <item
        android:title="设置"
        android:id="@+id/item1"
        app:showAsAction="never"/>
    <item
        android:title="关于"
        android:id="@+id/item2"
        app:showAsAction="never"/>
</menu>

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26

3.修改主界面后台代码

package com.aaa.toolbardemo;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.widget.Toolbar;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //----------------------------------------
        Toolbar toolbar=(Toolbar) findViewById(R.id.toolbar);
        //导航加一个后退
        toolbar.setNavigationIcon(R.mipmap.houtui);
        toolbar.setTitle("首页");
        toolbar.setTitleTextColor(Color.WHITE);
        //声明菜单文件
        toolbar.inflateMenu(R.menu.base_toolbar_menu);
    }
}

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24

2.底部导航栏

手机程序：QQ 拼夕夕微信等，都会在程序下方放置导航。好处是可以进行单手操作，即用户单手完成界面切换，从而查看不同的信息。

2.1 BottomNavigationView类

用到了Fragment的知识，每个item都有一个icon和一个title组成，单击控制状态即可。

通话（电话）通信录设置

3.可扩展列表视图

一般用于数据的展开和折叠这种场景，即可以单独展开的列表视图。

ExpandableListView,是ListView的子类。本质上是一个AdapterView,既然是AdapterView,在显示数据的时候，就需要使用到适配器。适配器叫ExpandableAdapter,这个类派生于BaseExpandableListAdapter,需要重写setOnGroupClickListener()、setOnChildClickListener()、setOnGroupCollpaseListener()、setOnGroupExpandListener()方法。

实例

展示河南省、陕西省行政区信息的实例。

1.修改主界面

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">
<!--    主界面就是可扩展列表;android:groupIndicator="@null" 取值可以是任意的Drawable对象，不再显示groupIndicator -->
    <ExpandableListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/expand_list"
        android:groupIndicator="@null"/>

</LinearLayout>

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16

2.父项列表内容

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="#3f60CC"
    android:layout_height="50dp">
    <!-- 设计列表项的布局   -->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:id="@+id/parent_tv"
        android:textColor="#fff"
        android:gravity="center_vertical"
        android:paddingLeft="10dp"
        android:textSize="18sp"/>
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/parent_img"
        android:layout_alignParentRight="true"
        android:src="@mipmap/right"
        android:paddingRight="10dp"/>
</RelativeLayout>

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22

3.子项列表内容

<?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">
    <!--    设计列表项的具体数据的布局-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:id="@+id/children_item"
        android:gravity="center_vertical"
        android:paddingLeft="10dp"/>
</LinearLayout>

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12

4.主界面后台代码

package com.aaa.expanddemo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.ExpandableListView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    //1.变量 对象
    ExpandableListView expand_list_id;
    String[]groups={"河南省","陕西省"};
    String[][]childs={{"郑州市","安阳市","驻马店市"},{"西安市","咸阳市","宝鸡市"}};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //--------------------------------------
        initView();//  这个是自定义的方法
    }

    private void initView() {
        expand_list_id=(ExpandableListView)findViewById(R.id.expand_list);
        ExpandableListViewAdapter adapter=new ExpandableListViewAdapter(this,groups,childs);
        expand_list_id.setAdapter(adapter);
        expand_list_id.expandGroup(0);
        //监听事件
        expand_list_id.setOnGroupClickListener(new ExpandableListView.OnGroupClickListener() {
            @Override
            public boolean onGroupClick(ExpandableListView expandableListView, View view, int groupPosition, long l) {
                Toast.makeText(MainActivity.this, "你单击了"+groups[groupPosition], Toast.LENGTH_LONG).show();
                return false;
            }
        });

        //监听事件2
        expand_list_id.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView expandableListView, View view, int groupPosition, int childPosition, long l) {
                Toast.makeText(MainActivity.this, "你单击了"+childs[groupPosition][childPosition], Toast.LENGTH_LONG).show();
                return false;
            }
        });
        //监听事件3
        expand_list_id.setOnGroupCollapseListener(new ExpandableListView.OnGroupCollapseListener() {
            @Override
            public void onGroupCollapse(int groupPosition) {
                Toast.makeText(MainActivity.this, "你收缩了"+groups[groupPosition], Toast.LENGTH_LONG).show();
            }
        });
        //监听4
        expand_list_id.setOnGroupExpandListener(new ExpandableListView.OnGroupExpandListener() {
            @Override
            public void onGroupExpand(int groupPosition) {
                Toast.makeText(MainActivity.this, "你展开了"+groups[groupPosition], Toast.LENGTH_LONG).show();
            }
        });
    }
}

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54
  55
  56
  57
  58
  59
  60
  61

5.子项扩展代码

package com.aaa.expanddemo;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class ExpandableListViewAdapter extends BaseExpandableListAdapter {
    //1.成员变量
    private String[]groups;
    private String[][]childs;
    private Context context;

    //构造方法，和IDEA一样。
    public ExpandableListViewAdapter(Context context,String[] groups, String[][] childs) {
        this.groups = groups;
        this.childs = childs;
        this.context = context;
    }

    @Override
    public int getGroupCount() {
        return groups.length;
    }

    @Override
    public int getChildrenCount(int i) {
        return childs[i].length;
    }

    @Override
    public Object getGroup(int i) {
        return groups[i];
    }

    @Override
    public Object getChild(int i, int i1) {
        return childs[i][i1];  //?
    }

    @Override
    public long getGroupId(int i) {
        return i;
    }

    @Override
    public long getChildId(int i, int i1) {
        return i1;
    }

    @Override
    public boolean hasStableIds() {
        return true;
    }

    /**
     * 用于加载并显示列表项元素。
     * @param groupPosition   为组位置
     * @param isExpanded       是否折叠或伸缩状态
     * @param convertView      重用已经的视图对象
     * @param parent            返回视图所衣服的视图组。
     * @return
     */
    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        TextView tv_grouptext;
        ImageView img_group;
        convertView= LayoutInflater.from(parent.getContext()).inflate(R.layout.expand_parent_item,parent,false);
        tv_grouptext=convertView.findViewById(R.id.parent_tv);
        img_group=convertView.findViewById(R.id.parent_img);
        tv_grouptext.setText(groups[groupPosition]);

        if(isExpanded)
            img_group.setImageResource(R.mipmap.down);
        else
            img_group.setImageResource(R.mipmap.right);

        return convertView;
    }

    /**
     * 重写getChildView()方法.
     * isLastChild:表示是否为最后一项列表数据。
     * @param groupPosition
     * @param childPosition
     * @param isLastChild
     * @param convertView
     * @param parent
     * @return
     */
    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {
        //映射列表数据使用的布局文件
        convertView=LayoutInflater.from(parent.getContext()).inflate(R.layout.expand_children_item,parent,false);
        //获取列表数据对应的控件
        TextView tv_children_item=(TextView) convertView.findViewById(R.id.children_item);
        //显示列表数据
        tv_children_item.setText(childs[groupPosition][childPosition]);
        return convertView;
    }

    @Override
    public boolean isChildSelectable(int i, int i1) {
        return true;
    }
}

  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9
  10
  11
  12
  13
  14
  15
  16
  17
  18
  19
  20
  21
  22
  23
  24
  25
  26
  27
  28
  29
  30
  31
  32
  33
  34
  35
  36
  37
  38
  39
  40
  41
  42
  43
  44
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54
  55
  56
  57
  58
  59
  60
  61
  62
  63
  64
  65
  66
  67
  68
  69
  70
  71
  72
  73
  74
  75
  76
  77
  78
  79
  80
  81
  82
  83
  84
  85
  86
  87
  88
  89
  90
  91
  92
  93
  94
  95
  96
  97
  98
  99
  100
  101
  102
  103
  104
  105
  106
  107
  108
  109

6.程序运行效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AIV9upcz-1634471942405)(asseits/image-20211008201729316.png)]

TextView tv_children_item=(TextView) convertView.findViewById(R.id.children_item);
//显示列表数据
tv_children_item.setText(childs[groupPosition][childPosition]);
return convertView;
}

@Override
public boolean isChildSelectable(int i, int i1) {
    return true;
}

  
 
  1
  2
  3
  4

}


### 6.程序运行效果

![在这里插入图片描述](https://img-blog.csdnimg.cn/7e51d38fcadc40e3a254227d7da75586.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAdGVhX3llYXI=,size_20,color_FFFFFF,t_70,g_se,x_16#pic_center)



![在这里插入图片描述](https://img-blog.csdnimg.cn/0402872db558469d8d1392c07aae1765.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAdGVhX3llYXI=,size_20,color_FFFFFF,t_70,g_se,x_16#pic_center)


  
 
  1
  2
  3
  4
  5
  6
  7
  8
  9

文章来源: aaaedu.blog.csdn.net，作者：tea_year，版权归原作者所有，如需转载，请联系作者。

原文链接：aaaedu.blog.csdn.net/article/details/120815226

点赞
收藏
关注作者

0/1000

抱歉，系统识别当前为高风险访问，暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称，即可参与社区互动！

*长度不超过10个汉字或20个英文字符，设置后3个月内不可修改。

确认取消

加入云驻计划，成为创作者

华为云周边好礼
免费体验产品
特殊身份标识
线下官方门票
内部专家零距离
与10000+优质创作者共同成长

立即加入

工具栏,底部导航栏,可扩展列表视图

1.工具栏

1.1 Toolbar类

1.设计主界面.xml

2.设计菜单xml文件

3.修改主界面后台代码

2.底部导航栏

2.1 BottomNavigationView类

3.可扩展列表视图

1.修改主界面

2.父项列表内容

3.子项列表内容

4.主界面后台代码

5.子项扩展代码

6.程序运行效果

全部回复

设置昵称

关于作者

目录

加入云驻计划，成为创作者

工具栏,底部导航栏,可扩展列表视图

1.工具栏

1.1 Toolbar类

1.设计主界面.xml

2.设计菜单xml文件

3.修改主界面后台代码

2.底部导航栏

2.1 BottomNavigationView类

3.可扩展列表视图

1.修改主界面

2.父项列表内容

3.子项列表内容

4.主界面后台代码

5.子项扩展代码

6.程序运行效果

全部回复

设置昵称

关于作者

目录

加入云驻计划，成为创作者

推荐阅读

相关产品