天道酬勤,学无止境

Removing the extra top space in CoordinatorLayout- Android

I am trying to use BottomSheetBehavior to make a layout similar to what google maps is providing. I am successful in using the BottomSheetBehavior and create slide up layout. The problem I am having now is CordinatorLayout takes extra space even when my layout is collapsed. Below is a screenshot of my layout.

  • White background in my main activity layout
  • Pink is my collapsed layout with peekHeight
  • And the grey background is the one which should be transparent but takes the extra space.

My main layout file

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_height="wrap_content">

    <include layout="@layout/sample_coordinator" />
</FrameLayout>

CordinatorLayout with BottomSheetBehavior

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/common_google_signin_btn_text_light_disabled">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:behavior_hideable="false"
    app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:background="@color/colorPrimary" />

</FrameLayout>

评论

You have to use CoordinatorLayout in your activity layout. Then in your bottom sheet layout insert these lines:

app:behavior_hideable="true"
app:behavior_peekHeight="Xdp"

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • Removing the extra space from Top of BottomSheet
    I added bottomsheet in my application.ii work good but only problem is extra space it cover and I just want to remove those extra spaces on the top of Bottomsheet layout. I want to remove the highlighted part: How I can remove those extra spaces? Here is my XML <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout 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
  • 从BottomSheet的顶部删除多余的空间(Removing the extra space from Top of BottomSheet)
    问题 我在我的 application.ii 中添加了 bottomsheet 效果很好,但唯一的问题是它覆盖了额外的空间,我只想删除 Bottomsheet 布局顶部的那些额外空间。 我想删除突出显示的部分: 我如何删除那些额外的空格? 这是我的 XML <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true" android:id="@+id/coordinatorLayout" tools:context=".MainActivity"> <include layout="@layout/content_main" />
  • 通过FragmentTransaction添加的片段的fitsSystemWindows效果消失了(fitsSystemWindows effect gone for fragments added via FragmentTransaction)
    问题 我有一个带有导航抽屉和全出血片段的活动(顶部的图像必须出现在Lollipop上的半透明系统栏的后面)。 当我有一个临时解决方案时,仅通过在Activity的XML中使用<fragment>标记就可以使Fragment膨胀,但是看起来不错。 然后,我不得不用<FrameLayout>替换<fragment>并执行片段事务,现在尽管在所有必需的层次结构fitsSystemWindows设置为true ,该片段都不再出现在系统栏后面。 我相信<fragment>如何在Activity的布局内膨胀和单独膨胀之间可能会有一些差异。 我在Google上搜索并找到了KitKat的一些解决方案,但这些解决方案都不适合我(棒棒糖)。 activity.xml <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/drawer_layout" android:layout_height="match_parent" android:layout_width="match_parent" android
  • 删除 TextInputLayout 额外的顶部填充(Removing TextInputLayout extra top padding)
    问题 TextInputLayout 似乎总是在顶部有一些额外的填充(无论所有边距/填充都设置为 0): 布局如下: <android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.v7.widget.AppCompatEditText android:id="@+id/txt_amount" style="@style/EditTextStyle" android:hint="@string/hint_amount" android:inputType="numberDecimal"/> </android.support.design.widget.TextInputLayout> 如何删除这个额外的空间? 回答1 您可以通过将app:hintEnabled="false"为 TextInputLayout 来删除 AppCompatEditText 上方的额外空间,但在您重新启用之前它不会显示提示。 有关更多信息,请访问 Android 开发者网站 -TextInputLayout 结帐下面的代码 <android.support.design.widget
  • Removing TextInputLayout extra top padding
    TextInputLayout seems to always have some extra padding at the top (no matter that all margins/paddings are set to 0): The layout looks like: <android.support.design.widget.TextInputLayout android:layout_width="match_parent" android:layout_height="wrap_content"> <android.support.v7.widget.AppCompatEditText android:id="@+id/txt_amount" style="@style/EditTextStyle" android:hint="@string/hint_amount" android:inputType="numberDecimal"/> </android.support.design.widget.TextInputLayout> How to remove this extra space?
  • CoordinatorLayout 移动内容(CoordinatorLayout moves content)
    问题 我有一个 CoordinatorLayout、AppBarLayout、Toolbar 和 NestedScrollview 形式的主要内容和里面的东西: <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" > <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" > <android.support.v7.widget.Toolbar android:layout
  • recyclerView takes lots of space from top after use SpannedgridLayoutManager
    i want to show list data in SpannedGridLayoutManager in recycleview, but after add helper class SpannedGridLayoutmanager, in my recycleview take a lot of space in top iam has to try change SpannedGridLayoutManager class with other SpannedGridlayout manager, but the space on top is not solved val manager = SpannedGridLayoutManager(object : SpannedGridLayoutManager.GridSpanLookup{ override fun getSpanInfo(position: Int): SpannedGridLayoutManager.SpanInfo { // Conditions for 2x2 items return if (position % 12 == 0 || position % 12 == 7) { SpannedGridLayoutManager.SpanInfo(2, 2) } else {
  • CoordinatorLayout 孩子不是全屏的(CoordinatorLayout children are not fullscreen)
    问题 我有一个全屏显示的Activity 。 这与我尝试过的许多布局完美配合,除了CoordinatorLayout是根ViewGroup 。 CoordinatorLayout本身的宽度和高度都设置为match_parent并且它应该占据整个屏幕。 但是应该与CoordinatorLayout具有相同大小的子视图被放置,就好像导航栏仍然可见一样。 有没有办法使用CoordinatorLayout使子视图调整大小? 显然fitSystemWindows不会改变任何事情,因为这可能是由CoordinatorLayout实现引起的,其他ViewGroups工作良好。 我试图创建自定义Behavior类,但我没有成功。 我使用此代码使我的Activity全屏显示: @Override protected void onResume() { super.onResume(); int uiOptions = View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION | View.SYSTEM_UI_FLAG_FULLSCREEN |
  • 带有自定义视图的 CollapsingToolbarLayout(CollapsingToolbarLayout with a custom view)
    问题 我正在尝试使用自定义视图实现 CollapsingToolbarLayout,但我无法做到: 我想做什么(抱歉,我不能发布图片,所以它在 imgur 上): 展开后,标题是带有图像和标题的个人资料屏幕 未展开(滚动时),图像和标题将在工具栏上 但是我看到的一切都没有像我预期的那样工作 我是这个和棒棒糖动画的新手,所以如果有人能帮助我,我将不胜感激! (我不发布示例代码,因为我没有与发布相关的内容) 回答1 我的解决方案 我有同样的场景要实现,所以我从狗的例子开始,做了一些改变,让它像你描述的那样工作。 我的代码可以作为该项目的 fork 找到,请参阅 https://github.com/hanscappelle/CoordinatorBehaviorExample 最重要的变化是布局: <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" > <android
  • 带有 AppBarLayout 的 CoordinatorLayout 自定义行为(CoordinatorLayout custom behavior with AppBarLayout)
    问题 我试图在设置页面上实现与 Telegram 类似的行为,也就是说,有一个 CircleImage,向上滚动时转到顶部栏标题的左侧,向下滚动时转到展开的 AppBarLayout 的中间. 我的工作基于这个例子: https://github.com/saulmm/CoordinatorBehaviorExample 但在这种情况下,原始编码器将重新创建 Topbar 两次。 我不想这样做,顶栏的默认行为是我需要的,而且我想利用开箱即用的汉堡菜单和选项菜单。 这是我的视图层次结构: DrawerLayout | |---CoordinatorLayout |--AppBarLayout | |-CollapsingToolbarLayout | |-ImageView (backdrop image) | |-Toolbar |--NestedScrollView |--ImageView (circleimage avatar) 如您所见,我无法使 Toolbar 布局成为我的 CircleImage 的兄弟,因此我无法在layoutDependsOn方法layoutDependsOn它们绑定在一起。 我尝试绑定到 AppBarLayout,将我的代码基于 github 存储库中的代码,但说实话,我无法理解原始代码中发生的事情。 回答1 我的行为与扫罗的行为方式大致相同。
  • NestedScrollView scrolls to top on Recyclerview resized
    I have a NestedScrollView containing a LinearLayout and a RecyclerView (both inside a RelativeLayout). <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/scroll"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/lay_account">
  • How to remove top border shadow from ActionBar
    I am working on a new Android app and for some reason, this new app (with no extra code added by myself) has a TOP border shadow on the actionbar. It seems as though it was added by default when I created a new project using Android Studio. How do I just have a normal actionbar with only a bottom shadow? I have tried searching for a solution, however, all the results have people asking how to remove the bottom shadow. Usually with very specific code snippets which will remove all shadows from it, which I don't want. Edit: main_activity.xml: <?xml version="1.0" encoding="utf-8"?> <android
  • 当searchview成为焦点时,Android appcompat工具栏会拉伸(Android appcompat toolbar stretches when searchview gets focus)
    问题 我正在更新应用程序以使用新的Toolbar而不是常规的ActionBar 。 在我的应用程序中,用户必须能够从他们的联系人列表中选择一个联系人。 为此,我已将SearchView添加到菜单中。 联系人已经在列表中; SearchView用于使用ArrayAdapter.getFilter()方法过滤列表。 使用ActionBar一切都可以正常工作,但是Toolbar的高度被拉伸到了键盘的正后方。 使用Android设备监视器中的XML检查,我可以看到ListView存在于键盘后面。 似乎SearchView似乎要显示建议,但是我没有配置任何东西。 知道出了什么问题吗? 这些图像说明了问题。 它们显示SearchView的正常,扩展和集中状态。 这是我的XML菜单: <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/action_forwarding_contact_search" app:showAsAction="always" android:title="
  • 将快餐栏移至底部栏上方(Move snackbar above the bottom bar)
    问题 我在使用新的底部栏时遇到了一些问题。 我不能强迫将快餐栏移动到底部栏上方(这是设计准则告诉我的方式,应该是https://www.google.com/design/spec/components/bottom-navigation.html#bottom-navigation-specs )。 这是我的activity_main.xml <?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" tools:openDrawer="start"> <include layout="@layout
  • 片段或活动中带有工具栏的协调器布局(Coordinator Layout with Toolbar in Fragments or Activity)
    问题 有了新的设计库,有几个新的布局会极大地改变开发人员希望的工具栏行为。 由于不同的片段具有不同的行为和目标,例如画廊片段带有折叠的工具栏,可显示重要的照片,或者片段没有滚动视图,而该片段不需要使用appbarlayout即可隐藏工具栏,因此在活动中只有一个工具栏可以证明是困难的。 因此,我应该将工具栏移动到每个片段吗? 如果是这样,我每次显示一个片段时都必须设置supportActionBar,并且还要对该片段中的活动进行引用,这会使片段的独立性无效。 如果仅将工具栏留在“活动”中,则必须为每个片段中的每种行为类型定义多个布局。 最好的方法是什么? 回答1 对我来说,听起来很奇怪,每个片段中都没有appbar和工具栏。 因此,我选择了在活动中具有工具栏的单个应用栏。 要解决CoordinatorLayout的问题,您将必须设置FrameLayout (或任何其他Layout)的不同行为,这些行为应该包含要覆盖默认行为的每个片段中的片段。 假设您的默认行为是app:layout_behavior="@string/appbar_scrolling_view_behavior" 然后,在fragment_activity_layout.xml中,您可能会有类似的内容: <android.support.design.widget.CoordinatorLayout android
  • 如何像 FloatingButton 一样在 Snackbar 上方移动视图(How to move a view above Snackbar just like FloatingButton)
    问题 我有一个线性布局,当出现 Snackbar 时我想向上移动。 我看到了很多示例如何使用 FloatingButton 来做到这一点,但是常规视图呢? 回答1 您需要向 LinearLayout 添加行为并将其嵌入到 CoordinatorLayout 中。 你可能想阅读这个:http://alisonhuang-blog.logdown.com/posts/290009-design-support-library-coordinator-layout-and-behavior 回答2 我将详细说明已批准的答案,因为我认为有一个比那篇文章提供的更简单的实现。 我无法找到处理通用视图移动的内置行为,但这是一个很好的通用选项(来自 http://alisonhuang-blog.logdown.com/posts/290009-design-support -library-coordinator-layout-and-behavior 链接在另一条评论中): import android.content.Context; import android.support.annotation.Keep; import android.support.design.widget.CoordinatorLayout; import android.support.design
  • BottomNavigationView with FloatingActionButton inside CoordinatorLayout dont match position
    I want to hide my bottom bar on scroll but a FAB should stay on the screen. If I put the FAB on top of BottomNavigationView using anchors but it appears behind it. If I put layout_insetEdge="bottom" to the BottomNavigationView then it works but make my tests fail (https://issuetracker.google.com/issues/70162122) so I cannot use that at the moment. Layout: <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com
  • NestedScrollView 在 Recyclerview 调整大小时滚动到顶部(NestedScrollView scrolls to top on Recyclerview resized)
    问题 我有一个 NestedScrollView 包含一个 LinearLayout 和一个 RecyclerView (都在一个 RelativeLayout 内)。 <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/scroll"> <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/lay_account"> <LinearLayout
  • BottomSheetView 中的 animateLayoutChanges="true" 显示意外行为(animateLayoutChanges=“true” in BottomSheetView showing unexpected behaviour)
    问题 我有一个BottomSheetView ,它有animateLayoutChanges="true" 。 最初它显示得很好。 但是,如果将视图的visibility (在BottomSheetView )从GONE更改为VISIBLE ,应用程序会搞乱计算并且我的BottomSheetView移动到屏幕顶部。 我试过在BottomSheetView布局的根部设置layout_gravity=bottom 。 但没有成功。 在更改任何视图的可见性之前,这里有我的BottomSheetView的图像。 (点击图片查看全尺寸) 在我更改视图的可见性( GONE到VISIBLE或VISIBLE到GONE )后,我的 BottomSheetView 移动到顶部。 (点击图片查看全尺寸) 我猜,Android 在计算视图width和height的测量时搞砸了。 有什么办法解决这个吗?? 我还尝试使我的 BottomSheetView 完全扩展以匹配父视图,但不知何故,这使BottomSheetView的height比手机屏幕长,并且会造成滚动问题。 预期解决方案: 1> 防止BottomSheetView改变其位置,即使视图的visibility改变。 或者 2> 使BottomSheetView匹配父BottomSheetView这样它在计算混乱后不会看起来很糟糕。 回答1
  • 如何将顶视图折叠成较小尺寸的视图?(How to have a collapsing of top view into a smaller sized view?)
    问题 这个问题之前在这里以过于宽泛和不清楚的方式被问到,所以我已经使它更加具体,并提供了我尝试过的完整解释和代码。 背景 我需要模仿 Google 日历在顶部有一个视图的方式,它可以设置动画并向下推底部的视图,但它有额外的不同行为。 我总结了我正在尝试做的 3 个特征: 按下工具栏上的总是有效的,可以切换顶部视图的展开/折叠,同时有一个改变其旋转的箭头图标。 这就像在 Google 日历应用上一样。 顶视图将始终对齐,就像在 Google 日历应用中一样。 当顶视图折叠时,只有按下工具栏才能展开它。 这就像在 Google 日历应用上当顶视图展开时,在底视图滚动将只允许折叠。 如果您尝试向另一个方向滚动,则不会发生任何事情,甚至不会滚动到底部视图。 这就像在 Google 日历应用上折叠后,顶视图将替换为较小的视图。 这意味着它总是会在底部视图上方占据一些空间。 这与 Google 日历应用程序不同,因为在日历应用程序中,一旦折叠顶部视图,它就会完全消失。 Google 日历应用程序如下所示: 在底部视图上滚动也会慢慢隐藏顶部的视图: 问题 使用我过去发现的各种解决方案,我成功地仅实现了所需行为的一部分: 在工具栏中有一些 UI 是通过在其中包含一些视图来完成的,包括箭头视图。 对于手动展开/折叠,我在AppBarLayout视图上使用setExpanded 。 对于箭头的旋转