Android控件BottomSheet实现底边弹出选择列表

下面是详细讲解 “Android控件BottomSheet实现底边弹出选择列表”的完整攻略。

什么是BottomSheet

BottomSheet是安卓提供的一个UI控件,可以实现在屏幕底部弹出窗口,通常用于展示一些与主要内容相关的操作选项或者附属功能。BottomSheet有两种类型:持续BottomSheet和模态BottomSheet。持续BottomSheet是可以在主UI上同时滚动的,而模态BottomSheet会覆盖主UI的一部分,只有在底部背景上滑动才能关闭。

实现步骤

  1. 在XML布局中定义BottomSheet,设置其样式和高度等属性:
<LinearLayout
  android:id="@+id/bottom_sheet"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="@android:color/white"
  app:behavior_hideable="true"
  app:behavior_peekHeight=“@dimen/bottom_sheet_peek_height”
  app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

  <!-- 在这里添加Bottom Sheet显示的内容 -->

</LinearLayout>

其中app:behavior_hideable是用来控制BottomSheet是否可以隐藏,app:behavior_peekHeight是设置BottomSheet初始高度,app:layout_behavior是BottomSheet在使用时应该绑定的行为。

  1. 创建BottomSheetBehavior,绑定BottomSheet:
LinearLayout bottomSheet = findViewById(R.id.bottom_sheet);
BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);
  1. 设置BottomSheetBehavior的相关属性:
bottomSheetBehavior.setPeekHeight(getResources().getDimensionPixelSize(R.dimen.bottom_sheet_peek_height));
bottomSheetBehavior.setHideable(true);
bottomSheetBehavior.setSkipCollapsed(true);
bottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN);

其中,setPeekHeight()设置卡片最初状态的高度,setHideable()设置是否可以通过手势收缩BottomSheet, setSkipCollapsed()控制当BottomSheet状态为STATE_DRAGGING时,是否跳过折叠状态, 直接变成有设置的peek高度状态。

  1. 监听BottomSheet的状态改变,对BottomSheet进行相应操作:
bottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
    @Override
    public void onStateChanged(@NonNull View bottomSheet, int newState) {
        if (newState == BottomSheetBehavior.STATE_HIDDEN) {
            // BottomSheet已隐藏,执行一些操作
        } else if (newState == BottomSheetBehavior.STATE_EXPANDED) {
            // BottomSheet在完全扩展时执行操作
        } else if (newState == BottomSheetBehavior.STATE_COLLAPSED) {
            // BottomSheet在折叠状态下执行操作
        } else if (newState == BottomSheetBehavior.STATE_DRAGGING) {
            // BottomSheet在拖拽状态下执行操作
        } else if (newState == BottomSheetBehavior.STATE_SETTLING) {
            // BottomSheet在拖拽后自动设置状态时执行操作
        }
    }

    @Override
    public void onSlide(@NonNull View bottomSheet, float slideOffset) {
        // 对拖动中的BottomSheet进行操作
    }
});

我们可以在Callback中监听到BottomSheet的各种状态,并相应进行相应操作。

示例

示例1:BottomSheet实现底部菜单

在BottomSheet中定义菜单项,并为其设置点击事件:

<LinearLayout
  android:id="@+id/bottom_sheet"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="@android:color/white"
  app:behavior_hideable="true"
  app:behavior_peekHeight=“@dimen/bottom_sheet_peek_height”
  app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

  <TextView
    android:id="@+id/menu_item1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/menu_item1"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

  <TextView
    android:id="@+id/menu_item2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/menu_item2"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

</LinearLayout>

然后在代码中为其设置点击事件,并在BottomSheetCallback中监听其状态:

LinearLayout bottomSheet = findViewById(R.id.bottom_sheet);
BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);

TextView menuItem1 = findViewById(R.id.menu_item1);
menuItem1.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 在此处实现点击事件
    }
});

TextView menuItem2 = findViewById(R.id.menu_item2);
menuItem2.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 在此处实现点击事件
    }
});

bottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
    @Override
    public void onStateChanged(@NonNull View bottomSheet, int newState) {
        if (newState == BottomSheetBehavior.STATE_HIDDEN) {
            // 当BottomSheet隐藏后执行此处代码
        }
    }

    @Override
    public void onSlide(@NonNull View bottomSheet, float slideOffset) {
        // 当BottomSheet在拖拽中时执行此处代码
    }
});

示例2:BottomSheet实现底部分享选择

在BottomSheet中添加分享渠道,分别定义:

<LinearLayout
  android:id="@+id/bottom_sheet"
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="@android:color/white"
  app:behavior_hideable="true"
  app:behavior_peekHeight=“@dimen/bottom_sheet_peek_height”
  app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

  <TextView
    android:id="@+id/share_wechat"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/share_wechat"
    android:drawableLeft="@drawable/ic_wechat"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

  <TextView
    android:id="@+id/share_qq"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/share_qq"
    android:drawableLeft="@drawable/ic_qq"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

  <TextView
    android:id="@+id/share_weibo"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/share_weibo"
    android:drawableLeft="@drawable/ic_weibo"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

  <TextView
    android:id="@+id/cancel_share"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/cancel_share"
    android:textColor="@color/colorPrimary"
    android:padding="16dp"
    android:gravity="center"
    android:background="?android:attr/selectableItemBackground"/>

</LinearLayout>

然后在代码中为其设置点击事件,并在BottomSheetCallback中监听其状态:

LinearLayout bottomSheet = findViewById(R.id.bottom_sheet);
BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);

