如何将卡与禁用的 FAB 重叠?
How to overlap the card with a disabled FAB?
我有一个带有 CardView
和禁用 ExtendedFloatingActionButton
的布局,我以编程方式将其设置为启用,启用该 FAB 时一切正常,但是当我将其设置为禁用时,它会落后于卡.
我尝试通过为 FAB 设置更高的高度来为卡和 FAB 设置高度,但是当它被禁用时它无论如何都会高于..
这是它的样子:
我会显示它重叠,就像启用设置为 true 时一样:
这是我的代码:
<androidx.constraintlayout.widget.ConstraintLayout 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"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="@+id/fabInvia"
android:layout_width="wrap_content"
android:enabled="false"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:contentDescription="@string/invia"
android:text="@string/invia"
android:textColor="#fff"
app:elevation="10dp"
android:translationY="-33dp"
app:fabSize="normal"
app:icon="@drawable/ic_baseline_send"
app:iconTint="#fff"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@+id/cardView" />
<androidx.cardview.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardElevation="5dp"
app:elevation="5dp"
app:cardUseCompatPadding="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
...
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
你可以试试:
- 调换 XML 中的顺序(先是 cardview,然后是 FAB)
- 更改平移-z 值
- 将 fab 放置在约束布局顶部的单独框架布局中
此问题并非仅存在于残障人士 ExtendedFloatingActionButton
,任何其他视图都会有同样的表现。
原因:
因为CardView
有一个特殊的海拔属性app:cardElevation
只能应用于CardView
s,所以translation-z
或app:elevation
属性不会'解决不了这个问题。
解法:
正在将 ExtendedFloatingActionButton
包装成另一个 CardView
。但是需要一些努力才能使 CardView
像它不存在一样,为此您需要:
- 在两个
CardView
上设置完全相同的 app:cardElevation
(这实际上解决了您遇到的海拔问题。
- 为新
CardView
设置透明背景颜色,app:cardBackgroundColor="@android:color/transparent"
出于某种原因不起作用,但以编程方式解决此问题:
cardView2.setBackgroundColor(ContextCompat.getColor(this, android.R.color.transparent));
也将constraints/margin从ExtendedFloatingActionButton
转移到外CardView
这是一个示例
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<androidx.cardview.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="200dp"
app:cardElevation="5dp"
app:cardUseCompatPadding="true"
app:elevation="5dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/cardView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
app:cardElevation="5dp"
app:layout_constraintBottom_toBottomOf="@+id/cardView"
app:layout_constraintEnd_toEndOf="parent">
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="@+id/fabInvia"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:enabled="false"
android:gravity="center"
android:text="@string/invia"
android:textColor="#fff"
app:fabSize="normal"
app:iconTint="#fff" />
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
我有一个带有 CardView
和禁用 ExtendedFloatingActionButton
的布局,我以编程方式将其设置为启用,启用该 FAB 时一切正常,但是当我将其设置为禁用时,它会落后于卡.
我尝试通过为 FAB 设置更高的高度来为卡和 FAB 设置高度,但是当它被禁用时它无论如何都会高于..
这是它的样子:
我会显示它重叠,就像启用设置为 true 时一样:
这是我的代码:
<androidx.constraintlayout.widget.ConstraintLayout 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"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="@+id/fabInvia"
android:layout_width="wrap_content"
android:enabled="false"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:contentDescription="@string/invia"
android:text="@string/invia"
android:textColor="#fff"
app:elevation="10dp"
android:translationY="-33dp"
app:fabSize="normal"
app:icon="@drawable/ic_baseline_send"
app:iconTint="#fff"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="@+id/cardView" />
<androidx.cardview.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardElevation="5dp"
app:elevation="5dp"
app:cardUseCompatPadding="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
...
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>
你可以试试:
- 调换 XML 中的顺序(先是 cardview,然后是 FAB)
- 更改平移-z 值
- 将 fab 放置在约束布局顶部的单独框架布局中
此问题并非仅存在于残障人士 ExtendedFloatingActionButton
,任何其他视图都会有同样的表现。
原因:
因为CardView
有一个特殊的海拔属性app:cardElevation
只能应用于CardView
s,所以translation-z
或app:elevation
属性不会'解决不了这个问题。
解法:
正在将 ExtendedFloatingActionButton
包装成另一个 CardView
。但是需要一些努力才能使 CardView
像它不存在一样,为此您需要:
- 在两个
CardView
上设置完全相同的app:cardElevation
(这实际上解决了您遇到的海拔问题。 - 为新
CardView
设置透明背景颜色,app:cardBackgroundColor="@android:color/transparent"
出于某种原因不起作用,但以编程方式解决此问题:
cardView2.setBackgroundColor(ContextCompat.getColor(this, android.R.color.transparent));
也将constraints/margin从ExtendedFloatingActionButton
转移到外CardView
这是一个示例
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<androidx.cardview.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="200dp"
app:cardElevation="5dp"
app:cardUseCompatPadding="true"
app:elevation="5dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:id="@+id/cardView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
app:cardElevation="5dp"
app:layout_constraintBottom_toBottomOf="@+id/cardView"
app:layout_constraintEnd_toEndOf="parent">
<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
android:id="@+id/fabInvia"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:enabled="false"
android:gravity="center"
android:text="@string/invia"
android:textColor="#fff"
app:fabSize="normal"
app:iconTint="#fff" />
</androidx.cardview.widget.CardView>
</androidx.constraintlayout.widget.ConstraintLayout>