TextView shareWechat = findViewById(R.id.share_wechat);
shareWechat.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 在此处实现分享到微信代码
    }
});

TextView shareQQ = findViewById(R.id.share_qq);
shareQQ.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 在此处实现分享到QQ代码
    }
});

TextView shareWeibo = findViewById(R.id.share_weibo);
shareWeibo.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 在此处实现分享到微博代码
    }
});

TextView cancelShare = findViewById(R.id.cancel_share);
cancelShare.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        bottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN);
    }
});

bottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
    @Override
    public void onStateChanged(@NonNull View bottomSheet, int newState) {
        if (newState == BottomSheetBehavior.STATE_HIDDEN) {
            // 当BottomSheet隐藏后执行此处代码
        }
    }

    @Override
    public void onSlide(@NonNull View bottomSheet, float slideOffset) {
        // 当BottomSheet在拖拽中时执行此处代码
    }
});

当我们点击分享按钮后,BottomSheet被展开,当取消分享时,可以通过设置BottomSheet为隐藏状态来关闭BottomSheet。 同时使用setPeekHeight()通过改变BottomSheet的高度,控制BottomSheet的展示状态。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:Android控件BottomSheet实现底边弹出选择列表 - Python技术站

(0)
上一篇 2023年5月30日
下一篇 2023年5月30日

相关文章

  • HTML5 微格式和相关的属性名称

    HTML5 微格式是指用于表示特定类型数据的 HTML 标记,在页面进行结构化、扩展和语义化时有重要的作用。而与此相关的属性名称是指用于表达微格式中特定意义的属性名称,使得浏览器和搜索引擎可以将页面中的数据转换成标准的格式并更好的理解页面内容。下面是 HTML5 微格式和相关属性名称的详细讲解攻略。 HTML5 微格式 HTML5 微格式是指用于标识网页内容…

    html 2023年5月30日
    00
  • Android简单实现引导页

    1. 引言 引导页是App开发中常见的功能之一,它通常会在用户第一次进入App时展示。引导页一般用来介绍App的功能、特点,或者是展示一些美观的图片,使用户对App有更直观的感受。Android的开发者可以利用ViewPager和Fragment来实现引导页的功能。 2. 实现步骤 2.1 在布局文件中添加ViewPager控件 在布局文件中添加一个View…

    html 2023年5月30日
    00
  • Fluent Mybatis快速入门详细教程

    Fluent Mybatis是一个基于Mybatis框架的ORM(对象关系映射)库,它提供了一种更加流畅、直观的方式来操作数据库。下面是完整的Fluent Mybatis快速入门攻略: 安装和配置 在pom.xml文件中添加以下依赖: <dependency> <groupId>org.mybatis.spring.boot</…

    html 2023年5月30日
    00
  • XML简易教程之二

    下面是关于 “XML简易教程之二”的完整攻略: 1. 什么是XML Schema? XML Schema是一种用于文档结构描述和数据有效性验证的语言。它可以用来定义和约束一个文档的元素、属性、类型和关系等方面的特征,同时也可以描述所约束的文档必须满足的规则和限制条件,从而让这些文档具有更高的整体质量和可读性。 2. XML Schema的语法规则 我们知道,…

    html 2023年5月30日
    00
  • win11开机乱码怎么办?win11开机乱码解决方法

    下面我将详细讲解“win11开机乱码怎么办?win11开机乱码解决方法”的完整攻略。 问题描述 在使用win11操作系统的过程中,有可能会出现开机界面出现乱码的情况。那么这个问题该如何解决呢? 解决方法 以下是三种解决方法,供大家参考: 方法一:更改拓展字符集为中文 在开机状态下,按下win+R组合键,打开“运行”窗口; 在输入框中输入“regedit”命令…

    html 2023年5月31日
    00
  • iOS开发中常见的解析XML的类库以及简要安装方法

    当我们在 iOS 开发中需要解析 XML 数据时,常见的解析类库有 NSXMLParser、XPathQuery、GDataXMLNode、XMLDictionary 等。下面将简要介绍这些类库,以及它们的安装方法和使用场景。 1. NSXMLParser NSXMLParser 是 iOS 系统内置的解析 XML 数据的类库,可以边解析边处理,不会一次性将…

    html 2023年5月30日
    00
  • Vbs脚本经典教材(最全的资料还是MSDN)

    Vbs脚本经典教材(最全的资料还是MSDN) 完整攻略 介绍 Vbs脚本是一种常用的可以在Windows环境下运行的脚本语言,通常用于简化日常重复操作、自动化任务等。MSDN作为一个官方文档,提供了完整的Vbs脚本教程和资料,可以帮助初学者快速入门和了解Vbs脚本的基本语法、功能、用法和应用场景。 使用步骤 以下为使用MSDN获取Vbs脚本经典教材的完整攻略…

    html 2023年5月30日
    00
  • 如何拍好月亮?拍摄月亮要做什么准备?

    以下是“如何拍好月亮?拍摄月亮要做什么准备?”的完整攻略: 如何拍好月亮?拍摄月亮要做什么准备? 月亮是一个非常美丽的天体,拍摄月亮可以得到非常漂亮的照片。下面是一些拍摄月亮的技巧和准备工作,可以帮助用户拍摄出高质量的月亮照片。 技巧1:选择合适的拍摄时间 用户需要选择合适的拍摄时间。月亮的亮度和位置会随着时间的变化而变化。用户可以在月亮升起或落下的时候拍摄…

    html 2023年5月18日
    00
合作推广
合作推广
分享本页
返回顶部